1.字符串新增特性
Unicode表示法
遍歷接口
模板字符串
-
新增方法(10種)
eg:
1.Unicode表示法{ console.log('a','\u0061');//a a //碼值大于(0xFFFF)兩個(gè)字節(jié)的最大編碼的時(shí)候會(huì)怎么樣呢狡汉? console.log('s','\u20BB7'); //輸出:s []7(當(dāng)成了兩個(gè)字符修己,第一個(gè)不是unicode編碼所以沒(méi)有對(duì)應(yīng)的字符沒(méi)有正常顯示出來(lái)) //在ES6中怎么處理unicode編碼大于0xFFFF這么一個(gè)編碼呢? --用{}把unicode編碼包起來(lái)就可以了; console.log('s-1','\u{20BB7}'); //s-1 吉 }
2.codePointAt--取字符的碼值
{ //'吉'的unicode編碼\u{20BB7}大于0xFFFF盆顾,當(dāng)成了兩個(gè)字符醉蚁; /*它的碼值是大于兩個(gè)字節(jié)的拉背,這個(gè)時(shí)候就把它處理成4個(gè)字節(jié)了住闯,計(jì)算長(zhǎng)度的時(shí)候 每?jī)蓚€(gè)字節(jié)是一個(gè)長(zhǎng)度,所以這個(gè)地方長(zhǎng)度是2拂酣;*/ let s='吉'; let a = 'a'; //ES5: console.log('length',s.length, a.length); //length 2 1 //ES5:取編碼的時(shí)候的方法:charAt();--對(duì)unicode處理是不到位的秋冰; //charCodeAt只取兩個(gè)字節(jié); consle.log('0',s.charAt(0)); //取第一個(gè)位置的字符 結(jié)果:亂碼 consle.log('1',s.charAt(1)); //取第二個(gè)位置的字符 結(jié)果:亂碼 console.log('at0',s.charCodeAt(0)); //取第一個(gè)字符unicode編碼的碼值 at0 55362 console.log('at1',s.charCodeAt(1)); //取第二個(gè)字符unicode編碼的碼值 at1 57271 //ES6:取字符的碼值codePointAt() let s1='吉a'; console.log('length',s1.length); // length 3 //取第一個(gè)字符的碼值:code0 134071(十進(jìn)制的) //(第一個(gè)字符是用4個(gè)字節(jié)存儲(chǔ)的婶熬,取第一個(gè)字符位置的時(shí)候codePointAt會(huì)計(jì)算四個(gè)字節(jié)的碼值) console.log('code0',s1.codePointAt(0)); //看碼值對(duì)應(yīng)的是什么字符(轉(zhuǎn)換成16進(jìn)制)code0 20bb7 console.log('code0',s1.codePointAt(0).toString(16)); //code1 57271(取1的時(shí)候就是只取那個(gè)字符的后兩個(gè)字節(jié)) console.log('code1',s1.codePointAt(1)); //就會(huì)明白了取1的時(shí)候取了兩個(gè)字節(jié)剑勾,而不是從第4個(gè)字節(jié)之后去取 console.log('code2',s1.codePointAt(2)); // code2 97 (a) }
3.formCharCode--根據(jù)碼值給出對(duì)應(yīng)的字符
{
//ES5和ES6最大的區(qū)別就是能不能處理unicode字符
(大于0xFFFF--大于兩個(gè)字節(jié)的unicode字符);
//ES5:
console.log(String.formCharCode("0x20bb7")); //亂碼
//ES6:
console.log(String.fromCodePoint("0x20bb7")); //吉
}
4.字符串遍歷器接口:let of 遍歷器
通過(guò)字符串的遍歷器接口可以正常處理字符串中包含unicode編碼大于0xFFFF的情況赵颅;
{
let str ='\u{20bb7}abc';
//ES5:遍歷
for(let i=0;i<str.length;i++){
console.log('ES5',str[i]); //亂碼 亂碼 a b c
}
//ES6:
for(let code of str){
console.log('ES6:',code); //吉 a b c
}
}
5.includes && startsWith && endsWith
1.includes:判斷字符串中是否包含某些字符
2.startsWith &&endswith:判斷一個(gè)字符串是不是以某些字符為起始或截止
{
//判斷字符串中是否包含某些字符
//判斷字符串中是不是包含r字符
let str ="string";
console.log('includes:',str.includes("r")); // includes true
//一個(gè)字符串是不是以某些字符為起始或截止
//判斷是不是以str開(kāi)始的
console.log('start',str.startsWith('str')); //start true
//判斷是不是以ng截止的
console.log('end',str.endsWith('ng')); //end true
}
{
//重復(fù)--字符串的復(fù)制功能
let str = 'abc';
//ES6:repeat(數(shù)字) 數(shù)字:指定重復(fù)的次數(shù)
console.log(str.repeat(2)); //abcabc
}
6.模板字符串--把數(shù)據(jù)和模板最后拼成一個(gè)帶結(jié)果的字符串
{
let name ="list";
let info = "Hello world!"
let m =`i am ${name},${info}`;//(`鍵盤(pán)數(shù)字1左邊的按鍵)
console.log(m); //i am list,hello world!
}
7.padStart && padEnd
ES6沒(méi)有實(shí)現(xiàn)虽另,ES7的一個(gè)草案,加了babel--polyfill這個(gè)庫(kù)的話也是可以在ES6中使用的性含;
padStart:補(bǔ)白的作用--向前補(bǔ)洲赵;
padEnd: 補(bǔ)白的作用--向后補(bǔ)鸳惯;
{
//padStart 補(bǔ)白的作用--向前補(bǔ)商蕴;(例如:日期小于10的01-09可以用這個(gè))
API返回的最終結(jié)果就是要求第一個(gè)參數(shù)是長(zhǎng)度
(api返回的字符串必須滿足第一個(gè)參數(shù)指定的長(zhǎng)度)叠萍,如果長(zhǎng)度不夠第二個(gè)參數(shù)要補(bǔ)什么
console.log('1'.padStart(2,'0')); //01
//padEnd 向后補(bǔ)白;
console.log('1'.padEnd(2,'0')); //10
}
8.標(biāo)簽?zāi)0?/strong>
作用:
1.在過(guò)濾html字符串的時(shí)候(在防止xss攻擊的時(shí)候用這個(gè)處理)
2.處理多語(yǔ)言轉(zhuǎn)換的時(shí)候绪商;
{
let user ={
name:'list',
info:'hello world'
};
console.log(abc`i am ${user.name},${user.info}`);//輸出:i am ,,,listhello world
function abc(s,v1,v2){
//["i am",",","",raw:Array[3]] "list" "hello world"
console.log(s,v1,v2);
return s+v1+v2;
}
}
9.raw
raw對(duì)所有的斜杠進(jìn)行了轉(zhuǎn)義苛谷,斜杠之前加了斜杠,斜杠是不生效的格郁;
{
console.log(string.raw'Hi\n${1+2}'); //Hi\n3(\n換行符并沒(méi)有生效)
console.log('Hi\n${1+2}'); // Hi 3
}