ES6全擴(kuò)展

字符串的擴(kuò)展


1??癣疟、字符的unicode表示法

首先要先對字符的unicode表示法有一個整體認(rèn)識。
其次邪蛔,在ES6之前扎狱,unicode字符表示法只限于碼點在\u0000 ~\uFFFF之間的字符,超過此范圍的字符需用兩個雙字節(jié)表示淤击,ES6對此做出的改進(jìn)為:
將碼點放入大括號中去污抬,就能正確解讀該字符

2??印机、字符串的遍歷器接口

ES6 為字符串添加了遍歷器接口射赛,使得字符串可以被for...of循環(huán)遍歷睡扬。
除了遍歷字符串,這個遍歷器最大的優(yōu)點是可以識別大于0xFFFF的碼點伦腐,傳統(tǒng)的for循環(huán)無法識別這樣的碼點本砰。

3??蛔屹、模板字符串

ES6 引入了模板字符串解決輸出模板比較繁瑣的問題。
模板字符串(template string)是增強版的字符串兔毒,用反引號(`)標(biāo)識育叁。

字符串的新增方法


1??、String.fromCodePoint()

如果知道了一個碼點豪嗽,想知道它表示的是什么字符。ES6之前我們可以使用:
String.fromCharCode(0x0030)來轉(zhuǎn)化成為字符隐锭。
上述的這個方法有個缺陷钦睡,就是它有限制,只能識別0x0000~0xFFFF 之間的碼點荞怒,超出后會溢出褐桌。
于是,我們這里要學(xué)習(xí)的就是這個:String.fromCodePoint()

2??荧嵌、String.raw()

String.raw()本質(zhì)上是一個正常的函數(shù)完丽,只是專用于模板字符串的標(biāo)簽函數(shù)拇舀。

3??、實例方法:codePointAt()

不想看這里聘鳞。

4??要拂、實例方法:normalize()

ES6 提供字符串實例的normalize()方法,用來將字符的不同表示方法統(tǒng)一為同樣的形式搏嗡,這稱為 Unicode 正規(guī)化.

5??拉一、實例方法:includes()、startWith()磅氨、endsWith()

這三個方法都支持第二個參數(shù)嫡纠,表示開始搜索的位置延赌。

6??叉橱、實例方法:padStart()赏迟、padEnd()

ES2017 引入了字符串補全長度的功能。如果某個字符串不夠指定長度锌杀,會在頭部或尾部補全糕再。padStart()用于頭部補全,padEnd()用于尾部補全殴蹄。
padStart()和padEnd()一共接受兩個參數(shù)猾担,第一個參數(shù)是字符串補全生效的最大長度,第二個參數(shù)是用來補全的字符串稽荧。

7??工腋、實例方法:trimStart()、trimEnd()

ES2019 對字符串實例新增了trimStart()trimEnd()這兩個方法蟋恬。它們的行為與trim()一致趁冈,trimStart()消除字符串頭部的空格,trimEnd()消除尾部的空格沐绒。它們返回的都是新字符串呀邢,不會修改原始字符串。

數(shù)值的擴(kuò)展


1??申眼、二進(jìn)制、八進(jìn)制表示法(分別用二巷蚪、八進(jìn)制表示10)

ES6規(guī)定:二進(jìn)制與十進(jìn)制分別以0b[B] 濒翻、0o[O].
因此用二進(jìn)制表示數(shù)字10為:0B1010,用八進(jìn)制表示數(shù)字10為0O12有送;

2??、Number.isFinite()裸删、Number.isNaN()

這個Number的這倆方法在日常開發(fā)中幾乎沒用到過阵赠。
判斷一個數(shù)是不是有效,判斷一個數(shù)是不是數(shù)值匕荸。這里簡單做下記錄枷邪,明確知道有這倆新方法。

3??药薯、Number.parseInt()救斑、Number.parseFloat()

這倆東西的出現(xiàn)頻率極高真屯,ES6將這倆方法移植到了Number對象上绑蔫,這么做的目的是逐步減少全局性方法,使得語言逐步模塊化配深。
因此下次使用這倆方法的時候用上Number篓叶,那就說明對這個小知識點有了掌握羞秤。

4??左敌、Number.isInteger()

Number.isInteger()用來判斷一個數(shù)值是否為整數(shù)矫限。

5??、Number.EPSILON

ES6 在Number對象上面叼风,新增一個極小的常量Number.EPSILON无宿。根據(jù)規(guī)格,它表示 1 與大于 1 的最小浮點數(shù)之間的差经窖。
Number.EPSILON實際上是 JavaScript 能夠表示的最小精度梭灿。誤差如果小于這個值,就可以認(rèn)為已經(jīng)沒有意義了配乱,即不存在誤差了皮迟。

6??、安全整數(shù)和Number.isSafeInterger()

JavaScript能夠準(zhǔn)確表示的整數(shù)范圍是在-253到253之間(不含兩個端點)忿檩。超過這個范圍爆阶,無法精確表示這個值辨图。
ES6引入兩個常量來表示這個范圍的上下限:Number.MAX_SAFE_INTERGERNumber.MIN_SAFE_INTERGER.
Number.isSafeInteger()則是用來判斷一個整數(shù)是否落在這個范圍之內(nèi)。

7??吱韭、Math.trunc()

Math.trunc()用于去除一個整數(shù)的小數(shù)部分鱼的,返回整數(shù)部分。

8??熏挎、Math.sign()

Math.sign()用來判斷一個數(shù)是正數(shù)(+1)、負(fù)數(shù)(-1)烦磁、+0或-0.

函數(shù)的擴(kuò)展


1??哼勇、函數(shù)參數(shù)的默認(rèn)值

我們在寫一個工具函數(shù)的時候积担,要積極使用這種函數(shù)默認(rèn)值的寫法,不僅讓我們對此函數(shù)傳值有一個整體了解先誉,還可以減少因為參數(shù)傳遞錯誤出現(xiàn)的bug的烁。

2??、rest參數(shù)

ES6 引入 rest 參數(shù)(形式為...變量名)铃芦,用于獲取函數(shù)的多余參數(shù)襟雷,這樣就不需要使用arguments對象了耸弄。rest 參數(shù)搭配的變量是一個數(shù)組,該變量將多余的參數(shù)放入數(shù)組中老客。
注意震叮,rest 參數(shù)之后不能再有其他參數(shù)(即只能是最后一個參數(shù))鳍鸵,否則會報錯偿乖。

數(shù)組的擴(kuò)展


1??哲嘲、擴(kuò)展運算符

對于一個數(shù)組來說媳禁,如果使用擴(kuò)展運算符竣稽,相當(dāng)于是rest參數(shù)的逆運算,將一個數(shù)組轉(zhuǎn)為用逗號分割的參數(shù)序列娃弓。

2??岛宦、Array.from()

Array.from方法用于將兩類對象轉(zhuǎn)為真正的數(shù)組:類似數(shù)組的對象(array-like object)和可遍歷(iterable)的對象(包括 ES6 新增的數(shù)據(jù)結(jié)構(gòu) Set 和 Map)砾肺。

3??、Array.of()

Array.of()用于將一組值轉(zhuǎn)化為數(shù)組炼吴。

4??疫衩、數(shù)組實例的find()和findIndex()

數(shù)組實例的find方法,用于找出第一個符合條件的數(shù)組成員童芹。
數(shù)組實例的findIndex方法的用法與find方法非常類似鲤拿,返回第一個符合條件的數(shù)組成員的位置近顷,如果所有成員都不符合條件,則返回-1缀遍。

5??饱须、數(shù)組示例的fill()

fill方法使用給定值,填充一個數(shù)組譬挚。

  let arr = [1,3,3,4,5];
  arr.fill(2,1,2); //[1,2,3,4,5]

6??减宣、數(shù)組實例的entries()、keys()和values()

ES6 提供三個新的方法——entries()漆腌,keys()和values()——用于遍歷數(shù)組屉凯。它們都返回一個遍歷器對象(詳見《Iterator》一章),可以用for...of循環(huán)進(jìn)行遍歷晓勇,唯一的區(qū)別是keys()是對鍵名的遍歷灌旧、values()是對鍵值的遍歷枢泰,entries()是對鍵值對的遍歷。

7??窿克、數(shù)組實例的flat()毛甲、flatMap()

數(shù)組的成員有時還是數(shù)組,Array.prototype.flat()用于將嵌套的數(shù)組“拉平”只损,變成一維的數(shù)組。該方法返回一個新數(shù)組七咧,對原數(shù)據(jù)沒有影響跃惫。
如果不管有多少層嵌套,都要轉(zhuǎn)成一維數(shù)組艾栋,可以用Infinity關(guān)鍵字作為參數(shù)爆存。

8??、數(shù)組的空位

注意裹粤,空位不是undefined终蒂,一個位置的值等于undefined蜂林,依然是有值的遥诉,空位是指沒有任何值拇泣。
ES6明確將空位轉(zhuǎn)為undefined矮锈。
由于空位的處理規(guī)則非常不統(tǒng)一霉翔,所以建議避免出現(xiàn)空位。

對象的擴(kuò)展


1??苞笨、屬性的簡潔表示法

對于鍵值對來說:屬性名就是變量名, 屬性值就是變量值债朵。let obj ={name,age}
對于對象中的方法來說,也可以直接簡寫 methods (){}

2??瀑凝、屬性的可枚舉性和遍歷

對象的每一個屬性都有一個描述對象(Descriptor)序芦,用來控制該屬性的行為。
Object.getOwnPropertyDescriptor(obj,key)方法可以獲取該屬性的描述對象粤咪。
他們分別是:

  • enumerable:可枚舉性谚中,目前有四個操作會忽略enumerable為false的屬性
    for...in:只遍歷自身的和繼承的可枚舉的屬性。
    Object.keys():返回對象自身所有可枚舉的屬性鍵名寥枝。
    JSON.stringfy():只串行化對象自身的可枚舉屬性宪塔。
    Object.assign():忽略enumerable為false的屬性,只拷貝對象自身的可枚舉屬性囊拜。

3??某筐、super關(guān)鍵字

我們知道,this關(guān)鍵字總是指向當(dāng)前函數(shù)所在的對象冠跷,ES6又新增了一個類似的關(guān)鍵字super南誊,指向當(dāng)前對象的原型對象。
注意蜜托,super指向原型對象時弟疆,只能用在對象的方法之中,用在其他地方都會報錯盗冷。(目前怠苔,只有對象方法的簡寫法可以讓 JavaScript 引擎確認(rèn),定義的是對象的方法仪糖。)

4??柑司、對象的擴(kuò)展運算符

解構(gòu)賦值:

  • 解構(gòu)賦值等號的右邊要求是一個對象。
  • 解構(gòu)賦值必須是最后一個參數(shù)锅劝,否則會報錯攒驰。
  • 解構(gòu)賦值的拷貝是淺拷貝。
  • 擴(kuò)展運算符的解構(gòu)賦值故爵,不能復(fù)制繼承自原型對象的屬性玻粪。

5??、鏈判斷運算符

我們寫代碼時,會遇到判斷一個對象的某個屬性是否存在劲室,比如我們需要判斷l(xiāng)mz的user信息的age屬性是否存在伦仍,我們安全的寫法是這樣的:
if(lmz && lmz.user && lmz.user.age){return "age屬性存在! "}

ES2020引入了鏈判斷運算符很洋,簡化上面寫法:
if(lmz ?. user ?.age){return "age屬性存在充蓝!"}

6??、Null判斷運算符

當(dāng)判斷某個屬性的值是undefined或者null的時候喉磁,我們一般使用||來給定默認(rèn)值谓苟。但是這個符號有個缺陷,如果判斷的這個屬性是0或者false或者空字符串的時候协怒,他同樣會返回||后面的值(默認(rèn)值生效)涝焙。
這個時候我們使用||這個符號就不太妙來,ES2020引入了一個新的Null判斷運算符:??,它的行為類似||孕暇,但是只有運算符左側(cè)的值為null或undefined時仑撞,才會返回右側(cè)的值。
此運算符的一個目的就是與鏈?zhǔn)竭\算符一起使用芭商,判斷一個屬性為null或undefined時派草,給定默認(rèn)值。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末铛楣,一起剝皮案震驚了整個濱河市近迁,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌簸州,老刑警劉巖鉴竭,帶你破解...
    沈念sama閱讀 219,490評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異岸浑,居然都是意外死亡搏存,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,581評論 3 395
  • 文/潘曉璐 我一進(jìn)店門矢洲,熙熙樓的掌柜王于貴愁眉苦臉地迎上來璧眠,“玉大人,你說我怎么就攤上這事读虏≡鹁玻” “怎么了?”我有些...
    開封第一講書人閱讀 165,830評論 0 356
  • 文/不壞的土叔 我叫張陵盖桥,是天一觀的道長灾螃。 經(jīng)常有香客問我,道長揩徊,這世上最難降的妖魔是什么腰鬼? 我笑而不...
    開封第一講書人閱讀 58,957評論 1 295
  • 正文 為了忘掉前任嵌赠,我火速辦了婚禮,結(jié)果婚禮上熄赡,老公的妹妹穿的比我還像新娘姜挺。我一直安慰自己,他們只是感情好本谜,可當(dāng)我...
    茶點故事閱讀 67,974評論 6 393
  • 文/花漫 我一把揭開白布初家。 她就那樣靜靜地躺著偎窘,像睡著了一般乌助。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上陌知,一...
    開封第一講書人閱讀 51,754評論 1 307
  • 那天他托,我揣著相機(jī)與錄音,去河邊找鬼仆葡。 笑死赏参,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的沿盅。 我是一名探鬼主播把篓,決...
    沈念sama閱讀 40,464評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼腰涧!你這毒婦竟也來了韧掩?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,357評論 0 276
  • 序言:老撾萬榮一對情侶失蹤窖铡,失蹤者是張志新(化名)和其女友劉穎疗锐,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體费彼,經(jīng)...
    沈念sama閱讀 45,847評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡滑臊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,995評論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了箍铲。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片雇卷。...
    茶點故事閱讀 40,137評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖颠猴,靈堂內(nèi)的尸體忽然破棺而出关划,到底是詐尸還是另有隱情,我是刑警寧澤芙粱,帶...
    沈念sama閱讀 35,819評論 5 346
  • 正文 年R本政府宣布祭玉,位于F島的核電站,受9級特大地震影響春畔,放射性物質(zhì)發(fā)生泄漏脱货。R本人自食惡果不足惜岛都,卻給世界環(huán)境...
    茶點故事閱讀 41,482評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望振峻。 院中可真熱鬧臼疫,春花似錦、人聲如沸扣孟。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,023評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽凤价。三九已至鸽斟,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間利诺,已是汗流浹背富蓄。 一陣腳步聲響...
    開封第一講書人閱讀 33,149評論 1 272
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留慢逾,地道東北人立倍。 一個月前我還...
    沈念sama閱讀 48,409評論 3 373
  • 正文 我出身青樓,卻偏偏與公主長得像侣滩,于是被迫代替她去往敵國和親口注。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,086評論 2 355