深入理解ES6之《擴充套件物件》

當物件字面量只有乙個屬性的名稱時，js引擎會在可訪問作用域中查詢其同名變數；如果找到則該變數的值被賦給物件字面量裡的同名屬性

function createperson(name, age) 
}

var person = 
}

在es5中如果屬性名中包含空格或者是動態的字串變數作為屬性名，則需要用方括號來訪問，如下所示

var person = {},
lastname = 'last name';
person["first name"] = 'li'
person[lastname] = 'yun hua'

這種方式適用於屬性名提前已經或可被字串字面量表示的情況，如果屬性名「first name」被包含在乙個變數中或者需要通過計算才得到該變數的值

es6支援了可計算屬性名

比方說上面的**es6可簡化寫成如下：

let lastname = 'last name';
var person =

甚至方括號中內容同樣可以使用表示式作為屬性的可計算名稱

var suffix = 'name'
var person =

也就是說任何可用於物件例項括號記法的屬性名同樣可以作為物件字面量中計算屬性名

由於全等===有一些特例：1、+0和-0相等 2、nan和nan不完全相等

故es6引用了object.is方法來彌補全等運算子的不準備運算

對object.is方法來說，其運算結果大部分情況與===運算子相同，唯一區別在於+0和-0被識別為不相等，nan和nan被識別為相等

object.assign方法接受任意數量的源物件，並按指定的順序將屬性複製到接收物件中，所以如果多個源物件具有同名屬性，則排位靠後的源物件會覆蓋排位靠前的

有乙個需要特別注意的點是object.assign方法不能將提供者的訪問器屬性複製到接收物件中，由於object.assign執行了賦值操作，因此提供者的訪問器屬性最終會被轉變為接收物件中的乙個資料屬性

var receiver = {},
supplier = 
}object.assign(receiver, supplier)
var desc = object.getownpropertydescriptor(receiver, "name")
console.log(desc.value)
console.log(desc.get)//undefined

在es5嚴格模式下，對於物件字面量重複屬性則會丟擲錯誤

但在es6嚴格模式下，不會報錯，取值會選取最後乙個

'use strict'
var person = 
console.log(person.name)//angela

所有數字鍵按公升序排序

所有字串按照它們被加入物件的順序排序

所有symbol鍵按照它們被加入物件的順序排序

var obj = 
obj.d = 1
console.log(object.getownpropertynames(obj).join(''))//012acbd

es5中可以通過object.getprototypeof來返回任意指定物件的原型

es6中新增了object.setprototypeof來改變任意指定物件的原型

var person = 
}var dog = 
}let friend = object.create(person)
console.log(friend.getgreeting())//hello
console.log(object.getprototypeof(friend) === person)//true
object.setprototypeof(friend, dog)
console.log(friend.getgreeting())//woof
console.log(object.getprototypeof(friend) === dog)//true

在es5中如果要呼叫父類的方法，則一般是通過如果這種方式，也就是獲得原型物件再通過call來呼叫

object.getprototypeof(this).getgreeting.call(this)

var person = 
}var dog = 
}var friend = 
}object.setprototypeof(friend, person)
console.log(friend.getgreeting())//hello,hi!
console.log(object.getprototypeof(friend) === person)//true
object.setprototypeof(friend,dog)
console.log(friend.getgreeting())//woof,hi!
console.log(object.getprototypeof(friend) === dog)//true

但是在多重繼承的情況下，上述方法則會出錯，舉例來說

var person = 
}var friend = 
}object.setprototypeof(friend, person)
var relative = object.create(friend)
console.log(person.getgreeting())//hello
console.log(friend.getgreeting())//hello,hi!
console.log(relative.getgreeting())// 報錯 uncaught rangeerror: maximum call stack size exceeded

es6中通過super關鍵字可輕鬆解決問題

var person = 
}var friend = 
}object.setprototypeof(friend, person)
var relative = object.create(friend)
console.log(person.getgreeting())//hello
console.log(friend.getgreeting())//hello,hi!
console.log(relative.getgreeting())// hello,hi

大家可能會疑惑super是怎麼做到知道真正的呼叫物件是哪個

這其實是因為es6中正式將方法定義為乙個函式，它會有乙個內部的[[homeobject]]屬性來容納這個方法從屬的物件

var person = 
}function sharegreeting(params)

person.getgreeting方法的[[homeobject]]屬性為person，而sharegreeting函式未將其賦值給乙個物件，因而沒有明確定義其[[homeobject]]屬性

super的所有引用都通過[[homeobject]]屬性來確定後續的執行過程

在[[homeobject]]屬性上呼叫object.getprototypeof方法來檢索原型的引用

搜尋原型找以同名函式

設定this繫結並呼叫相應的方法

深入理解ES6之《解構》

如果使用var let const解析宣告變數，則必須提供初始化程式也就是等號右側的值以下語句有語法錯誤 var let const解構賦值表示式也就是右側的表示式如果為null或undefined會導致程式丟擲錯誤，因為任何嘗試讀取null或undefined的屬性的行為都會觸發執行時錯誤...

《深入理解ES6》之擴充套件物件的功能性

當乙個物件的屬性與本地變數同名時，不必再寫冒號和值，簡單地只寫屬性名即可。function createperson name,age 相當於function createperson name,age es6中對物件字面量定義方法的語法進行了改進，消除了冒號和function關鍵字。var per...

深入理解ES6 擴充套件物件的功能性

1.物件字面量語法擴充套件 function person name,age function person name,age 2.object.is 方法接受兩個引數，如果這兩個引數型別相同且具有相同的值，則返回true。該方法的執行結果大部分情況與運算子相同，唯一的區別在於 0和 0被識別為不...

深入理解ES6之《擴充套件物件》

深入理解ES6之《解構》

《深入理解ES6》之擴充套件物件的功能性

深入理解ES6 擴充套件物件的功能性

相關推薦