const 與 let 變量
let與const聲明的變量解決了這種問題,因為他們是塊級作用域, 在代碼塊(用{}表示)中使用let或const聲明變量, 該變量會陷入暫時性死區(qū)直到該變量的聲明被處理.
關(guān)于使用let與const規(guī)則:
使用let聲明的變量可以重新賦值,但是不能在同一作用域內(nèi)重新聲明
使用const聲明的變量必須賦值初始化,但是不能在同一作用域類重新聲明也無法重新賦值.
模板字面量
在ES6之前,將字符串連接到一起的方法是+或者concat()方法,
模板字面量本質(zhì)上是包含嵌入式表達式的字符串字面量.
模板字面量用倒引號( `` )(而不是單引號( '' )或雙引號( "" ))表示擦剑,可以包含用${expression}表示的占位符
解構(gòu)
在ES6中,可以使用解構(gòu)從數(shù)組和對象提取值并賦值給獨特的變量
[]表示被解構(gòu)的數(shù)組,x,y,z表示要將數(shù)組中的值存儲在其中的變量, 在解構(gòu)數(shù)組是, 還可以忽略值, 例如const[x,,z]=point,忽略y坐標.
使用和所分配的變量名稱相同的名稱初始化對象時如果屬性名稱和所分配的變量名稱一樣,那么就可以從對象屬性中刪掉這些重復(fù)的變量名稱。
簡寫方法的名稱:
for...of循環(huán)
for...of循環(huán)是最新添加到 JavaScript 循環(huán)系列中的循環(huán)。
它結(jié)合了其兄弟循環(huán)形式for循環(huán)和for...in循環(huán)的優(yōu)勢毫蚓,可以循環(huán)任何可迭代(也就是遵守可迭代協(xié)議)類型的數(shù)據(jù)拔莱。默認情況下,包含以下數(shù)據(jù)類型:String矛双、Array敬辣、Map和Set雪标,注意不包含Object數(shù)據(jù)類型(即{})。默認情況下溉跃,對象不可迭代村刨。
for循環(huán)
constdigits=[0,1,2,3,4,5,6,7,8,9];for(let i=0; i<digits.length ; i++){console.log(digits[i]);}
for循環(huán)的最大缺點是需要跟蹤計數(shù)器和退出條件。
雖然for循環(huán)在循環(huán)數(shù)組時的確具有優(yōu)勢撰茎,但是某些數(shù)據(jù)結(jié)構(gòu)不是數(shù)組嵌牺,因此并非始終適合使用 loop 循環(huán)。
for...in循環(huán)
constdigits=[0,1,2,3,4,5,6,7,8,9];for(constindexindigits){console.log(digits[index]);}
依然需要使用 index 來訪問數(shù)組的值
當你需要向數(shù)組中添加額外的方法(或另一個對象)時龄糊,for...in循環(huán)會帶來很大的麻煩逆粹。因為for...in循環(huán)循環(huán)訪問所有可枚舉的屬性,意味著如果向數(shù)組的原型中添加任何其他屬性炫惩,這些屬性也會出現(xiàn)在循環(huán)中僻弹。
forEach 循環(huán) 是另一種形式的 JavaScript 循環(huán)。但是他嚷,forEach() 實際上是數(shù)組方法蹋绽,因此只能用在數(shù)組中。也無法停止或退出 forEach 循環(huán)筋蓖。如果希望你的循環(huán)中出現(xiàn)這種行為卸耘,則需要使用基本的 for 循環(huán)。
for...of循環(huán)
for...of循環(huán)用于循環(huán)訪問任何可迭代的數(shù)據(jù)類型扭勉。
for...of循環(huán)的編寫方式和for...in循環(huán)的基本一樣鹊奖,只是將in替換為of,可以忽略索引涂炎。
constdigits=[0,1,2,3,4,5,6,7,8,9];for(constdigitofdigits){console.log(digit);}
建議使用復(fù)數(shù)對象名稱來表示多個值的集合忠聚。這樣,循環(huán)該集合時唱捣,可以使用名稱的單數(shù)版本來表示集合中的單個值两蟀。例如,for (const button of buttons) {…}震缭。
for...of循環(huán)還具有其他優(yōu)勢赂毯,解決了 for 和 for...in 循環(huán)的不足之處。你可以隨時停止或退出 for...of 循環(huán)拣宰。
for(constdigitofdigits){if(digit%2===0){continue;}console.log(digit);}
不用擔心向?qū)ο笾刑砑有碌膶傩浴?b>for...of 循環(huán)將只循環(huán)訪問對象中的值党涕。
展開運算符
展開運算符
(用三個連續(xù)的點 (...) 表示)是 ES6 中的新概念,使你能夠?qū)⒆置媪繉ο笳归_為多個元素
展開運算符的一個用途是結(jié)合數(shù)組巡社。
如果你需要結(jié)合多個數(shù)組膛堤,在有展開運算符之前,必須使用Array的concat()方法晌该。
使用展開符來結(jié)合數(shù)組
剩余參數(shù)(可變參數(shù))
使用展開運算符將數(shù)組展開為多個元素, 使用剩余參數(shù)可以將多個元素綁定到一個數(shù)組中.
剩余參數(shù)也用三個連續(xù)的點 (...) 表示肥荔,使你能夠?qū)⒉欢〝?shù)量的元素表示為數(shù)組.
用途1: 將變量賦數(shù)組值時:
用途2: 可變參數(shù)函數(shù)
對于參數(shù)不固定的函數(shù),ES6之前是使用參數(shù)對象(arguments)處理:
ES6箭頭函數(shù)
ES6之前,使用普通函數(shù)把其中每個名字轉(zhuǎn)換為大寫形式:
箭頭函數(shù)表示:
constupperizedNames=['Farrin','Kagure','Asser'].map(name=>name.toUpperCase());
普通函數(shù)可以是函數(shù)聲明或者函數(shù)表達式, 但是箭頭函數(shù)始終都是表達式, 全程是箭頭函數(shù)表達式, 因此因此僅在表達式有效時才能使用,包括:
存儲在變量中朝群,
當做參數(shù)傳遞給函數(shù)燕耿,
存儲在對象的屬性中。
如果函數(shù)的參數(shù)只有一個,不需要使用()包起來,但是只有一個或者多個, 則必須需要將參數(shù)列表放在圓括號內(nèi)
一般箭頭函數(shù)都只有一個表達式作為函數(shù)主題:
這種函數(shù)表達式形式稱為簡寫主體語法:
在函數(shù)主體周圍沒有花括號,
自動返回表達式
但是如果箭頭函數(shù)的主體內(nèi)需要多行代碼, 則需要使用常規(guī)主體語法:
它將函數(shù)主體放在花括號內(nèi)
需要使用 return 語句來返回內(nèi)容姜胖。
javascript標準函數(shù)this
new 對象
sundae這個構(gòu)造函數(shù)內(nèi)的this的值是實例對象, 因為他使用new被調(diào)用.
指定的對象
函數(shù)使用call/apply被調(diào)用,this的值指向指定的obj2,因為call()第一個參數(shù)明確設(shè)置this的指向
上下`文對象
函數(shù)是對象的方法, this指向就是那個對象,此處this就是指向data.
全局對象或 undefined
此處是this指向全局對象,在嚴格模式下,指向undefined.
javascript中this是很復(fù)雜的概念, 要詳細判斷this,請參考this豁然開朗
箭頭函數(shù)和this
對于普通函數(shù), this的值基于函數(shù)如何被調(diào)用, 對于箭頭函數(shù),this的值基于函數(shù)周圍的上下文, 換句話說,this的值和函數(shù)外面的this的值是一樣的.
傳遞給setTimeout()的函數(shù)被調(diào)用時沒用到new誉帅、call()或apply(),也沒用到上下文對象右莱。意味著函數(shù)內(nèi)的this的值是全局對象堵第,不是dessert對象。實際上發(fā)生的情況是隧出,創(chuàng)建了新的 scoops 變量(默認值為undefined)踏志,然后遞增(undefined + 1結(jié)果為NaN);
解決此問題的方式之一是使用閉包(closure):
greet() 函數(shù)中混亂的前兩行的作用是什么?它們的作用是當所需的參數(shù)未提供時胀瞪,為函數(shù)提供默認的值针余。但是看起來很麻煩, ES6引入一種新的方式創(chuàng)建默認值, 他叫默認函數(shù)參數(shù):
默認值與解構(gòu)
默認值與解構(gòu)數(shù)組
函數(shù)預(yù)期傳入的是數(shù)組。它通過解構(gòu)將數(shù)組中的第一項設(shè)為 width凄诞,第二項設(shè)為 height圆雁。如果數(shù)組為空,或者只有一項帆谍,那么就會使用默認參數(shù)伪朽,并將缺失的參數(shù)設(shè)為默認值 5。
出現(xiàn)錯誤汛蝙,因為createGrid()預(yù)期傳入的是數(shù)組烈涮,然后對其進行解構(gòu)朴肺。因為函數(shù)被調(diào)用時沒有傳入數(shù)組,所以出現(xiàn)問題坚洽。但是戈稿,我們可以使用默認的函數(shù)參數(shù)!
默認值與解構(gòu)函數(shù)
就像使用數(shù)組默認值解構(gòu)數(shù)組一樣讶舰,函數(shù)可以讓對象成為一個默認參數(shù)鞍盗,并使用對象解構(gòu):
數(shù)組默認值與對象默認值
默認函數(shù)參數(shù)只是個簡單的添加內(nèi)容,但是卻帶來很多便利跳昼!與數(shù)組默認值相比般甲,對象默認值具備的一個優(yōu)勢是能夠處理跳過的選項《旒眨看看下面的代碼:
在createSundae()函數(shù)使用對象默認值進行解構(gòu)時敷存,如果你想使用scoops的默認值,但是更改toppings挪略,那么只需使用 toppings 傳入一個對象:
將上述示例與使用數(shù)組默認值進行解構(gòu)的同一函數(shù)相對比历帚。
對于這個函數(shù),如果想使用 scoops 的默認數(shù)量杠娱,但是更改 toppings挽牢,則必須以這種奇怪的方式調(diào)用你的函數(shù):
因為數(shù)組是基于位置的,我們需要傳入 undefined 以跳過第一個參數(shù)(并使用默認值)來到達第二個參數(shù)摊求。