1
0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-24 18:32:22 +00:00

修改string/template string

This commit is contained in:
Ruan Yifeng 2015-02-09 11:23:52 +08:00
parent 8a223e4413
commit b148bcdbfb
2 changed files with 43 additions and 5 deletions

View File

@ -42,6 +42,8 @@
- Mathias Bynens, [Unicode-aware regular expressions in ES6](https://mathiasbynens.be/notes/es6-unicode-regex): 详细介绍正则表达式的u修饰符 - Mathias Bynens, [Unicode-aware regular expressions in ES6](https://mathiasbynens.be/notes/es6-unicode-regex): 详细介绍正则表达式的u修饰符
- Nicholas C. Zakas, [A critical review of ECMAScript 6 quasi-literals](http://www.nczonline.net/blog/2012/08/01/a-critical-review-of-ecmascript-6-quasi-literals/) - Nicholas C. Zakas, [A critical review of ECMAScript 6 quasi-literals](http://www.nczonline.net/blog/2012/08/01/a-critical-review-of-ecmascript-6-quasi-literals/)
- Mozilla Developer Network, [Template strings](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/template_strings) - Mozilla Developer Network, [Template strings](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/template_strings)
- Addy Osmani, [Getting Literal With ES6 Template Strings](http://updates.html5rocks.com/2015/01/ES6-Template-Strings): 模板字符串的介绍
- Blake Winton, [ES6 Templates](https://weblog.latte.ca/blake/tech/firefox/templates.html): 模板字符串的介绍
## Object ## Object

View File

@ -375,13 +375,22 @@ r.sticky // true
`In JavaScript this is `In JavaScript this is
not legal.` not legal.`
console.log(`string text line 1
string text line 2`);
// 字符串中嵌入变量 // 字符串中嵌入变量
var name = "Bob", time = "today"; var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?` `Hello ${name}, how are you ${time}?`
``` ```
上面代码中的字符串,都是用反引号表示。如果在模板字符串中嵌入变量,需要将变量名写在`${}`之中。 上面代码中的字符串,都是用反引号表示。如果在模板字符串中嵌入变量,需要将变量名写在`${}`之中。如果在模板字符串中需要使用反引号,则前面要用反斜杠转义。
```javascript
var greeting = `\`Yo\` World!`;
```
大括号内部可以进行运算,以及引用对象属性。 大括号内部可以进行运算,以及引用对象属性。
@ -402,6 +411,19 @@ console.log(`${obj.x + obj.y}`)
``` ```
模板字符串之中还能调用函数。
```javascript
function fn() {
return "Hello World";
}
console.log(`foo ${fn()} bar`);
// foo Hello World bar
```
如果模板字符串中的变量没有声明,将报错。 如果模板字符串中的变量没有声明,将报错。
```javascript ```javascript
@ -441,21 +463,35 @@ tag`Hello ${ a + b } world ${ a * b}`;
- 第二个参数: 15 - 第二个参数: 15
- 第三个参数50 - 第三个参数50
也就是说tag函数实际的参数如下。
```javascript
tag(['Hello ', ' world '], 15, 50)
```
下面是tag函数的代码以及运行结果。
```javascript ```javascript
var a = 5; var a = 5;
var b = 10; var b = 10;
function tag(s, v1, v2) { function tag(s, v1, v2) {
console.log(s[0]); // "Hello " console.log(s[0]);
console.log(s[1]); // " world " console.log(s[1]);
console.log(v1); // 15 console.log(v1);
console.log(v2); // 50 console.log(v2);
return "OK"; return "OK";
} }
tag`Hello ${ a + b } world ${ a * b}`; tag`Hello ${ a + b } world ${ a * b}`;
// "Hello "
// " world "
// 15
// 50
// "OK" // "OK"
``` ```