es6學習文法總結-字元串

字元串周遊

ES6為字元串添加了周遊器接口，使得字元串可以被

for...of

循環周遊。

for (let codePoint of 'foo') {
  console.log(codePoint)
}
// 'f' 'o' 'o'      

這個周遊器最大的優點是可以識别大于

0xFFFF

的碼點，傳統的

for

循環無法識别這樣的碼點。

for (let i of text) {
  console.log(i);
}      

ES6提供了三種新方法。

• includes()：傳回布爾值，表示是否找到了參數字元串。
• startsWith()：傳回布爾值，表示參數字元串是否在源字元串的頭部。
• endsWith()：傳回布爾值，表示參數字元串是否在源字元串的尾部。

var s = 'Hello world!';
s.startsWith('Hello') // true
s.endsWith('!') // true
s.includes('o') // true
//第二個參數表示從第幾個位置開始搜尋
//endsWith的行為與其他兩個方法有所不同。
//它針對前n個字元，而其他兩個方法針對從第n個位置直到字元串結束。
s.startsWith('world', 6) // true 
s.endsWith('Hello', 5) // true 
s.includes('Hello', 6) // false      

repeat()方法

repeat

方法傳回一個新字元串，表示将原字元串重複

n

次，小數點會取整不是四舍五入，0~-1之間的小數取整後為0，NaN或字元串參數均會轉換為0

'x'.repeat(3) // "xxx"
'hello'.repeat(2) // "hellohello"
'na'.repeat(0) // ""
'na'.repeat(2.9) // "nana"
'na'.repeat(-1) //報錯      

字元串補全長度功能

padStart()

用于頭部補全，

padEnd()

用于尾部補全，共接受兩個參數。

第一個參數用來指定字元串的最小長度，第二個參數是用來補全的字元串。

兩者的長度之和超過了指定的最小長度，則會截去超出位數的補全字元串。如果省略第二個參數，預設使用空格補全長度。

從前開始補全
'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'
從後開始補全
'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'
提示字元串格式。
'12'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-12"
'09-12'.padStart(10, 'YYYY-MM-DD') // "YYYY-09-12"      

模闆字元串

模闆字元串用反引号（`）辨別。它可以當作普通字元串使用，也可以用來定義多行字元串，或者在字元串中嵌入變量。

// 普通字元串
`In JavaScript '\\n' is a line-feed.` 
//  In JavaScript
        is a line-feed.

// 多行字元串
`In JavaScript this is
 not legal.`

// 字元串中嵌入變量
var name = "Bob", time = "today";
`Hello ${name}, how are you ${time}?`      

如果在模闆字元串中需要使用反引号，則前面要用反斜杠轉義。

var greeting =\Yo\\ World!;      

使用模闆字元串表示多行字元串，所有的空格和縮進都會被保留在輸出之中。可以使用

trim

方法消除換行。

模闆字元串中嵌入變量，需要将變量名寫在

${}

之中。大括号内部可以放入任意的JavaScript表達式，可以進行運算，以及引用對象屬性。

$('#list').html(`
<ul>
  <li>first</li>
  <li>second</li>
</ul>
`.trim());      

//變量名寫在${}之中，大括号内部可以放入任意的JavaScript表達式，可以進行運算           

var x = 1;
var y = 2;
`${x} + ${y} = ${x + y}`      

模闆字元串之中調用函數。如果模闆字元串中的變量沒有聲明，将報錯

function fn() {
  return "Hello World";
}

`foo ${fn()} bar`      

标簽模闆

模闆字元串可以緊跟在一個函數名後面，該函數将被調用來處理這個模闆字元串。

alert`123`
// 等同于
alert(123)      

如果模闆字元裡面有變量，會将模闆字元串先處理成多個參數，再調用函數。

var a = 5;
var b = 10;
tag`Hello ${ a + b } world ${ a * b }`;
// 等同于
tag(['Hello ', ' world ', ''], 15, 50);      

String.raw`Hi\\n${2+3}!`;
// "Hi\\\\n5!"

String.raw`Hi\\u000A!`;
// 'Hi\\\\u000A!'