ES6學習筆記（對象新增方法）

1.Object.is()

ES5 比較兩個值是否相等，只有兩個運算符：相等運算符（==）和嚴格相等運算符（===）。它們都有缺點，前者會自動轉換數據類型，後者的NaN不等於自身，以及+0等於-0。

Object.is 就是部署這個算法的新方法。它用來比較兩個值是否嚴格相等，與嚴格比較運算符（===）的行爲基本一致。

Object.is('foo', 'foo') // true Object.is({}, {}) // false

 不一樣之處只有兩個：一是+0不等於-0，二是NaN等於自身。

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

 

2.Object.assign()

Object.assign 方法用於對象的合併，將源對象（source）的全部可枚舉屬性，複製到目標對象（target）。

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

 Object.assign方法的第一個參數是目標對象，後面的參數都是源對象。

 注意，若是目標對象與源對象有同名屬性，或多個源對象有同名屬性，則後面的屬性會覆蓋前面的屬性。

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

常見用途

 （1）爲對象添加屬性

class Point {
constructor(x, y) {
Object.assign(this, {x, y});
}
}

 （2）爲對象添加方法

Object.assign(SomeClass.prototype, {
someMethod(arg1, arg2) {
···
},
anotherMethod() {
···
}
});
 // 等同於下面的寫法 SomeClass.prototype.someMethod = function (arg1, arg2) {
···
};
SomeClass.prototype.anotherMethod = function () {
···
};

 （3）克隆對象

function clone(origin) {
return Object.assign({}, origin);
}

 （4）合併多個對象

const merge =
(target, ...sources) => Object.assign(target, ...sources);

 若是但願合併後返回一個新對象，能夠改寫上面函數，對一個空對象合併

const merge =
(...sources) => Object.assign({}, ...sources);

 （5）爲屬性指定默認值

const DEFAULTS = {
logLevel: 0,
outputFormat: 'html'
};
function processContent(options) {
options = Object.assign({}, DEFAULTS, options);
console.log(options);
 // ... }

 

3. Object.setPrototypeOf()和Object.getPrototypeOf()

 __proto__屬性沒有寫入 ES6 的正文，而是寫入了附錄，緣由是__proto__先後的雙下劃線，說明它本質上是一個內部屬性，而不是一個正式的對外的 API，只是因爲瀏覽器普遍支持，才被加入了 ES6。標準明確規定，只有瀏覽器必須部署這個屬性，其餘運行環境不必定須要部署，並且新的代碼最好認爲這個屬性是不存在的。所以，不管從語義的角度，仍是從兼容性的角度，都不要使用這個屬性，而是使用下面的Object.setPrototypeOf()（寫操做）、Object.getPrototypeOf()（讀操做）、Object.create()（生成操做）代替。

 Object.setPrototypeOf方法的做用與__proto__相同，用來設置一個對象的prototype對象，返回參數對象自己。它是 ES6 正式推薦的設置原型對象的方法。

let proto = {};
let obj = { x: 10 };
Object.setPrototypeOf(obj, proto);
proto.y = 20;
proto.z = 40;
obj.x // 10 obj.y // 20 obj.z // 40

 Object.getPrototypeOf，用於讀取一個對象的原型對象。

function Rectangle() {
 // ... }
const rec = new Rectangle();
Object.getPrototypeOf(rec) === Rectangle.prototype // true 
Object.setPrototypeOf(rec, Object.prototype);
Object.getPrototypeOf(rec) === Rectangle.prototype // false

 

4.Object.keys(), Object.values()和Object.entries()

var obj = { foo: 'bar', baz: 42 };
Object.keys(obj) // ["foo", "baz"]

let { keys, values, entries} = Object;

let obj = { a: 1, b: 2, c: 3 };

for ( let key of keys( obj)) {

console. log( key); // 'a', 'b', 'c'

}

for ( let value of values( obj)) {

console. log( value); // 1, 2, 3

}

for ( let [ key, value] of entries( obj)) {

console. log([ key, value]); // ['a', 1], ['b', 2], ['c', 3]

}

 

5.Object.fromEntries()

Object.fromEntries() 方法是 Object.entries() 的逆操做，用於將一個鍵值對數組轉爲對象。

Object.fromEntries([
  ['foo', 'bar'],
  ['baz', 42]
]) // { foo: "bar", baz: 42 }