學(xué)習(xí) ECMAScript 6 入門 的部分章節(jié)的筆記
1.ECMAScript 6簡介
1丙挽、2
2.let 和 const 命令
1令杈、2走敌、3、4
15.promise對象
1逗噩、2掉丽、3跌榔、4、5捶障、6
20.Class的基本語法
1僧须、2、3
25.編程風(fēng)格
1项炼、2皆辽、3、4芥挣、5驱闷、6
一、ECMAScript 6 入門
ECMAScript 6.0(以下簡稱 ES6)是 JavaScript 語言的下一代標準空免,已經(jīng)在 2015 年 6 月正式發(fā)布了空另。
ECMAScript 和 JavaScript 的關(guān)系是,前者是后者的規(guī)格蹋砚,后者是前者的一種實現(xiàn)扼菠。
二、let 和 const 命令
ES6 新增了 let 命令坝咐,用來聲明變量循榆。它的用法類似于 var,但是所聲明的變量墨坚,只在 let 命令所在的代碼塊內(nèi)有效秧饮。
let 聲明的變量只在它所在的代碼塊有效。(塊級作用域)
let 不存在變量提升泽篮。
暫時性死區(qū):只要塊級作用域內(nèi)存在 let 命令盗尸,它所聲明的變量就“綁定”(binding)這個區(qū)域,不再受外部的影響帽撑。(temporal dead zone泼各,簡稱 TDZ)
“暫時性死區(qū)”也意味著 typeof 不再是一個百分之百安全的操作。在聲明之前亏拉,都屬于變量的“死區(qū)”扣蜻,只要用到該變量就會報錯。因此及塘,typeof 運行時就會拋出一個 ReferenceError莽使。
在沒有 let 之前,typeof 運算符是百分之百安全的磷蛹,永遠不會報錯∷甭茫現(xiàn)在這一點不成立了溪烤。
let 不允許在相同作用域內(nèi)味咳,重復(fù)聲明同一個變量庇勃。
const 聲明一個只讀的常量。一旦聲明槽驶,常量的值就不能改變责嚷。
const 的作用域與 let 命令相同:只在聲明所在的塊級作用域內(nèi)有效。
const 命令聲明的常量也是不提升掂铐,同樣存在暫時性死區(qū)罕拂,只能在聲明的位置后面使用。
const 實際上保證的全陨,并不是變量的值不得改動爆班,而是變量指向的那個內(nèi)存地址所保存的數(shù)據(jù)不得改動。
對于簡單類型的數(shù)據(jù)(數(shù)值辱姨、字符串柿菩、布爾值),值就保存在變量指向的那個內(nèi)存地址雨涛,因此等同于常量枢舶。但對于復(fù)合類型的數(shù)據(jù)(主要是對象和數(shù)組),變量指向的內(nèi)存地址替久,保存的只是一個指向?qū)嶋H數(shù)據(jù)的指針凉泄,const 只能保證這個指針是固定的(即總是指向另一個固定的地址),至于它指向的數(shù)據(jù)結(jié)構(gòu)是不是可變的蚯根,就完全不能控制了后众。因此,將一個對象聲明為常量必須非常小心颅拦。
如果真的想將對象凍結(jié)吼具,應(yīng)該使用 Object.freeze 方法。
ES6 聲明變量的六種方法:ES5 只有兩種聲明變量的方法:var 命令和 function 命令矩距。ES6 除了添加 let 和 const 命令拗盒,還有兩種聲明變量的方法:import 命令和 class 命令。
頂層對象的屬性
頂層對象锥债,在瀏覽器環(huán)境指的是 window 對象陡蝇,在 Node 指的是 global 對象。ES5 之中哮肚,頂層對象的屬性與全局變量是等價的登夫。
ES6 一方面規(guī)定,為了保持兼容性允趟,var 命令和 function 命令聲明的全局變量恼策,依舊是頂層對象的屬性;另一方面規(guī)定,let 命令涣楷、const 命令分唾、class 命令聲明的全局變量,不屬于頂層對象的屬性狮斗。也就是說绽乔,從 ES6 開始,全局變量將逐步與頂層對象的屬性脫鉤碳褒。
global 對象
現(xiàn)在有一個提案折砸,在語言標準的層面,引入 global 作為頂層對象沙峻。也就是說睦授,在所有環(huán)境下,global 都是存在的摔寨,都可以從它拿到頂層對象睹逃。
十五、Promise 對象
Promise 的含義
Promise 是異步編程的一種解決方案祷肯,比傳統(tǒng)的解決方案——回調(diào)函數(shù)和事件——更合理和更強大沉填。它由社區(qū)最早提出和實現(xiàn),ES6 將其寫進了語言標準佑笋,統(tǒng)一了用法翼闹,原生提供了 Promise 對象。
所謂Promise蒋纬,簡單說就是一個容器猎荠,里面保存著某個未來才會結(jié)束的事件(通常是一個異步操作)的結(jié)果。
從語法上說蜀备,Promise 是一個對象关摇,從它可以獲取異步操作的消息。Promise 提供統(tǒng)一的 API碾阁,各種異步操作都可以用同樣的方法進行處理输虱。
Promise對象的兩個特點:
1)對象的狀態(tài)不受外界影響。Promise 對象代表一個一步操作脂凶,有三種狀態(tài):pending(進行中)宪睹、fulfilled(已成功)和 rejected(已失敗)蚕钦。只有異步操作的結(jié)果亭病,可以決定當前是哪一種狀態(tài),任何其他操作都無法改變這個狀態(tài)嘶居。
2)一旦狀態(tài)改變罪帖,就不會再變,任何時候都可以得到這個結(jié)果。Promise 對象的狀態(tài)改變整袁,只有兩種可能:從 pending 變?yōu)?fulfilled 和從 pending 變?yōu)?rejected菠齿。只要這兩種情況發(fā)生,狀態(tài)就凝固了葬项,不會再變了泞当,會一直保持這個結(jié)果迹蛤,這時就稱為 resolved(已定型)民珍。
有了Promise對象,就可以將異步操作以同步操作的流程表達出來盗飒,避免了層層嵌套的回調(diào)函數(shù)嚷量。
Promise 也有一些缺點。首先逆趣,無法取消 Promise蝶溶,一旦新建它就會立即執(zhí)行,無法中途取消宣渗。其次抖所,如果不設(shè)置回調(diào)函數(shù),Promise內(nèi)部拋出的錯誤痕囱,不會反應(yīng)到外部田轧。第三,當處于pending狀態(tài)時鞍恢,無法得知目前進展到哪一個階段(剛剛開始還是即將完成)傻粘。
Promise.prototype.then()
Promise 實例具有then方法,也就是說帮掉,then方法是定義在原型對象 Promise.prototype 上的弦悉。它的作用是為 Promise 實例添加狀態(tài)改變時的回調(diào)函數(shù)。前面說過蟆炊,then 方法的第一個參數(shù)是r esolved 狀態(tài)的回調(diào)函數(shù)稽莉,第二個參數(shù)(可選)是 rejected 狀態(tài)的回調(diào)函數(shù)。
then 方法返回的是一個新的 Promise 實例(注意涩搓,不是原來那個 Promise 實例)肩祥。因此可以采用鏈式寫法,即then方法后面再調(diào)用另一個 then 方法缩膝。
Promise.prototype.catch()
Promise.prototype.catch 方法是 .then(null, rejection) 的別名混狠,用于指定發(fā)生錯誤時的回調(diào)函數(shù)。
Promise.prototype.finally()
finally 方法用于指定不管 Promise 對象最后狀態(tài)如何疾层,都會執(zhí)行的操作将饺。該方法是 ES2018 引入標準的。
Promise.all()
Promise.all方法用于將多個 Promise 實例,包裝成一個新的 Promise 實例予弧。
p的狀態(tài)由p1刮吧、p2、p3決定掖蛤,分成兩種情況:
1)只有p1杀捻、p2、p3的狀態(tài)都變成fulfilled蚓庭,p的狀態(tài)才會變成fulfilled致讥,此時p1、p2器赞、p3的返回值組成一個數(shù)組垢袱,傳遞給p的回調(diào)函數(shù)。
2)只要p1港柜、p2请契、p3之中有一個被rejected,p的狀態(tài)就變成rejected夏醉,此時第一個被reject的實例的返回值爽锥,會傳遞給p的回調(diào)函數(shù)。
Promise.race()
Promise.resolve():有時需要將現(xiàn)有對象轉(zhuǎn)為 Promise 對象畔柔,Promise.resolve 方法就起到這個作用氯夷。
二十、Class 的基本語法
基本上释树,ES6 的class可以看作只是一個語法糖肠槽,它的絕大部分功能,ES5 都可以做到奢啥,新的class寫法只是讓對象原型的寫法更加清晰秸仙、更像面向?qū)ο缶幊痰恼Z法而已。
constructor 方法
constructor 方法是類的默認方法桩盲,通過 new 命令生成對象實例時寂纪,自動調(diào)用該方法。一個類必須有constructor 方法赌结,如果沒有顯式定義捞蛋,一個空的 constructor 方法會被默認添加。
constructor 方法默認返回實例對象(即 this)柬姚,完全可以指定返回另外一個對象拟杉。
二十五、編程風(fēng)格
塊級作用域:
ES6 提出了兩個新的聲明變量的命令:let 和 const量承。其中搬设,let 完全可以取代 var穴店,因為兩者語義相同,而且 let 沒有副作用拿穴。
全局常量和線程安全:
在 let 和 const 之間泣洞,建議優(yōu)先使用 const,尤其是在全局環(huán)境默色,不應(yīng)該設(shè)置變量球凰,只應(yīng)設(shè)置常量。let 和 const 的本質(zhì)區(qū)別腿宰,其實是編譯器內(nèi)部的處理不同呕诉。所有的函數(shù)都應(yīng)該設(shè)置為常量。
字符串:
靜態(tài)字符串一律使用單引號或反引號酗失,不使用雙引號义钉。動態(tài)字符串使用反引號昧绣。
賦值解構(gòu):
使用數(shù)組成員對變量賦值時规肴,優(yōu)先使用解構(gòu)賦值。
函數(shù)的參數(shù)如果是對象的成員夜畴,優(yōu)先使用解構(gòu)賦值拖刃。
如果函數(shù)返回多個值,優(yōu)先使用對象的解構(gòu)賦值贪绘,而不是數(shù)組的解構(gòu)賦值兑牡。
數(shù)組:
使用擴展運算符(...)拷貝數(shù)組。
使用 Array.from 方法税灌,將類似數(shù)組的對象轉(zhuǎn)為數(shù)組均函。
函數(shù):
立即執(zhí)行函數(shù)可以寫成箭頭函數(shù)的形式。
那些需要使用函數(shù)表達式的場合菱涤,盡量用箭頭函數(shù)代替苞也。因為這樣更簡潔,而且綁定了 this粘秆。
模塊:
Module 語法是 JavaScript 模塊的標準寫法如迟,堅持使用這種寫法。使用 import 取代require攻走。
使用 export 取代 module.exports 殷勘。
如果模塊只有一個輸出值,就使用 export default昔搂,如果模塊有多個輸出值玲销,就不使用 export default,export default 與普通的 export 不要同時使用摘符。
如果模塊默認輸出一個函數(shù)贤斜,函數(shù)名的首字母應(yīng)該小寫淳附。
如果模塊默認輸出一個對象,對象名的首字母應(yīng)該大寫蠢古。
ESLint 的使用:
ESLint 是一個語法規(guī)則和代碼風(fēng)格的檢查工具奴曙,可以用來保證寫出語法正確、風(fēng)格統(tǒng)一的代碼草讶。