摘要:字符串中的字符有兩種,一種是由一個(gè)編碼單元位表示的字符,另一種是由兩個(gè)編碼單元位表示的輔助平面字符在中,所有字符串的操作都是基于位編碼單元接受編碼單元的位置而非字符位置作為參數(shù),返回與字符串中給定位置對(duì)應(yīng)的碼位,即一個(gè)整數(shù)值也就是說(shuō)對(duì)于字符
字符串中的字符有兩種,一種是由一個(gè)編碼單元16位表示的BMP字符,另一種是由兩個(gè)編碼單元32位表示的輔助平面字符
在ES5中,所有字符串的操作都是基于16位編碼單元
codePointAt 接受編碼單元的位置而非字符位置作為參數(shù),返回與字符串中給定位置對(duì)應(yīng)的碼位,即一個(gè)整數(shù)值
也就是說(shuō)對(duì)于BMP字符集中的字符,codePointAt方法的返回值與charCodeAt方法的相同,而對(duì)于非BMP字符集來(lái)說(shuō)返回值則不同
let txt="?a" console.log(txt.charCodeAt(0))//55362 --僅僅返回位置0處的第一個(gè)編碼單元 console.log(txt.charCodeAt(1))//57271 console.log(txt.charCodeAt(2))//97 console.log(txt.codePointAt(0))//134071 --返回完整的碼位,即使這個(gè)碼位包含多個(gè)編碼單元 console.log(txt.codePointAt(1))//57271 console.log(txt.codePointAt(2))//97
檢測(cè)字符占用編碼單元數(shù)量
function is32Bit(c) { return c.codePointAt(0)>0xFFFF } console.log(is32Bit("?"))//true console.log(is32Bit("a"))//falseString.fromCodePoint
codePoint方法在字符串中檢索一個(gè)字符的碼位,也可以使用String.fromCodePoint方法根據(jù)指定的碼位生成一個(gè)字符
可以將String.fromCodePoint看成更完整版本的String.fromCharCode,因?yàn)閷?duì)于BMP中的所有字符,這倆方法執(zhí)行結(jié)果相同,只有傳遞非BMP的碼位作用參數(shù)時(shí),二者執(zhí)行結(jié)果才有可能不同
在對(duì)不同字符進(jìn)行排序或比較時(shí),會(huì)存在一種可能它們是等效的
1、規(guī)范的等效是指無(wú)論從哪個(gè)角度來(lái)看,兩個(gè)序列的碼位都是沒(méi)有區(qū)別的
2、兩個(gè)互相兼容的碼位序列看起來(lái)不同,但是在特定情況下可以被交換使用
切記:在對(duì)比字符串前一定要把它們標(biāo)準(zhǔn)化為同一種形式
let values = ["test", "demo", "compare", "sort"] let normalized = values.map(function (txt) { return txt.normalize() }) normalized.sort(function (first, second) { if (first < second) return -1 else if (first === second) return 0 else return 1 })
或者上述代碼也可以這樣
let values = ["test", "demo", "compare", "sort"] values.sort(function (first, second) { // let firstNormalized = first.normalize(), // secondNormalized = second.normalize(); //可以寫(xiě)成這種形式也可以寫(xiě)成如下這種形式 let firstNormalized = first.normalize("NFC"), secondNormalized = second.normalize("NFC"); if (firstNormalized < secondNormalized) return -1 else if (firstNormalized === secondNormalized) return 0 else return 1 })
Unicode標(biāo)準(zhǔn)化形式有如下幾種
當(dāng)一個(gè)正則表達(dá)式使用u修飾符時(shí),它就從編碼單元操作切換為字符模式
let txt = "?" console.log(txt.length)//2 console.log(/^.$/.test(txt))//false console.log(/^.$/u.test(txt))//true
通過(guò)上述特性,可檢測(cè)字符串真正長(zhǎng)度
function codePointLength(txt) { let result = txt.match(/[sS]/gu) return result ? result.length : 0 } console.log(codePointLength("abc"))//3 console.log(codePointLength("?ab"))//3 console.log("?ab".length)//4
檢測(cè)引擎是否支持u修飾符
function hasRegExpU(params) { try { var pattern = new RegExp(".", "u") return true } catch (ex) { return false } }
如果你的代碼仍然需要運(yùn)行在老式的JS引擎中,使用修飾符時(shí)切記使用RegExp構(gòu)造函數(shù),這樣可以避免發(fā)生語(yǔ)法錯(cuò)誤,并且你可以有選擇的檢測(cè)和使用u修飾符而不會(huì)造成系統(tǒng)異常終止
字符串中的子串識(shí)別includes 在字符串中檢測(cè)是否包含指定文本
startsWith 在字符串的起始部分是否包含指定文本
endsWith 在字符串的結(jié)束部分是否包含指定文本
以上三個(gè)方法都接受兩個(gè)參數(shù):1、要搜索的文本 2、可選 開(kāi)始搜索的索引值,如果指定的第二個(gè)參數(shù)則會(huì)比這個(gè)索引值的位置開(kāi)始匹配,endsWith則從字符串長(zhǎng)度減法這個(gè)索引值的位置開(kāi)始匹配
let msg = "Hello world!" console.log(msg.startsWith("Hello"))//true console.log(msg.endsWith("!"))//true console.log(msg.includes("o"))//true console.log(msg.startsWith("o"))//false console.log(msg.endsWith("world!"))//true console.log(msg.includes("x"))//false console.log(msg.startsWith("o", 4))//true--從字符串Hello中的o開(kāi)始 console.log(msg.endsWith("o", 8))//true--字符串的位置是12減去8之后還余下4 console.log(msg.includes("o", 8))//false--從字符串world中的r開(kāi)始匹配
indexOf和lastIndexof是尋找子串的位置,并且如果你傳一個(gè)正則表達(dá)式進(jìn)去的話(huà),它們會(huì)將傳入的正則表達(dá)式轉(zhuǎn)化為字符串并搜索它,而在includes等這三方法中,如果你不是傳入字符串而是一個(gè)正則表達(dá)式則會(huì)報(bào)錯(cuò)
repeat 接受一個(gè)number類(lèi)型的參數(shù),表示該字符串的重復(fù)次數(shù),返回當(dāng)前字符串重復(fù)一定次數(shù)后的新字符串
console.log("X".repeat(5))//XXXXX正則表達(dá)式y(tǒng)修飾符
在字符串開(kāi)始字符匹配時(shí),它會(huì)通知搜索從正則表達(dá)式的lastIndex屬性開(kāi)始進(jìn)行,如果在指定位置未能成功匹配則停止繼續(xù)匹配
let text = "hello1 hello2 hello3", pattern = /hellods?/, result = pattern.exec(text), globalPattern = /hellods?/g, glogbalResult = globalPattern.exec(text), stickyPattern = /hellods?/y, stickyResult = stickyPattern.exec(text); console.log(result[0])//hello1 console.log(glogbalResult[0])//hello1 console.log(stickyResult[0])//hello1 pattern.lastIndex = 1 globalPattern.lastIndex = 1 stickyPattern.lastIndex = 1 result = pattern.exec(text) glogbalResult = globalPattern.exec(text) stickyResult = stickyPattern.exec(text) console.log(result[0])//hello1 console.log(glogbalResult[0])//hello2 console.log(stickyResult[0])//報(bào)錯(cuò)
關(guān)于修飾符有2點(diǎn):
1、只有調(diào)用exec和test方法才會(huì)涉及l(fā)astIndex
2、當(dāng)lastIndex的值為0時(shí),如果正則表達(dá)式中含有^則是否使用粘滯正則表達(dá)式并無(wú)差別,如果lastIndex的值不為0則該表達(dá)式永遠(yuǎn)不會(huì)匹配到正確結(jié)果
let pattern=/hellod/y console.log(pattern.sticky)//true正則表達(dá)式復(fù)制
ES5中復(fù)制正則表達(dá)式只能這樣
var re1 = /ab/i, re2 = new RegExp(re1);
如果想要對(duì)re1重新指定修飾符則不行,ES6 增加了這一新功能
var re1 = /ab/i, re2 = new RegExp(re1, "g") console.log(re1)// /ab/i console.log(re2)// /ab/g console.log(re1.test("ab"))//true console.log(re2.test("ab"))//true console.log(re1.test("AB"))//true console.log(re2.test("AB"))//false正則中的flags屬性
let re=/ab/g console.log(re.source)// ab console.log(re.flags)// g --ES新增的屬性模板字面量
在ES6之前多行字符串只能在一個(gè)新行最前方添加反斜杠來(lái)承接上一行代碼
var message="Multiline string"
但是這樣有一個(gè)問(wèn)題,在控制臺(tái)輸出在了同一行,所以只能通過(guò)手工插入n換行符
ES6中通過(guò)反撇號(hào)來(lái)創(chuàng)建多行字符串,在反撇號(hào)中所有空白符都屬于字符串的一部分,所以千萬(wàn)要小心縮進(jìn)
字符串占位符可以包含任意的JS表達(dá)式,占位符中可訪(fǎng)問(wèn)作用域中所有可訪(fǎng)問(wèn)的變量,嘗試嵌入一個(gè)未定義的變量總是會(huì)拋出錯(cuò)誤
let count = 10, price = 2.5, message = `${count} items cost $ ${(count * price).toFixed(2)}.` //10 items cost $ 25.00.
字符串占位符還可以?xún)?nèi)嵌,內(nèi)嵌的{后必須包含在反撇號(hào)中
let name = "angela", message = `Hello,${` my name is ${name}` }` console.log(message)
String.raw訪(fǎng)問(wèn)字符串前的原生字符串
let msg1 = `Multiline stirng`, msg2 = String.raw`Multiline string` console.log(msg1)//Multiline //string console.log(msg2)//Multiline string
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://m.specialneedsforspecialkids.com/yun/87367.html
摘要:為此決定自研一個(gè)富文本編輯器。本文,主要介紹如何實(shí)現(xiàn)富文本編輯器,和解決一些不同瀏覽器和設(shè)備之間的。 對(duì)ES6Generator函數(shù)的理解 Generator 函數(shù)是 ES6 提供的一種異步編程解決方案,語(yǔ)法行為與傳統(tǒng)函數(shù)完全不同。 JavaScript 設(shè)計(jì)模式 ② 巧用工廠(chǎng)模式和創(chuàng)建者模式 我為什么把他們兩個(gè)放在一起講?我覺(jué)得這兩個(gè)設(shè)計(jì)模式有相似之處,有時(shí)候會(huì)一個(gè)設(shè)計(jì)模式不能滿(mǎn)...
摘要:系列種優(yōu)化頁(yè)面加載速度的方法隨筆分類(lèi)中個(gè)最重要的技術(shù)點(diǎn)常用整理網(wǎng)頁(yè)性能管理詳解離線(xiàn)緩存簡(jiǎn)介系列編寫(xiě)高性能有趣的原生數(shù)組函數(shù)數(shù)據(jù)訪(fǎng)問(wèn)性能優(yōu)化方案實(shí)現(xiàn)的大排序算法一怪對(duì)象常用方法函數(shù)收集數(shù)組的操作面向?qū)ο蠛驮屠^承中關(guān)鍵詞的優(yōu)雅解釋淺談系列 H5系列 10種優(yōu)化頁(yè)面加載速度的方法 隨筆分類(lèi) - HTML5 HTML5中40個(gè)最重要的技術(shù)點(diǎn) 常用meta整理 網(wǎng)頁(yè)性能管理詳解 HTML5 ...
閱讀 3425·2021-11-25 09:43
閱讀 2310·2021-09-06 15:02
閱讀 3551·2021-08-18 10:21
閱讀 3349·2019-08-30 15:55
閱讀 2356·2019-08-29 17:06
閱讀 3540·2019-08-29 16:59
閱讀 971·2019-08-29 13:47
閱讀 2772·2019-08-26 13:24