跳到主内容

JS如何遍历对象,类似于数组遍历

· 3分钟阅读

我有一个对象:

myObject = { a: 1, b: 2, c: 3 };

我正在寻找一种类似Array.prototype.map来遍历对象

newObject = myObject.map(function (value, label) {
return value * value;
}); // newObject is now { 'a': 1, 'b': 4, 'c': 9 }

Javascript 有这样的map对象函数吗?(我想要这个用于 Node.JS,所以我不关心跨浏览器的问题。)

解决方法

没有原生mapObject对象,但这个怎么样:

var myObject = { a: 1, b: 2, c: 3 };
Object.keys(myObject).map(function (key, index) {
myObject[key] *= 2;
});
console.log(myObject); // => { 'a': 2, 'b': 4, 'c': 6 }

但是您可以使用for ... in以下方法轻松迭代对象:

var myObject = { a: 1, b: 2, c: 3 };
for (var key in myObject) {
if (myObject.hasOwnProperty(key)) {
myObject[key] *= 2;
}
}
console.log(myObject); // { 'a': 2, 'b': 4, 'c': 6 }

很多人都提到,前面的方法不返回新对象,而是对对象本身进行操作。就此而言,我想添加另一个解决方案,该解决方案返回一个新对象并将原始对象保持原样:

var myObject = { a: 1, b: 2, c: 3 }; // returns a new object with the values at each key mapped using mapFn(value)
function objectMap(object, mapFn) {
return Object.keys(object).reduce(function (result, key) {
result[key] = mapFn(object[key]);
return result;
}, {});
}
var newObject = objectMap(myObject, function (value) {
return value * 2;
});
console.log(newObject); // => { 'a': 2, 'b': 4, 'c': 6 }console.log(myObject);// => { 'a': 1, 'b': 2, 'c': 3 }

Array.prototype.reduce通过将前一个值与当前值进行某种程度的合并,将数组缩减为单个值。该链由一个空对象初始化{}。在每次迭代中,myObject都会添加一个新的键,并将键作为值的两倍。

有了新的 ES6 特性,有一种更优雅的方式来表达objectMap.

const objectMap = (obj, fn) => Object.fromEntries(Object.entries(obj).map(([k, v], i) => [k, fn(v, k, i)]));
const myObject = { a: 1, b: 2, c: 3 };
console.log(objectMap(myObject, (v) => 2 * v));