ECMAScript6 新特性——“对象的扩展”

1 属性的简洁表示法

ES6允许直接写入变量和函数作为对象的属性和方法。

写入属性

var name = "value";
var obj = {
    name
};
console.log(obj.name); //value

写入方法

var func = function(){return "function"};
var obj = {
    func
};
console.log(obj.func()); //function

举个例子：

let name = "Oliver";
let sayName = function() {
    console.log(this.name);
};
let person = {
    name,
    sayName
};
console.log(person.name); //Oliver
person.sayName(); //Oliver

传统的写法：

let person = {
    name: "Oliver",
    sayName: function() {
        console.log(this.name);
    }
};
console.log(person.name); //Oliver
person.sayName(); //Oliver

不用必需填写属性的值

function log(x, y) {
    return {x, y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}

传统的写法：

function log(x, y) {
    return {x: x, y: y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}

需要注意的是这种写法中的属性名总是字符串。

2 属性名表达式

JavaScript语言定义对象的属性，有两种方法:

var o = {};
function f() {return "boo" + "lean";}
o.bool = true; //方法一
o[f()] = false; //方法二
console.log(o); //Object {bool: true, boolean: false}

但是在字面亮方式定义对象的时候只能使用方法一：

var o = {
    bool: true
};
console.log(o); //Object {bool: true}

ES6支持使用方法二：

function f() {
    return "bool" + "ean";
}
var o = {
    bool: true,
    [f()]: false
};
console.log(o); //Object {bool: true, boolean: false}

3 方法的name属性

函数的name属性返回函数名，对象方法也是函数，因此也有name属性。

4 Object.is()

该方法与（===）基本一致，不同的是＋0不等于－0，NaN等于自身：

console.log(NaN === NaN); //false
console.log(Object.is(NaN, NaN)); //true
console.log(+0 === -0); //true
console.log(Object.is(+0, -0)); //false

5 Object.assign()

用来将源对象（source）的所有可枚举属性复制到目标对象（target），第一个参数为目标对象，之后的参数都是源对象

var o1 = {
    a: 1
};
var o2 = {
    b: 2,
    c: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 1, b: 2, c: 3}

同名属性，后面的会覆盖前面的：

var o1 = {
    a: 1
};
var o2 = {
    a: 2,
    b: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 2, b: 3}

嵌套对象，处理方法是替换，而不是添加：

var o1 = {
    a: {
        b: 1,
        c: 2
    },
    d: 1
};
var o2 = {
    a: {
        b: "str"
    },
    d: 4
};
Object.assign(o1, o2);
console.log(o1);
//Object {a: Object, d: 4}
    //a:Object
        //b:"str"
    //__proto__:Object
    //d:4
//__proto__:Object

数组，处理方法是视为对象：

var a = [1, 2, 3, 4, 5];
var b = [2, 0];
Object.assign(a, b);
console.log(a); //[2, 0, 3, 4, 5]

6 属性的遍历

ES6一共有6种方法可以遍历对象的属性。

• for...in: for...in循环遍历对象自身的和继承的可枚举属性（不含Symbol属性）。

• Object.keys(obj): Object.keys返回一个数组，包括对象自身的（不含继承的）所有可枚举属性（不含Symbol属性）。

• Object.getOwnPropertyNames(obj): Object.getOwnPropertyNames返回一个数组，包含对象自身的所有属性（不含Symbol属性，但是包括不可枚举属性）。

• Object.getOwnPropertySymbols(obj): Object.getOwnPropertySymbols返回一个数组，包含对象自身的所有Symbol属性。

• Reflect.ownKeys(obj): Reflect.ownKeys返回一个数组，包含对象自身的所有属性，不管是属性名是Symbol或字符串，也不管是否可枚举。

• Reflect.enumerate(obj): Reflect.enumerate返回一个Iterator对象，遍历对象自身的和继承的所有可枚举属性（不含Symbol属性），与for...in循环相同。

---

以上的6种方法遍历对象的属性，都遵守同样的属性遍历的次序规则。

• 首先遍历所有属性名为数值的属性，按照数字排序。

• 其次遍历所有属性名为字符串的属性，按照生成时间排序。

• 最后遍历所有属性名为Symbol值的属性，按照生成时间排序。

7 Object.getPrototypeOf()和Object.setPrototypeOf()

尽量避免使用__proto__获取prototype。

而是使用下面的Object.setPrototypeOf()（写操作）、Object.getPrototypeOf()（读操作）、Object.create()（生成操作）代替。

---

var o = {
    name: "Oliver",
    age: 18
};
var proto = {};
Object.setPrototypeOf(o, proto);

proto.getName = function() {
    return this.name;
};

console.log(o.getName()); //Oliver
console.log(Object.getPrototypeOf(o));
//Object {} getName : () __proto__ : Object

8 ES7:Object.values()，Object.entries()

ES5中有Object.keys返回一个数组，成员是参数对象自身的（不含继承的）所有可遍历（enumerable）属性的键名。

var o = {
    name: "Oliver",
    age: 18
};
console.log(Object.keys(o)); //["name", "age"]

ES7提案或将加入Object.values()，Object.entries()两个方法

类似数组的上述几种方法。

9 ES7:对象的扩展运算符

目前，ES7有一个提案，将Rest解构赋值/扩展运算符（...）引入对象。

10 ES7:Object.getOwnPropertyDescriptors()

ES5中有Object.getOwnPropertyDescriptor();