1. 程式人生 > >ES6之字串的擴充套件

ES6之字串的擴充套件

作者: kim 來源: 自創

已經有一段時間沒更新關於ES6的知識點了,主要還是因為時間有點緊,小編現在即沉迷於工作,也在堅持運動,最最最最重要的還是少了點寫作的動力。但是不管怎麼樣,每週至少還是會更新一篇,內容不限。今天接著講ES6中對字串的擴充套件知識點。

判斷某字串是否包含在另外字串中

會JS的兄跌應該知道原生的JavaScript使用的是indexOf()方法來判斷字串中是否包含某字串。具體的用法如下:string.indexOf(‘str’) 如果返回-1說明在string中找不到str字串

ES6對字串新增了includes()\startsWith()\endsWith()方法,用來判斷某字串是否包含在另外字串中: 這裡寫圖片描述

由以上程式碼得知: 1.1、如果只有一個引數,則判斷完整的原字串中是否包含了某字串

1.2、如果有兩個引數,第一個引數為需要判斷的字串,第二個引數為原字串從那個位置開始進行判斷,特別需要注意的是:endsWith(arg,index)不包含index,它判斷的是索引在index之前的原字串以arg結尾,而includes(arg,index)和startsWith(arg,index)是與索引從index開始的原字串進行判斷

ES6中的repeat()

ES6中的repeat方法是對原字串重複後,返回新的字串: str.repeat(arg) arg為字串重複的次數: 這裡寫圖片描述

從上面的程式碼得知:

2.1、如果arg為小數,則需要先取整

2.2、如果arg為負數或者Infinity,則會報錯,但不影響上面執行的程式碼

2.3、如果arg為0到-1之間的小數,則會等同於0

2.4、如果arg為NaN也會視為0

2.5、如果arg為非數字,則需要轉為數字

ES6中的模板字串

ES6中的模板字串也是使用的比較多的一個新特性,它的寫法較簡潔方便: 這裡寫圖片描述 這裡寫圖片描述 這裡寫圖片描述 由以上程式碼得知:

3.1、原生JavaScript中的模板字串需要”“或”或.join(”).join(“”)進行拼接

3.2、ES6中使用反引號(“)包裹字串,字串可換行,可嵌入變數。變數名必須以${…}這種格式才被解析,它會保留換行、縮排、空格符

3.3、如果模板字串中有使用反引號,則需要使用反斜槓轉義

3.4、模板字串中的花括號裡可以是任意的Js表示式,可以進行運算,以及引用物件屬性

3.5、模板字串之中可以呼叫函式(執行函式)

3.6、如果花括號裡不是字串則需要先轉為字串,如物件屬性不是字串則預設呼叫.toString()方法

3.7、如果花括號中是字串,則會原樣輸出

3.8、如果花括號裡的變數沒有宣告則會報錯

3.9、模板字串可巢狀使用(必須是在花括號內才可正常巢狀)

ES6中字串遍歷器介面

ES6 為字串添加了遍歷器介面,使得字串可以被for…of迴圈遍歷: 這裡寫圖片描述 以上程式碼得知:

4.1、字串可以被for…of迴圈遍歷,列印的是字元而不是索引

4.2、for…of可以識別大於0xFFFF的碼點,傳統的for迴圈無法識別這樣的碼點

總結

今天只講到了ES6中對字串擴充套件的4個知識點,其實還有:

字元的Unicode的表示法

codePointAt() – 正確處理4個位元組儲存的字元,返回一個字元的碼點

String.fromCodePoint() – 用於從碼點返回對應字元

……

今天就單純的講了常用到的一些新特性,如果需要了解關於字串的其他新特性可以自行去查閱

往期精彩

⊙一款免費線上高效作圖工具,要不要了解一下

⊙ 如何優雅的實現前端國際化

⊙ 深入學習ES6【第三章】

⊙ 深入學習ES6【第二章】

⊙ 深入學習ES6【第一章】

⊙ 一文讀懂http快取(超詳細)

⊙ 一款免費觀看vip會員視訊神器

掃碼關注更多精彩內容

這裡寫圖片描述