之前总是搞不清Object.keys(),for...in，getOwnPropertyNames()这三者的关系，现在统一总结出来，方便记忆。
一、先看这三者的定义
-
for...in : 以任意顺序遍历一个对象的可枚举属性，以及对象从其构造函数原型中继承的属性（object.prototype）。对于每个不同的属性，语句都会被执行。
注：如果不想遍历object.prototype的属性，可以使用hasOwnProperty -
Object.keys(object) : 会返回一个由一个给定对象的自身 可枚举属性 组成的数组，数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致 。(相当for...in使用hasOwnProperty)
-
Object.getOwnPropertyNames(object) : 方法返回一个由指定对象的所有自身属性的属性名（包括不可枚举属性但不包括Symbol值作为名称的属性）组成的数组。
二、具体用法
所有用法都基于该例子
// 创建一个构造函数Person
function Person () {
}
// 给构造函数的原型对象创建两个属性，name，sayName
Person.prototype.name = 'mzong'
Person.prototype.sayName = function () {
console.log(this.name)
}
// 创建一个实例p1，给p1实例添加两个属性，work，eatting
var p1 = new Person()
p1.work = 'work'
p1.eatting = 'food'
1. for...in
for (var props in p1) {
console.log('for-in:: '+props)
}
// 结果
// for-in:: work
// for-in:: eatting
// for-in:: name 该属性继承于Person.prototype
// for-in:: sayName 该属性继承于Person.prototype
// 从结果可以看出，for...in不但循环自己属性，还会循环构造函数都prototype中都属性。
// 如果实例属性是不可枚举的话，那for...in能循环出来吗？
// 我们把p1的work属性设为不可枚举
Object.defineProperty(p1, 'work', {
enumerable: false // 默认为true，表示可枚举
})
// 继续循环
for (var props in p1) {
console.log('for-in:: '+props)
}
// 结果
// for-in:: eatting
// for-in:: name 该属性继承于Person.prototype
// for-in:: sayName 该属性继承于Person.prototype
// 看吧，work没被循环出来，因为是不可枚举的。
// 如果想要循环p1实例自己的属性，则使用hasOwnProperty即可。
for (var props in p1) {
if (p1.hasOwnProperty(props)) {
console.log('for-in:: '+props)
}
}
// 结果
// for-in:: work
// for-in:: eatting
// 从结果可以看出，如果实例p1只想要循环自己的属性，则使用hasOwnProperty即可。
2. Object.keys()
console.log(Object.keys(p1))
// 结果：["work", "eatting"]
// 得到是一个可枚举属性数据，只循环实例p1自身属性，不循构造函数的prototype。
// 可见Object.keys()相当于for...in使用hasOwnProperty。
// 同样的，如果work是不可枚举的，那Object.keys()能循环出来吗？
// 我们把p1的work属性设为不可枚举
Object.defineProperty(p1, 'work', {
enumerable: false // 默认为true，表示可枚举
})
console.log(Object.keys(p1))
// 结果：["eatting"]
// 看吧，work没被循环出来，因为是不可枚举的。
3. Object.getOwnPropertyNames()
Object.keys(Person.prototype)
// 结果
// ["name", "sayName"]
Object.getOwnPropertyNames(Person.prototype)
// 结果
// ["constructor", "name", "sayName"]
// 看吧，把constructor这个不可枚举的属性也循环出来啦。
总结
总结：在for...in循环当中，为了不去循环到构造函数的prototype中的属性，我们常用hasOwnProperty来过滤。而有了Object.keys()和getOwnPropertyNames之后，就可以代替for...in啦。
