(二)8.字符串扩展19-08-07

安装babel-polyfill实现兼容库 --save-dev
LYKdeMacBook-Pro:coding-98 hm$ babel-polyfill --save-dev
在index.js中引入兼容库

import 'babel-polyfill';
import './class/lesson4';

到lesson4.js中

字符字节数大于0xFFFF时的一些处理方法

{
  console.log('a',`\u0061`);

  //当UNICODE编码大于0xFFFF即两个字节的时候，这个时候会让前4个（20BB）作为一个字符，后面的7单独拿出来作为一个字符即两个字节
  console.log('s',`\u20BB7`);

  //当UNICODE编码大于0xFFFF即两个字节的时候,需将其用大括号包起来
  console.log('s',`\u{20BB7}`);
}

打印结果：
a a
s ₻7
s 𠮷

{
  let s = '𠮷';
  console.log('length',s.length);//打印字符长度
  //每两个字节是一个长度 "一" 、"a"的length是1, "𠮷"的length是2

  //es5中
  console.log('0',s.charAt(0)); //取字符串第一个位置的字符
  console.log('1',s.charAt(1)); //取字符串第二个位置的字符
  console.log('at0',s.charCodeAt(0));
  console.log('at1',s.charCodeAt(1)); //取码值

  //es6
  let s1 = '𠮷a';
  console.log('length',s1.length);
  // console.log('code0',s1.codePointAt(0));
  console.log('code0',s1.codePointAt(0).toString(16));
 //取第一字节码值 并转换成16进制，这里可以将第一个字符的完整码20bb7取出。
  console.log('code1',s1.codePointAt(1)); //取第二字节码值
  console.log('code2',s1.codePointAt(2)); //取第三字节码值 即a的码值
}

打印结果：
length 2

0 �
1 �
at0 55362
at1 57271

length 3
code0 20bb7
code1 57271
code2 97

{
  //es5中的方法
  console.log(String.fromCharCode("0x20bb7"));
  //es6中的方法  和上面方法唯一的区别是能不能处理大于‘0xFFFF’的UNICODE字符
  console.log(String.fromCodePoint("0x20bb7"));
}

打印结果：
ஷ
𠮷

{
  //es5的方法遍历字节大于0xFFFF的字符
  let str='\u{20bb7}abc';
  for (let i=0;i<str.length;i++){
    console.log('es5',str[i]);
  }
}

打印结果：
es5 �
es5 �
es5 a
es5 b
es5 c

{
  //es6的方法遍历字符
  for (let code of str){
    //这里没有使用for循环而是使用let of遍历器
    console.log('es6',code);
  }
}

打印结果：
es6 𠮷
es6 a
es6 b
es6 c

判断字符串中是否包含某些字符，判断是不是以某些字符起始、结束的、字符串重复

{
  let str="string";
  console.log('includes',str.includes("r"));//判断字符串中是否包含'r'字符
  console.log('start',str.startsWith('str'));//判断是不是以'str'字符起始的
  console.log('end',str.endsWith('ing'));//判断是不是以'ing'字符结束的
  console.log(str.repeat(3)); //重复3次 'stringstringstring'
}

打印结果：
includes true
start true
end true
stringstringstring

模板字符串 字符串拼接

{
  let name="list";
  let info="hello world";
  let m=`i am ${name},${info}`;
  console.log(m);
}

打印结果：i am list,hello world

补字符串长度

{
  console.log('1'.padStart(2,'0'));
  //(2,0)中2的意思是字符必须要满足这个长度，0是如果长度不够就用0补,这里是向前补
  console.log('1'.padEnd(2,'0')); //这里是向后补
}

打印结果：
01
10

标签模板 好处：防止xss攻击的时候使用， 处理多语言转换的时候

{
  let user={
    name:'list',
    info:'hello world',
  };
  console.log(abc`i am ${user.name},${user.info}`);
  //abc`i am ${user.name},${user.info}`;
  function abc(s,v1,v2) {
    console.log(s,v1,v2);
    return s+v1+v2
  }
}

打印结果：
(3) ["i am ", ",", "", raw: Array(3)] "list" "hello world"
i am ,,,listhello world

{
  console.log(String.raw`Hi\n${1+2}`);//raw API对所有\进行了转译让换行符不生效
  console.log(`Hi\n${1+2}`);
}