我们有很多方法可以对JavaScript对象进行迭代，在这篇博客中，我们将结合实例讨论JavaScript中循环对象的7种方法。同样的例子也适用于typecript。
如何在javascript中迭代对象？
对象是一组由逗号分隔的键和值，如何列举一个javascript对象的属性？
以下是循环一个普通对象的不同方法：
- 简单的for-in循环
- ES5 Object.keys()方法
- ES6 for-of 循环
- ES8 Object. entries()方法
- Jquery每个函数
- 宿命的forOwn和forIn函数
- underscoreJS的each方法
让我们声明一个带有键和值列表的对象
var obj = {
"id": "1",
"name": "franc",
"salary": "5000"
};
并且预期的输出是
id - 1
name - franc
salary - 5000
使用for-in循环进行迭代
for-in是JavaScript中的一个简单的循环，用来迭代一个对象的关键属性。
- 它返回一个对象的键而不是对象本身。
- 它还可以使用原型继承来列举一个对象的父属性。
- if条件表达式中的hasOwnProperty()方法用于忽略父属性。
- 最后，将键和值用连字符分开显示到控制台。
例子
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key + " - " + obj[key]);
}
}
使用ECMAScript 5 object. entries方法。
ES6引入了Object.keys()和forEach方法，以返回对象的枚举属性。
- Object.key只循环自己的属性，不循环原型键。
- 它也用于返回一个对象或数组的枚举键。
- 返回的数组是无序的
- 它返回一个给定对象的键字符串的数组。
- forEach适用于有普通键的对象，但不适合于数组
- forEach与break、continue和return的组合将不能一起使用。
Object.keys(obj).forEach(function(key) {
console.log(key+" - "+obj[key]);
});
使用ES6的for-of循环
ES6增加了新的for-of循环语法，以简单的方式枚举对象和数组。
for (const key of Object.keys(obj)) {
console.log(key+" - " +obj[key]);
}
使用ECMAScript 8 object. entries方法
object. entries是ES8中引入的新方法，它可能在最新的浏览器中工作，在旧的浏览器中可以使用polyfill或启用babel插件来支持。它迭代对象自己的键，但忽略了原型继承的键。
for (let [key, value] of Object.entries(obj)) {
console.log(`${key}- ${value}`);
}
JQuery每个循环元素
Jquery库提供了每个函数来迭代一个jquery对象的属性。第一个参数是一个对象，第二个参数是一个回调。回调适用于一个对象的每个元素。
$.each(obj, function(key, value) {
console.log(key+" - "+value);
});
Lodash forOwn和forIn函数
forOwn()函数在Lodash中用于遍历对象自身的属性forIn()函数返回遍历对象的属性，包括继承的原型属性。这两个函数的工作原理是，每个属性都返回迭代对象。每个迭代对象有三个值--值、键和对象
_.forOwn(obj, function(value, key) {
console.log(key+" - "+value);
} );
_.forIn(obj, function(value, key) {
console.log(key+" - "+value);
} );
uderscoreJs的每个函数
每个方法都是underscoreJS的一个实用函数，。
它对一个对象的键进行迭代，并为每个属性返回迭代对象。
Iterates接受对象和回调，回调接受对象的值和键属性。
_.each(person, function(value, key) {
console.log(key +" - "+ value);
});
