1. 程式人生 > >es6 -- 物件的擴充套件(常用)

es6 -- 物件的擴充套件(常用)

目錄

 

1.屬性的簡寫

2.Object API

3.擴充套件運算子


1.屬性的簡寫

如果物件中只寫屬性名,不寫屬性值。這時,屬性值等於屬性名所代表的變數。 

//es5寫法
var name='cc';
var obj={
    name:name,
    age:12
}

//es6
var obj={
    name,
    age:12
}

2.Object API

es6對於Object建構函式也進行了擴充套件,加入了一些方法,如下。

1.Object.is()

用於比較兩個值是否嚴格相等。與(===)基本一致,不同之處如下:

+0===-0  //true

NaN===NaN //false

Object.is(+0,-0); //false

Object.is(NaN,NaN); //true

2.Object.assign()

用來將源物件的所有可列舉屬性複製到目標物件。它至少需要兩個物件作為引數,第一個引數是目標物件,後面的引數都是源物件。只要有一個引數不是物件就會報錯

var a={name:'cc',age:12};
var b={gender:'male'};
var c={name:'cc01'};

//將b,c加入到a中
Object.assign(a,b,c); //{name: "cc01", age: 12, gender: "male"}

2.1 為物件新增方法

Object.assign(Person.prototype,{
    sayName(){
        ...
    },
    sayAge(){
        ...
    }
});

//===>等價
Person.prototype.sayName=function(){...};
Person.prorotype.sayAge=function(){...};

3.Object.setPrototypeOf(obj,prototype)

將prototype物件設定為obj的原型。

function Animal(){
    ...
}
function Dog(){
    ...
}
//繼承
Dog.prototype=new Animal();

//es6
Object.setPrototypeOf(Dog,new Animal);

 4.Object.getPrototypeOf(obj)

用於讀取一個物件的prototype物件

5. Object.keys(obj)

返回一個數組,包括自身的(不包含繼承的)所有可列舉屬性(Symbol屬性)

**:for-in 遍歷物件自身和繼承的可列舉屬性。

6. Object.values()

返回物件中包含所有屬性值的陣列

7. Object.entries()

返回物件所有鍵值對組成的陣列

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

Object.keys(obj); //["a","b","c"];
Object.values(obj); //[1,2,3];
Object.entries(obj); //[["a",1],["b",2],["c",3]]

3.擴充套件運算子

該運算子用於取出引數物件的所有可遍歷屬性,複製到當前物件中。

let obj={name:'cc',age:12};
let n={...obj};
console.log(n);//{name:'cc',age:12}

合併物件 

var a={
    sayName(){
        console.log('say Name');
    }
}
var b={
    ...a,
    sayAge(){
        console.log('say age');
    }
}
b.sayName();