ECMAScript 6重點(diǎn)一覽——進(jìn)階篇

背景介紹

在之前的基礎(chǔ)篇已經(jīng)給出了ES6在數(shù)據(jù)結(jié)構(gòu)上做的優(yōu)化和改變,那這一篇進(jìn)階篇就來(lái)說(shuō)說(shuō)ES6的對(duì)象變化,順便給出之前基礎(chǔ)篇的傳送門:

ECMAScript 6重點(diǎn)一覽——基礎(chǔ)篇

特性重點(diǎn)

一、【重點(diǎn)】簡(jiǎn)潔屬性

var Person = {??

name:'張三',

birth, //等同于birth: birth

hello() {console.log('我的名字是',this.name); }// 等同于hello: function ()...

};

二、屬性名表達(dá)式

可以使用表達(dá)式作為屬性名,如下

obj.foo =true; // 方法一

obj['f'+'oo'] =true;?// 方法二

三、【重點(diǎn)】Object.assign()

Object.assign方法用來(lái)將源對(duì)象(source)的所有可枚舉屬性,復(fù)制到目標(biāo)對(duì)象(target)

var target = { a:1};

var source1 = { b:2};

var source2 = { c:3};

Object.assign(target, source1, source2);

target// {a:1, b:2, c:3}

關(guān)于這一點(diǎn)會(huì)有很多應(yīng)用:具體在此不展開(kāi),詳情請(qǐng)看文末鏈接:)

(1)為對(duì)象添加屬性

(2)為對(duì)象添加方法

(3)克隆對(duì)象

(4)為屬性指定默認(rèn)值

四、Object.setPrototypeOf(),Object.getPrototypeOf()

設(shè)置和讀取對(duì)象的prototype對(duì)象,如下示例:

var o =Object.setPrototypeOf({},null);

Object.getPrototypeOf(obj)

五、Symbol

ES6引入了一種新的原始數(shù)據(jù)類型Symbol,表示獨(dú)一無(wú)二的ID。它通過(guò)Symbol函數(shù)生成。

let symbol1 =Symbol();

typeof symbol1 // "symbol"

我的個(gè)人的理解ES6對(duì)Symbol的引入,想法上可能是類似Bool類型,雖然String的0和1,Integer的0和1都能表示對(duì)錯(cuò),但是從人類思維的意義上說(shuō),既然對(duì)錯(cuò)在邏輯思維中出現(xiàn)頻率非常高,那為什么不單獨(dú)使用Bool的false和true來(lái)表示?我想,Symbol也是一樣的道理,就專門定義一種數(shù)據(jù)類型來(lái)表示屬性名稱。當(dāng)然,我個(gè)人對(duì)此持中立態(tài)度,它有可能把原本簡(jiǎn)單的事情,弄復(fù)雜了。

六、Proxy

Proxy用于修改某些操作的默認(rèn)行為,等同于在語(yǔ)言層面做出修改。其實(shí)可以理解成在目標(biāo)對(duì)象之前,架設(shè)一層“攔截”,外界對(duì)該對(duì)象的訪問(wèn),都必須先通過(guò)這層攔截。

這個(gè)Proxy其實(shí)類似于設(shè)計(jì)模式中的代理,只不過(guò)是語(yǔ)言層面的實(shí)現(xiàn),如下代碼示例:

var proxy =newProxy({}, {??

get:function( target, property ){ return35; }

});

proxy.time// 35

proxy.name// 35

基于Proxy,可以有很多的想象,畢竟這已經(jīng)是一種設(shè)計(jì)模式的實(shí)現(xiàn)了,個(gè)人感覺(jué)這個(gè)可能用來(lái)做框架會(huì)用的比較多,實(shí)際業(yè)務(wù)處理可能不會(huì)用太頻繁,而且其實(shí)所有設(shè)計(jì)模式都不是只有利,也有弊,Proxy本身無(wú)可避免地會(huì)增加邏輯層次

七、Object.observe(),Object.unobserve()

Object.observe方法用來(lái)監(jiān)聽(tīng)對(duì)象(以及數(shù)組)的變化。一旦監(jiān)聽(tīng)對(duì)象發(fā)生變化,就會(huì)觸發(fā)回調(diào)函數(shù)。類似于第六點(diǎn),也是語(yǔ)言層面的設(shè)計(jì)模式實(shí)現(xiàn),觀察者模式?,F(xiàn)在很流行很趨勢(shì)的MVVM框架就是類似的思想,這一點(diǎn)可以用來(lái)實(shí)現(xiàn)雙向數(shù)據(jù)綁定。這其實(shí)是ES7的內(nèi)容,在此就不展開(kāi)了。

總結(jié)

原本這一篇文章是想對(duì)象和函數(shù)一起寫的,但是沒(méi)想到光對(duì)象就寫了七點(diǎn),篇幅已經(jīng)比較長(zhǎng)了,但是其實(shí)在對(duì)象這一塊上,雖然變化點(diǎn)不少,但實(shí)際上,需要特別關(guān)注的并不多,除非是有做框架的需求。JS的面向?qū)ο笃鋵?shí)還是有待增強(qiáng)的,即便是到了ES6??赡苣_本語(yǔ)言天生要實(shí)現(xiàn)面向?qū)ο缶捅容^糾結(jié),一方面既是腳本自由靈活,可另一方面卻又是有對(duì)象的約束,這其中的平衡很難把握,大多數(shù)的JS開(kāi)發(fā)者們應(yīng)該都有這樣的困擾,究竟什么時(shí)候我需要面向?qū)ο笕プ鲞@一件事情,可是往往很多時(shí)候強(qiáng)迫了自己用面向?qū)ο蟮姆绞饺?shí)現(xiàn),可是最后卻發(fā)現(xiàn)耗費(fèi)了不少的時(shí)間和精力,可能原本只需要按照腳本思想,很快就解決了。而且說(shuō)實(shí)話,真論到最后維護(hù)性上來(lái),過(guò)度設(shè)計(jì)的面向?qū)ο螅娴目赡芤h(yuǎn)遠(yuǎn)比簡(jiǎn)單的腳本流程難以維護(hù)的多。當(dāng)然,這就是題外話了。

后續(xù)的高級(jí)篇已經(jīng)完成,如下傳送門:

ECMAScript 6重點(diǎn)一覽——高級(jí)篇

本文基于阮一峰的ECMAScript 6 系列文章和眾多網(wǎng)絡(luò)散文資料匯聚。在此給出原文鏈接,上面給出的重點(diǎn)一覽,都可以在下面鏈接找到更為詳盡的講解:

ECMAScript 6入門——阮一峰

如果有任何的批評(píng)建議,BUG反饋,問(wèn)題反饋,或是想法建議,幫助支持,個(gè)人都十分歡迎,我個(gè)人的聯(lián)系方式如下:)

作者:cheneyxu

郵箱:457299596@qq.com

QQ:457299596

關(guān)于:XServer官網(wǎng)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • defineProperty() 學(xué)習(xí)書(shū)籍《ECMAScript 6 入門 》 Proxy Proxy 用于修改某...
    Bui_vlee閱讀 708評(píng)論 0 1
  • 一、ES6簡(jiǎn)介 ? 歷時(shí)將近6年的時(shí)間來(lái)制定的新 ECMAScript 標(biāo)準(zhǔn) ECMAScript 6(亦稱 ...
    一歲一枯榮_閱讀 6,212評(píng)論 8 25
  • 一、let 和 constlet:變量聲明, const:只讀常量聲明(聲明的時(shí)候賦值)。 let 與 var 的...
    dadage456閱讀 837評(píng)論 0 0
  • ECMAScript發(fā)展歷史 (1)ECMA-262 第1版:去除了對(duì)針對(duì)瀏覽器的特性,支持Unicode標(biāo)準(zhǔn)(多...
    congnie116閱讀 1,979評(píng)論 0 2
  • 許久沒(méi)有去過(guò)蘇州了,火車站早已竣工,地鐵也開(kāi)了兩條線,從火車站去學(xué)??梢灾苯訌母呒茏?。這兒成了一個(gè)熟悉又陌生的城市...
    凌素閱讀 127評(píng)論 0 1

友情鏈接更多精彩內(nèi)容