ES6 学习(4) ---字符串的扩展

字符的Unicode表示法

　　ES6加强了对Unicode的支持,允许采用\uxxx形式表示一个字符(突然想起了字体图标)其中xxx就是字符的Unicode码点,但是,这种表示法只限于码点在\u0000~\uFFFF之间的字符,超出这个范围的字符,就必须用两个双字节的形式表示

字符串的遍历

　　ES6,使得字符串可以被for...of循环遍历

1 for (let codePoint of 'foo') {
2   console.log(codePoint)
3 }
4 // "f"
5 // "o"
6 // "o"

 

字符串模板(常用)

　　字符串模板是增强版的字符串,用反引号(``)标识,他可以当做普通字符串使用,也可以用来定义多行字符串,或者在字符串中使用变量

 1 // 普通字符串
 2 `In JavaScript '\n' is a line-Feed.`
 3 
 4 // 多行字符串
 5 `In JavaScript this is
 6  not legal.`
 7 
 8 console.log(`string text line 1
 9 string text line 2`);
10 
11 // 字符串中嵌入变量
12 let name = "Bob", time = "today";
13 `Hello ${name}, how are you ${time}?`

 

注意:

　　1,如果在字符串模板中需要使用反引号,则前面要用反斜杠转义

　　2,如果使用字符串模板表示多行字符串,所有空格和缩进都会保留在输出之中,如果不想要换行的话,可以使用trim()方法来消除它

 

1 let str = `
2 <ul>
3   <li>first</li>
4   <li>second</li>
5 </ul>
6 `
7 str = str.trim()

 

 

　　3, 在字符串模板中嵌入变量,需要将变量名写在${}之中,大括号内部可以放入任意的JavaScript表达式,可以进行运算,以及引用对象属性;

　　

 1 let x = 1;
 2 let y = 2;
 3 
 4 `${x} + ${y} = ${x + y}`
 5 // "1 + 2 = 3"
 6 
 7 `${x} + ${y * 2} = ${x + y * 2}`
 8 // "1 + 4 = 5"
 9 
10 let obj = {x: 1, y: 2};
11 `${obj.x + obj.y}`
12 // "3"

　　4,字符串模板中还能调用函数,函数一定要有返回值,否则返回值为undefined

1 function fn() {
2   return "Hello World";
3 }
4 
5 `foo ${fn()} bar`
6 // foo Hello World bar,如果函数没有return,则为 "foo undefined bar" 

 

　　5,如果大括号的值不是字符串,将按照一般的规则转成字符串,如果,大括号是一个对象的话,将默认调用对象的toString方法,如果字符串模板中的变量没有声明,那么将会报错;

　　6, 字符串模板之中甚至还可以嵌入另一个字符串模板

1 const tmpl = addrs => `
2   <table>
3   ${addrs.map(addr => `
4     <tr><td>${addr.first}</td></tr>
5     <tr><td>${addr.last}</td></tr>
6   `).join('')}
7   </table>
8 `;

 

 

 

 

 

原文地址：https://www.cnblogs.com/newttt/p/11846023.html