ES6语法（三） 对象

首先，在JavaScript中对象是个很重要的概念，由于在JavaScript中一切都是对象，不管是函数，仍是数组。一样，ES6此次也带来了一些新特性。可以帮助咱们更加轻松与准确的完成想要完成的目标。

对象字面量语法拓展

对象字面量属性简写

在ES6以前。咱们使用字面量建立属性，会写一个属性名，后面跟一个":"，最后跟着属性值。看起来一切都是很简洁的，可是在属性值与属性名同名时，这就很痛苦了，每次都要写两个一样的文字。咱们看个例子：

let Person = function(name,age){
        return {
            name : name,
            age : age,
        }
    }
复制代码

一个两个这种代码没问题，可是当相似的代码量一旦多起来，那即是很痛苦的一件事了。可是，在ES5中，这个问题将获得解决。它为咱们提供了简写方式。

let Person = function(name,age){
        return {
            name,
            age,
        }
    }
复制代码

在使用字面量的时候，咱们只需写一个变量名就好，剩下的工做由JavaScript引擎帮咱们去作。JavaScript引擎回去可访问做用域查找同名属性，找到便会将该变量的值赋值给字面量对象的同名属性。若是没找到，这个属性的值为undefined。

对象字面量的可计算属性名

在ES6以前，咱们能够在对象建立以后，使用可计算属性名，可是没法在对象字面量中使用可计算属性名。如今ES6将可计算属性名带到了对象字面量中。

// ES6以前
    
    let param1 = 'name';
    let person = {};
    person[param1] = 'kidd';
    console.log(person[name]);       // kidd
    
    //不容许
    let dog = {
        [param]:'Snoopy'，
    }
    
    // ES6
    
    let firstName = 'first Name';
    
    let cat = {
        [firsName]:'tom'
    }
    console.log(cat[firstName]);        // tom
    
复制代码

对象方法的简写

这不是一个重大的改进。可是能帮助咱们书写起来更容易。

// ES6以前按
    let person= {
        getName:function(){
            return : this.name
        }
    }
    
    // ES6
    let person = {
        getName(){
            return this.name;
        }
    }
    
复制代码

重复的对象字面量属性

在ES5及以前，咱们若是在对象字面量中声明了两个同名属性，严格模式下便会报错。而ES6中将这个特性改变了，不管是否在严格模式下，对象字面量中声明了两个同名属性，以后后面的属性会生效。

let person = {
        getName(){
            return 'tom';
        },
        
        getName(){
            return 'jure';
        }
    }
    
    person.getName();       // jure
复制代码

对象自有属性的枚举顺序

在ES6以前自由属性的枚举顺序基本都是百家争鸣，不一样的JavaScript引擎，都会有不一样的枚举顺序，此次ES6算是将自由属性的枚举顺序给出了官方说法

• 全部数字键按照升序排列
• 全部字符串键按照它们被加入对象的顺序排列
• 全部symbol键按照它们被加入对象的顺序排列

对象新增方法

在ES6也给对象新增了一些方法，下面让咱们来看看

Object.is()

Object.is()很想一个完整版的 “===”，由于它大部分状况下与 “===” 相同，只有两种状况与 “===” 有一些差异。就是下面两种状况

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

复制代码

除了上面两种状况，与 “===”是同样的。

Object.assign()

由于不少JavaScript第三方库有混合模式，此次ES6便将它们直接引入进来。assign方法的主要做用是将一个对象的方法、属性复制给另外一个对象。注意，这里的复制实际上是浅复制，若是被复制对象的属性值是一个对象的话，那么便只是将这个对象的引用复制给被复制对象。

function EventTarget(){ doSomething };
    
    EventTarget.prototype = {
        constructor : EventTarget,
        emit : function(){ doSomething },
        on : function(){ doSomething }
    }
    
    var obj = {},
    Object.assign(obj,EventTarget.prototype);
    
    obj.on();

复制代码

这样的话，新建立的对象就会拥有以前对象的属性。并且assign是能够接受任意数量的源对象的。若是不一样的源对象中有同名属性，最后被复制对象中会采用最有一个拥有此属性的对象的属性值。 还有一个很重要的点。assign是不能复制访问器属性的。若是源对象中有访问器属性，会在新的对象中变为数值属性。

加强对象原型

咱们都知道，JavaScript最特别的地方就是使用了原型继承的方式。而如今，ES6对对象原型又进行了加强。

Super引用

super引用其实就是保存了当前对象的原型对象的引用，在ES6以前，咱们要得到对象的原型只有经过Object.getPrototypeOf(this)的方法去返回原型对象。可是这个方法在某些状况的时候会发生某些错误，好比

let person = {
        getGreeting(){
            return 'Hello';
        }
    };
    
    let friend = {
        getGreeting(){
            return Object.getPrototypeOf(this).getGreeting.call(this) + ", Hi!";
        }
    }
    
    Object.setPrototypeOf(friend,person);
    
    let relative = Object.create(friend);
    
    console.log(person.getGreeting());          // Hello
    console.log(friend.getGreeting());          // Hello, Hi!
    console.log(relative.getGreeting());        // error

复制代码

这里的问题是陷入了一个调用死循环，this是relative时Object.getPrototypeOf(this)返回的对象是friend。而Object.getPrototypeOf(this).getGreeting会调用friend的getGreeting()方法。后面的call(this)又会去改变当前的函数做用域，所以，陷入了一个递归调用的死循环，最后栈溢出报错，可是在ES6中使用super就会解决这个问题

let person = {
        getGreeting(){
            return 'Hello';
        }
    };
    
    let friend = {
        getGreeting(){
            return super.getGreeting() + ", Hi!";
        }
    }
    
    Object.setPrototypeOf(friend,person);
    
    let relative = Object.create(friend);
    
    console.log(person.getGreeting());          // Hello
    console.log(friend.getGreeting());          // Hello, Hi!
    console.log(relative.getGreeting());        // Hello, Hi!
    
复制代码

这是由于super引用不是动态变化的，它老是指向正确的对象。

改变对象原型的方法

在ES6以前咱们要改变对象的原型很麻烦，如今ES6有了setPrototypeOf()，能够垂手可得的改变对象的原型。

let person = {
        getGreeting(){
            return 'Hello';
        }
    };
    
    let dog = {
        getGreeting(){
            return 'Woof';
        }
    };
    
    let friend = Object.create(person);
    console.log(friend.getGreeting());      // Hello
    console.log(Object,getPrototypeOf(friend) === person);  //true
    
    Object.setPrototype(friend,dog);
    console.log(friend.getGreeting());      // Woof
    console.log(Object,getPrototypeOf(friend) === dog);  //true
    
复制代码

以上即是ES6有关对象的内容，若是您有不一样的看法或者是本文哪里有错误，你均可以在下面留言给我！！！