属性的简洁表示法
可以直接使用一个变量来初始化对象,变量名即属性名,变量值即属性值。
代码语言:javascript复制var foo = 'bar';
var baz = {foo};
console.log(baz);
// { foo: 'bar' }
// 等同于
var baz = {foo: foo};
另外一个例子
代码语言:javascript复制function f_es5(x, y) {
return { x: x, y: y };
}
function f_es6(x, y) {
return { x, y };
}
console.log(f_es5(1, 2));
// { x: 1, y: 2 }
console.log(f_es5(3, 4));
// { x: 3, y: 4 }
方法的简洁表示法
ES6 简洁方法后与一些面向对象的高级语言(如C )差不多,函数名 参数 花括号。另外注意简洁写法的属性名是按字符串解析的。方法的属性名可以是一些关键字,由于是按字符串来解析的,所以不会产生歧义。
代码语言:javascript复制var obj_es5 = {
'method': function () {
return 'Hello ES5 style.';
}
}
var obj_es6 = {
method() {
return 'Hello ES6 style.';
}
}
console.log(obj_es5.method());
console.log(obj_es6.method());
用表达式定义属性名和方法名
ES5 中仅允许使用字面常量来定义属性名和方法名,而 ES6 中允许使用表达式。比如两个字符串拼接成一个方法名,如下所示:
代码语言:javascript复制var attrKey = 'foo';
var funcName = 'show'
var obj = {
[attrKey]: true,
['get' 'Name']: 'Pency',
['print' 'Hello'] () { console.log('Hello!'); },
[`${funcName}Message`] () { console.log('Hi, this is a ES6 style function.'); }
}
console.log(obj.foo, obj.getName);
// true 'Pency'
obj.printHello();
// Hello!
obj.showMessage();
// Hi, this is a ES6 function.
Object.is() 方法
该方法用来弥补 == 和 === 的缺陷,可以严格对比两个对象是否相等。
代码语言:javascript复制console.log(Object.is('foo', 'foo'));
// true
console.log(Object.is({}, {}));
// false
console.log( 0 === -0);
// true
console.log(NaN === NaN);
// false
console.log(Object.is( 0, -0));
// false
console.log(Object.is(NaN, NaN));
// true
从书中复制过来的 ES5 实现 Object.is 的实现
代码语言:javascript复制Object.defineProperty(Object, 'is', {
value: function(x, y) {
if (x === y) {
// 针对 0 不等于 -0的情况
return x !== 0 1 / x === 1 / y;
}
// 针对NaN的情况
return x !== x && y !== y;
},
configurable: true,
enumerable: false,
writable: true
});
Object.assign() 方法
代码语言:javascript复制var target = { a: 1, b: 1 };
var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };
Object.assign(target, source1, source2);
console.log(target);
// { a: 1, b: 2, c: 3 }
Object.assign
常见的用法在书中也列举了很多,我觉得非常实用,所以自己手抄一下给大家分享,更多请参考原著。
// 给对象添加属性
class Point {
constructor(x, y) {
Object.assign(this, { x, y });
}
}
console.log(new Point(10, 20));
// Point { x: 10, y: 20 }
代码语言:javascript复制// 给对象添加方法
Object.assign(SomeClass.prototype, {
someMethod(arg1, arg2) {
// ...
},
anotherMethod() {
// ...
}
});
// 等同于下面的方式
SomeClass.prototype.someMethod = function (arg1, arg2) { /* ... */ };
SomeClass.prototype.anotherMethod = function () { /* ... */ };