js知识梳理2:对象属性的操做

写在前面

注：这个系列是本人对js知识的一些梳理，其中很多内容来自书籍:Javascript高级程序设计第三版和JavaScript权威指南第六版，感谢它们的做者和译者。有发现什么问题的，欢迎留言指出。

1.属性的查询和设置

①基本语法

这个简单，能够经过点（.）或方括号（[]）运算来获取属性的值，注意点运算符后的标识符不能是保留字，方括号内的表达式必须返回字符串或返回一个能够转换成字符串的值。

var person = {
    name:'jaychou',
    height:172,
    sayName:function () {
        console.log(this.name);
    }
};
console.log(person['name']);
console.log(person.height);

每每有一些场景使用方括号比点语法更灵活：

var addr = "";
for(var i=0;i<4;i++){
    //读取customer对象的address0,address1,address2,address3属性
    addr += customer["address"+i] + '\n';
}

②继承相关的影响

原型链实现了属性的继承。简单说，若是给对象o的属性x赋值，若是o中已经有属性x（自有属性，不是继承来的），那就会改变这个已有属性x的值。若是o中不存在属性x，那么赋值操做给o添加一个新属性x。若是以前o继承了属性x，那么这个继承的属性就建立的同名属性覆盖了。固然，若是属性的writable是false，就会抛出错误。

可是若是这个继承来的属性是具备setter方法的存取器属性，这时会调用setter方法而不是给o建立一个属性x。继承来的属性是只读的，才会在o上建立属性。

③属性访问错误

查询一个不存在的属性不会报错，返回undefined。但若是尝试查询这个不存在的对象它的属性就会报错。

给null和undefined设置属性会报类型错误，严格模式下，设置属性操做只要失败都会抛出类型错误异常。

2.删除属性

delete运算符能够删除对象的属性，注意的是delete只是断开属性和宿主对象的联系，而不会去操做属性中的属性，并且为了不内存泄漏，在销毁对象的时候，要遍历属性中的属性，依次删除。

delete运算符只能删除自有属性（这是确定的，不然就影响了整个原型链的对象）。

3.检测属性

判断某个属性是否存在于某个对象中即为检测属性，经常使用方法：in运算符、hasOwnProperty()、propertyIsEnumerable()，或者以前说起的属性查询也能够。

//in运算符：若是对象的自有属性或继承属性中包含这个属性则返回true:
var o = {x:1};
console.log("x" in o);//true:
console.log("y" in o);//false
console.log("toString" in o);//true:
//hasOwnProperty:检测是不是对象的自有属性
console.log(o.hasOwnProperty("x"));//true
console.log(o.hasOwnProperty("y"));//false
console.log(o.hasOwnProperty("toString"));//false
//propertyIsEnumerable:hasOwnProperty的加强版，是自有属性且可枚举
console.log(o.propertyIsEnumerable("x"));//true
console.log(Object.prototype.propertyIsEnumerable("toString"));//false:不可枚举

其余小办法：!==判断一个属性是不是undefined（缺陷：!==没法区分不存在的属性和存在但值为undefined的属性）

console.log(o.x !== undefined);//true
console.log(o.y !== undefined);
console.log(o.toString !== undefined);//true

4.枚举属性

经常使用的遍历对象属性的方法（未包括ES6）：for-in循环、Object.keys()、Object.getOwnPropertyNames()。

①for-in循环

for-in循环能够遍历对象中全部可枚举的属性（包括自有属性和继承属性）:

var o1 = {x:1,y:1,_z:111};
Object.defineProperty(o1,'sayX',{
    value:function () {
        console.log(this.x);
    },
    enumerable:false
});
Object.defineProperty(o1,'z',{
    get:function () { return this._z; },
    set:function (v) { this._z = v; },
    enumerable:false
})
//打印x,y,_z，不会打印sayX和z，由于其enumerable为false
for(var p in o1) console.log(p);

②Object.keys()

返回一个数组，这个数组由对象中可枚举的自有属性的名称组成。

//打印["x", "y", "_z"]
console.log(Object.keys(o1));

③Object.getOwnPropertyNames()

和Object.keys()相似，只是它返回对象的全部自有属性的名称，包括不可枚举的。

//打印["x", "y", "_z", "sayX", "z"]
console.log(Object.getOwnPropertyNames(o1));
//打印["constructor", "__defineGetter__", "__defineSetter__", 
// "hasOwnProperty", "__lookupGetter__", "__lookupSetter__", 
// "isPrototypeOf", "propertyIsEnumerable", "toString", 
// "valueOf", "__proto__", "toLocaleString"]
console.log(Object.getOwnPropertyNames(Object.prototype));

④小拓展

给Object.prototype添加一个不可枚举的extend()方法，这个方法将做为参数传入的对象的全部自有属性（包括不可枚举的）一一复制，除了值，也复制属性的全部特性，除非在目标对象中存在同名的属性。

Object.defineProperty(Object.prototype,'extend',{
   configurable:true,
   enumerable:false,//不可枚举
   writable:true,
   value:function (o) {
       //先获取o的所有自有属性（包括不可枚举的）
       var names = Object.getOwnPropertyNames(o);
       for(var i=0,len=names.length;i<len;i++){
           //若是属性已经存在，跳过
           if(names[i] in this) continue;
           //获取属性的描述符
           var desc = Object.getOwnPropertyDescriptor(o,names[i]);
           //建立属性到this
           Object.defineProperty(this,names[i],desc);
       }
    }
});

使用：
var emptyO = {_z:10};
//除了已有的属性_z，其余o1的全部属性描述符都复制过去了
emptyO.extend(o1);
console.log(emptyO);