对象的遍历方法总结
一、对象常用遍历方式
for...in
Object.keys()
Object.getOwnPropertyNames()
Object.getOwnPropertySymbols()
Reflect.ownKeys()
二、对象的属性分类和Symbol属性
1.对象的属性分类
- 原型属性
- 对象自身的可以枚举属性
- 对象自身的不可枚举属性
- symbol属性
// 注意: Object.create是利用给定的对象作为原型对象进行创建新的对象
const obj = Object.create({
bar: 'bar'// 原型属性
});
obj.foo = 'foo';// 对象的自身可枚举属性
Object.defineProperty(obj, 'name', {
// 对象自身不可枚举的属性
enumerable: false,
value: 'kongs'
});
obj[Symbol('age')] = 'age'; // 对象的symbol属性
2.关于Symbol属性的拓展
代码如下（示例）：
1、let a = Symbol('a'), 创建symbol实例是不能用new创建的
2、具有相同描述的symbol实例是不相等的, Symbpl('b') != Symbol('b')
3、如果想得到同一个描述的相等的两个symbol,可以这样:Symbol.for('c') == Symbol.for('c')
三、对象的遍历方法说明
1.for…in循环
- 该方法是可以获取对象自身的可枚举属性 + 原型链上的可以枚举属性,但是不含symbol属性
// 3.1
for(let key in obj) {
console.log(key)
};
// 结果会输出: bar foo
// 3.2 如果想过滤掉原型上的属性可以这样:
for(let key in obj) {
if (obj.hasOwnProperty(key)) {
console.log(key)
}
};
// 结果会输出: foo
// 3.3 for..in的输出顺序:
// 对于大于等于0的整数,会按照大小进行排序, 对于小数和负数就会当作字符串处理
// 对于string类型,按照第一的顺序进行输出
// symbol属性将被过滤掉,不会输出
const obj2 = {
5: '5',
a: 'a',
1: '1',
c: 'c',
'-1': '-1',
'3': '3',
b: 'b'
}
for(let key in obj2) {
console.log(key);
}
// 结果会输出: 1 3 5 a c -1 b
2.Object.keys()方法
- 该方法获取对象自身的可枚举属性
- 不包含原型上的可枚举属性和symbol属性
- es5新增
Object.keys(obj).forEach(key => console.log(key)) // 输出: foo
3.Object.getOwnPropertyNames()方法
- 该方法获取对象自身的所有属性,包括不可枚举属性
- 但是不包含原型属性和symbol属性
- es5新增
Object.getOwnPropertyNames(obj).forEach(i => console.log(i))// 输出: foo name
// 拓展:如何判断属性是否可以枚举?
//方法一:
Object.getOwnPropertyDescriptor(obj, 'name')
//方法二:
Object.prototype.propertyIsEnumerable.call(obj, ['name'])
4.Object.getOwnPropertySymbols()方法
- 该方法获取对象自身所有的symbol属性
- 不包括原型上的symbol属性
- es6新增
Object.getOwnPropertySymbols(obj).forEach(i => console.log(i));// 输出: Symbol(age)
5.Reflect.ownKeys()方法
- 该方法获取对象自身的所有属性,包括不可枚举和symbol属性
- es6新增
Reflect.ownKeys(obj).forEach(i => console.log(i)); // 输出: foo name Symbol(age)