1.字符串新增特性
Unicode表示法
遍历接口
模板字符串
-
新增方法(10种)
eg:
1.Unicode表示法{ console.log('a','\u0061');//a a //码值大于(0xFFFF)两个字节的最大编码的时候会怎么样呢? console.log('s','\u20BB7'); //输出:s []7(当成了两个字符,第一个不是unicode编码所以没有对应的字符没有正常显示出来) //在ES6中怎么处理unicode编码大于0xFFFF这么一个编码呢? --用{}把unicode编码包起来就可以了; console.log('s-1','\u{20BB7}'); //s-1 吉 }
2.codePointAt--取字符的码值
{ //'吉'的unicode编码\u{20BB7}大于0xFFFF,当成了两个字符; /*它的码值是大于两个字节的,这个时候就把它处理成4个字节了,计算长度的时候 每两个字节是一个长度,所以这个地方长度是2;*/ let s='吉'; let a = 'a'; //ES5: console.log('length',s.length, a.length); //length 2 1 //ES5:取编码的时候的方法:charAt();--对unicode处理是不到位的; //charCodeAt只取两个字节; consle.log('0',s.charAt(0)); //取第一个位置的字符 结果:乱码 consle.log('1',s.charAt(1)); //取第二个位置的字符 结果:乱码 console.log('at0',s.charCodeAt(0)); //取第一个字符unicode编码的码值 at0 55362 console.log('at1',s.charCodeAt(1)); //取第二个字符unicode编码的码值 at1 57271 //ES6:取字符的码值codePointAt() let s1='吉a'; console.log('length',s1.length); // length 3 //取第一个字符的码值:code0 134071(十进制的) //(第一个字符是用4个字节存储的,取第一个字符位置的时候codePointAt会计算四个字节的码值) console.log('code0',s1.codePointAt(0)); //看码值对应的是什么字符(转换成16进制)code0 20bb7 console.log('code0',s1.codePointAt(0).toString(16)); //code1 57271(取1的时候就是只取那个字符的后两个字节) console.log('code1',s1.codePointAt(1)); //就会明白了取1的时候取了两个字节,而不是从第4个字节之后去取 console.log('code2',s1.codePointAt(2)); // code2 97 (a) }
3.formCharCode--根据码值给出对应的字符
{
//ES5和ES6最大的区别就是能不能处理unicode字符
(大于0xFFFF--大于两个字节的unicode字符);
//ES5:
console.log(String.formCharCode("0x20bb7")); //乱码
//ES6:
console.log(String.fromCodePoint("0x20bb7")); //吉
}
4.字符串遍历器接口:let of 遍历器
通过字符串的遍历器接口可以正常处理字符串中包含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:判断一个字符串是不是以某些字符为起始或截止
{
//判断字符串中是否包含某些字符
//判断字符串中是不是包含r字符
let str ="string";
console.log('includes:',str.includes("r")); // includes true
//一个字符串是不是以某些字符为起始或截止
//判断是不是以str开始的
console.log('start',str.startsWith('str')); //start true
//判断是不是以ng截止的
console.log('end',str.endsWith('ng')); //end true
}
{
//重复--字符串的复制功能
let str = 'abc';
//ES6:repeat(数字) 数字:指定重复的次数
console.log(str.repeat(2)); //abcabc
}
6.模板字符串--把数据和模板最后拼成一个带结果的字符串
{
let name ="list";
let info = "Hello world!"
let m =`i am ${name},${info}`;//(`键盘数字1左边的按键)
console.log(m); //i am list,hello world!
}
7.padStart && padEnd
ES6没有实现,ES7的一个草案,加了babel--polyfill这个库的话也是可以在ES6中使用的;
padStart:补白的作用--向前补;
padEnd: 补白的作用--向后补;
{
//padStart 补白的作用--向前补;(例如:日期小于10的01-09可以用这个)
API返回的最终结果就是要求第一个参数是长度
(api返回的字符串必须满足第一个参数指定的长度),如果长度不够第二个参数要补什么
console.log('1'.padStart(2,'0')); //01
//padEnd 向后补白;
console.log('1'.padEnd(2,'0')); //10
}
8.标签模板
作用:
1.在过滤html字符串的时候(在防止xss攻击的时候用这个处理)
2.处理多语言转换的时候;
{
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对所有的斜杠进行了转义,斜杠之前加了斜杠,斜杠是不生效的;
{
console.log(string.raw'Hi\n${1+2}'); //Hi\n3(\n换行符并没有生效)
console.log('Hi\n${1+2}'); // Hi 3
}