ES6中Object的新特性

---

成員速寫

成員速寫是當返回的屬性名和返回的值一致時可以簡寫

function create(userName, userAge) {
    return {
        userName,
        userAge
    }
}
console.log(create('robbit', 18))

// {userName: "robbit", userAge: 18}

---

方法速寫

對象字面量初始化時可以簡寫

function create(userName, userAge) {
    return {
        userName,
        userAge,
        print() {
            console.log(this.userName, userAge)
        }
    }
}
var user = create('robbit', 18)
user.print()

// robbit 18

---

計算屬性名

在我們從後臺返回的參數我們不知道屬性名，此時我們可以使用計算屬性名。

const prop1 = 'userName';
const prop2 = 'userAge';
const prop3 = 'print';

const user = {
    [prop1]: 'robbit',
    [prop2]: 18,
    [prop3]() {
        console.log(this[prop1], this[prop2])
    }
}
console.log(user[prop1], user[prop2])
user[prop3]()

// user[prop1] => robbit
// user[prop2] => 18
// user[prop3] => robbit 18

---

is() 判斷

判斷兩個值是否全等，除了一下兩種情況。

console.log(NaN === NaN);
// false

console.log(Object.is(NaN, NaN))
// true

console.log(+0 === -0);
// true

console.log(Object.is(+0, -0))
// false

---

assign() 混合對象

用於混合對象，後值會覆蓋前值。

const obj1 = {
    a: 123,
    b: "abc",
};
const obj2 = {
    b: 456,
    c: "def"
};
const obj = Object.assign(obj1, obj2)
console.log(obj)

// {a: 123, b: 456, c: "def"}

---

setPrototypeOf() 設置隱式原型

傳遞兩個對象參數，將後一個對象設置爲前一個對象的隱式原型。

const obj1 = {
    a: 1
}
const obj2 = {
    b: 2
}
Object.setPrototypeOf(obj1, obj2)
console.log(obj1)

// { a: 1,
//	 __proto__: {
//		b: 2
//	 }
// }

---

setPrototypeOf() 返回屬性名

返回對象的所有自身屬性的屬性名（包括不可枚舉屬性但不包括Symbol值作爲名稱的屬性）組成的數組。

const obj = {
    a: 1,
    b: 2,
    [Symbol("abc")]: 3
}
console.log(Object.getOwnPropertyNames(obj))

// ["a", "b"]

---

constructor 類的聲明

class Person {
    constructor(job, name, age, sex) {
        this.job = job;
        this.name = name;
        this.age = age;
        this.sex = sex;
    }
    print() {
        console.log('工作:', this.job)
        console.log('姓名:', this.name)
        console.log('年齡:', this.age)
        console.log('性別:', this.sex)
    }
}
const a = new Person("程序猿", "robbit", 18, "男");
console.log(a)

類的聲明不會提前，和let、const一樣，有臨時性死區
類的所有代碼都在嚴格模式下執行的
類的所有方法都是不可枚舉的

for (const prop in a) {
    console.log(prop)
}

// job
// name
// age
// sex

類的構造器必須使用 new 調用

const a = Person("程序猿", "robbit", 18, "男");

// TypeError: Class constructor Person cannot be invoked without 'new'

類的所有方法都無法當成構造函數直接使用

const b = new a.print()

// TypeError: a.print is not a constructor

---

getter 綁定屬性

將對象屬性綁定到查詢該屬性時將被調用的函數。

class Person {
    constructor(name) {
        this.name = name;
    }
    get age() {
        return 10
    }
    print() {
        console.log('姓名:', this.name)
        console.log('年齡:', this.age)
    }
}

var user = new Person('robbit')
console.log(user)

---

setter 設置屬性

當嘗試設置屬性時，set語法將對象屬性綁定到要調用的函數。

class Person {
    constructor(name, age) {
         this.name = name;
         this.age = age;
     }
    set age(age) {
        if (age < 0) {
            age = 0
        } else if (age > 200) {
            age = 200
        }
        this._age = age;
    }
    print() {
        console.log('姓名:', this.name)
        console.log('年齡:', this.age)
    }
}

var user = new Person('robbit', 300)
console.log(user)

// Person {name: "robbit", _age: 200}

---

setter和getter結合判斷賦值

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    get age() {
        return this._age
    }
    set age(age) {
        if (age < 0) {
            age = 0
        } else if (age > 200) {
            age = 200
        }
        this._age = age;
    }
    print() {
        console.log('姓名:', this.name)
        console.log('年齡:', this.age)
    }
}

var user = new Person('robbit', 300)
console.log(user)