ECMAScript6(ES6)標準之物件Object擴充套件方法及新特性
阿新 • • 發佈:2019-02-08
ES6對於Object也擴增了幾個方法
不過最重要的是
ES6擴充套件了一些語法
比如說允許直接寫入變數和函式,作為物件的屬性和方法
使我們的物件更加簡潔
下面我就來詳細說明一下
語法擴充套件
簡寫物件屬性
let name = 'payen';
let obj = {
name,
age: 19
}
console.log(obj);
//{"name":"payen","age":19}
從這個例子可以看出省略屬性值的屬性
它的值就是變數對應的值
比如說我的函式想要返回一個物件
物件的屬性與引數同名
那麼現在我們就可以這樣寫
let a = 1,
b = 2;
function foo(a, b){
return {a, b};
}
console.log(foo(a, b));
//{a: 1, b: 2}
這個函式就等價於
function foo(a, b){
return {a: a, b: b};
}
簡寫物件方法
現在除了屬性可以簡寫,方法也可以簡寫了
看這裡
let person = {
say(){
console.log("hello world~");
}
}
person.say(); //hello world~
沒錯這也可以輸出
它就是下面這種形式的簡寫
let person = {
say: function(){
console.log("hello world~");
}
}
把“:”和“function”去掉就可以了
新增物件屬性
let person = {};
在ES6之前我們要想向物件中新增屬性
我們只能這麼寫,利用識別符號
person.name = 'payen';
但是強大的ES6允許我們使用表示式作為屬性
person['a'+'g'+'e'] = 19;
我們還可以這樣用
let attr1 = 'name',
attr2 = 'age' ,
attr3 = 'sex';
let person = {
[attr1]: 'payen',
[attr2]: 19,
[attr3]: 'male'
}
console.log(person);
//{name: "payen", age: 19, sex: "male"}
使用“[ ]”可以讓變數所代表的值作為物件的屬性
方法擴充套件
同值相等Object.is()
這個靜態方法用於比較兩個值是否嚴格相等
大家可能要問了,嚴格相等使用“===”不就得了
不是的
這個方法是 真·嚴格相等
“===”與“==”都是有缺點的
“==”發生型別轉換大家都知道
而“===”
console.log(NaN === NaN); //false
console.log(+0 === -0); //true
ES6提出了“Same-value equality”(同值相等)演算法
用來解決這個問題
Object.is()就是部署這個演算法的新方法
console.log(Object.is(NaN, NaN)); //true
console.log(Object.is(+0, -0)); //false
物件合併Object.assign()
這個方法用於合併物件,注意還是淺拷貝
let obj = {
name1: 'foo'
};
let obj1 = {
name2: 'bar'
};
let obj2 = {
name3: 'baz'
};
Object.assign(obj,obj1,obj2);
console.log(obj);
//{name1: "foo", name2: "bar", name3: "baz"}
obj1和obj2中的鍵和值均被拷貝到了obj物件中
當然了,被拷貝的物件內部是不變的
引數沒有限制
第一個引數就是被拷入的物件
還有一點要注意,如果出現了同名屬性
這個方法的處理是覆蓋
let target = {
name: 'a'
};
let source = {
name: 'b'
};
Object.assign(target, source);
console.log(target);
//{name: "b"}