[ES6]---对象的扩展（Object方法、super关键字等）

对象的扩展

对象的属性表示法

ES5的用法

let name = '林俊杰'

function sayMe() {
    console.log('this is 林俊杰')
}
//ES5定义对象的属性和方法
var obj = {
    name: name, //第二个name表示变量名
    sayMe: sayMe //第二个sayMe表示函数名
}
console.log(obj.name); //林俊杰

ES6的用法

let name = '林俊杰'

function sayMe() {
    console.log('this is 林俊杰')
}
// ES6允许将变量名和函数名直接作为对象的属性和方法的方式
var obj = {
    name,
    sayMe
}
console.log(obj.name) //林俊杰

Object的方法

Object.is()的方法

ESt 5比较两个值是否相等，使用的是相等运算符( = = )和全等运算符( = = = )。但这两个运算符在使用时都具有缺点:

• 相等运算符在比较之前，会自动转换数据类型。
• 全等运算符导致NaN与自身不等，+0等于-0等问题。

ES6提出了同值相等( Same - value equality )算法来解决以上问题。Objectis() 方法就是对同值相等算法的具体实现。

// ES5 
console.log(+0 === -0);// true
console. log(NaN === NaN);// false
// ES6
console. log(Object.is(+0,-0));// false
console. log(Object. is(NaN,NaN)) ;// true

Object.assign()的方法

用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。

Object.assign(target,...sources)

• target:目标对象。
• sources:源对象。
• 返回值:目标对象。

var obj = {
    name: '林俊杰',
    age: 18
}
var target = {}

var result = Object.assign(target, obj)
console.log(result, target) //{ name: '林俊杰', age: 18 } { name: '林俊杰', age: 18 }

target.name = '周杰伦'
console.log(obj.name) //林俊杰

Object.assign()方法只会拷贝源对象自身的并且可枚举的属性到目标对象。

super关键字

用于指向当前对象的原型对象。

function Hero() {
    this.name = "林俊杰";
    this.sayMe = function() {
        console.log(this.name);
    };
}
Hero.prototype.age = 18;
var hero = new Hero();
hero.sayMe(); //林俊杰
hero.sayYou = function() {
    console.log(this.age);
};
hero.sayYou(); //18

var prop = {
    age: 18,
};
var obj = {
    name: "林俊杰",
    sayMe() {
        console.log(super.age); // prop.age
    },
};

Object.setPrototypeOf(obj, prop);
obj.sayMe(); //18

super关键字表示原型对象时，会比this更加清晰理解。

对象的扩展运算符

对象的扩展运算符(…)用于取出参数对象的所有可遍历属性，拷贝到当前对象之中。

将原对象的可枚举的属性复制到目标对象中

var obj = {
    name: '林俊杰',
    age: 18
}

//将原对象的可枚举的属性复制到目标对象中
var target = {...obj }
console.log(target) //{ name: '林俊杰', age: 18 }