使用 JavaScript 更新对象中的所有值

作者

在 JavaScript 中更新对象中的所有值

Update all the Values in an Object using JavaScript

要更新对象中的所有值：

  1. 使用该Object.keys()方法获取对象键的数组。
  2. 使用该方法遍历数组forEach()并更新每个值。
  3. 最后一次迭代后，对象中的所有值都将更新。
索引.js
const obj = {
  country: 'Chile',
  city: 'Santiago',
  address: 'Example',
};

Object.keys(obj).forEach(key => {
  obj[key] = '';
});

// 👇️ {country: '', city: '', address: ''}
console.log(obj);
如果您正在寻找不改变原始对象的解决方案，请向下滚动到下一个副标题。

我们使用
Object.keys
方法获取对象键的数组。

索引.js
const obj = {
  country: 'Chile',
  city: 'Santiago',
  address: 'Example',
};

// 👇️ ['country', 'city', 'address']
console.log(Object.keys(obj));

下一步是使用
Array.forEach
方法遍历键数组。

我们传递给forEach()方法的函数会为数组的每个元素调用并传递 3 个参数：

  1. 数组元素
  2. 指数
  3. 阵列

如果需要使用索引，将回调函数的第二个参数赋值给一个变量。

索引.js
const obj = {
  country: 'Chile',
  city: 'Santiago',
  address: 'Example',
};

Object.keys(obj).forEach((key, index) => {
  obj[key] = obj[key] + index;
});

// 👇️ {country: 'Chile0', city: 'Santiago1', address: 'Example2'}
console.log(obj);

更新一个对象中的所有值而不改变

要更新对象中的所有值：

  1. 使用该Object.keys()方法获取对象键的数组。
  2. 使用该reduce()方法遍历数组。
  3. 在每次迭代中，返回一个新对象，其中包含前一次迭代的值和更新后的值。
索引.js
const obj = {
  country: 'Chile',
  city: 'Santiago',
  address: 'Example',
};

const newObj = Object.keys(obj).reduce((accumulator, key) => {
  return {...accumulator, [key]: ''};
}, {});

console.log(newObj); // 👉️ {country: '', city: '', address: ''}

// 👇️ {country: 'Chile', city: 'Santiago', address: 'Example'}
console.log(obj);

Object.keys()我们使用该方法获得了对象键的数组。

Array.reduce方法允许我们

迭代数组。

我们传递给方法的函数会为数组中的每个元素（键）调用。

我们为变量传递了一个空对象的初始值accumulator。

在每次迭代中，我们使用
扩展语法 (…)
将对象的键值对解包为一个新对象并更新当前值。

我们从回调函数返回的reduce()
值作为累加器的下一个值传递给方法。

这种方法不会改变原始对象的值，它返回一个新对象。

–