ES6(ECMAScript 6)笔记7-对象的扩展

属性的简洁表示法

允许直接写入变量和函数作为对象的属性和方法,这样的书写更简洁。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
function f( x, y ) {
return { x, y };
}

// 等同于

function f( x, y ) {
return { x: x, y: y };
}

var o = {
method() {
return "Hello!";
}
};

// 等同于

var o = {
method: function() {
return "Hello!";
}
};
install
var Person = {

name: '张三',

//等同于birth: birth
birth,

// 等同于hello: function ()...
hello() { console.log('我的名字是', this.name); }

};

属性名表达式

定义对象的属性有2种方法。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// 方法一
obj.foo = true;

// 方法二
obj['a'+'bc'] = 123;

var lastWord = "last word";

var a = {
"first word": "hello",
[lastWord]: "world"
};

a["first word"] // "hello"
a[lastWord] // "world"
a["last word"] // "world"

表达式也可用用于定义方法名

1
2
3
4
5
6
7
let obj = {
['h'+'ello']() {
return 'hi';
}
};

console.log(obj.hello()); // hi

方法的name属性

函数的name属性,返回函数名。

1
2
3
4
5
6
7
8
9
10
11
var person = {
sayName: function() {
console.log(this.name);
},
get firstName() {
return "Nicholas"
}
}

person.sayName.name // "sayName"
person.firstName.name // "get firstName"

有两种特殊情况:bind方法创造的函数,name属性返回“bound”加上原函数的名字;Function构造函数创造的函数,name属性返回“anonymous”。

1
2
3
4
5
6
7
var doSomething = function() {
// ...
};

console.log(doSomething.bind().name); // "bound doSomething"

console.log((new Function()).name); // "anonymous"

Object.is()

用来比较两个值是否严格相等,它与严格比较 === 的行为基本一致,不同之处只有2个:一个是+0不等于-0,第二个是NaN等于自身。

Object.assign()
用来将源对象的所有可枚举属性复制到目前对象,它至少要2个对象作为参数,第一个参数是目标对象,后面的参数都是源对象,并且只要一个参数不是对象,就会TypeError。

1
2
3
4
5
6
7
var target = { a: 1 };

var source1 = { b: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

如果目标对象和源对象有同名,后面的属性覆盖前面的。

1
2
3
4
5
6
7
var target = { a: 1, b: 1 };

var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

Object.setPrototypeOf() Object.getPrototypeOf() Proxy() get() set() apply() ownKeys() Reflect()