所有模板字符串的空格和换行金沙js娱乐场官方网站:,ES6为字符串添加了遍历接口

表示,在这样不断的学习过程中,),该方法不能识别码点大于0xFFFF的字符,对字符串对象提供charAt方法,除了遍历字符串,循环遍历,所有模板字符串的空格和换行,在使用模板字符串时

金沙js娱乐场官方网站 2

includes(), startsWith(), endsWith()

ES6 提供了三种新方法来确定一个字符串是否包含在另一个字符串中:

  • includes():返回布尔值,表示是否字符串字符串。
  • startsWith():返回布尔值,表示是否包含字符串开头。
  • endsWith():返回布尔值,表示是否包含字符串结尾。

let s = 'Hello world!';s.startsWith // trues.endsWith // trues.includes // true

includes()indexOf()的优势在于,indexOf()的返回结果不是布尔值,须与-1对比,不够直观。

这三个方法都支持第二个参数,表示开始搜索的位置

let s = 'Hello world!';s.startsWith('world', 6) // trues.endsWith('Hello', 5) // trues.includes('Hello', 6) // false

使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他两个方法针对从第n个位置直到字符串结束。

4.repeat()方法

该方法返回一个新字符串,表示将原字符串重复n次。

根据其参数类型分为以下几种:

(1)参数是正整数;

(2)参数是小数,会被取整;

(3)参数是负数或Infinity会报错,如果参数是0到-1之间的小数,则等同于0;

(4)参数是NAN 等同于0;

(5)参数是字符串,则会先转换成数字;

  //1.参数是正整数
  console.log('hello'.repeat(2)) // "hellohello"
  console.log('na'.repeat(0)) // ""
  //2.参数是小数
  console.log('na'.repeat(2.9)) // "nana"
  //3. 参数是Inifinity
  console.log('na'.repeat(Infinity))
  //4. 参数是负数
  // RangeError
  console.log('na'.repeat(-1))
  // RangeError
  //5. 参数是0~-1之间的小数
  console.log('na'.repeat(-0.9)) // ""
  //6. 参数是NAN
  console.log('na'.repeat(NaN)) // ""
  //7. 参数是字符串
  console.log('na'.repeat('na')) // ""
  console.log('na'.repeat('3')) // "nanana"

1 字符串的遍历

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

1、字符串的遍历

ES6为字符串添加了遍历接口,使得字符串可以被 for...of 循环遍历。

for( let i of 'bar' ) {
  console.log( i );
}
// b
// a
// r

金沙js娱乐场官方网站 1

遍历字符串

除了遍历字符串,这个遍历器最大的优点是可以识别大于0xFFFF1的码点,传统的for`循环无法识别这样的码点。

var text = String.fromCodePoint(0x20BB7);

for (let i = 0; i < text.length; i++) {
  console.log(text[i]);
}
// " "
// " "

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

字符串自动补全

  • padStart()用于头部补全,padEnd()用于尾部补全.

     'x'.padStart(5, 'ab') // 'ababx'

第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。
如果用来补全的字符串与原字符串,两者的长度之和超过了指定的最小长度,则会截去超出位数的补全字符串。
如果省略第二个参数,默认使用空格补全长度

repeat()

repeat方法返回一个新字符串,表示将原字符串重复n次。

'x'.repeat // "xxx"'hello'.repeat // "hellohello"'na'.repeat // ""
  • 如果参数是正小数,会取整。
  • 如果参数是负数,会报错。
  • 如果参数是0,会得到空串。
  • 如果参数是字符串、布尔型或其他类型,会先换算成整数。

7.标签模板

6 模板字符串

模板字符串(template
string)是增强版的字符串,用反引号(`)标识。它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量.

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

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

console.log(`string text line 1
string text line 2`);

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

上面代码中,所有模板字符串的空格和换行,都是被保留的,比如<ul>标签前面会有一个换行。如果你不想要这个换行,可以使用trim方法消除它。

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

模板字符串中嵌入变量,需要将变量名写在${}之中。

function authorize(user, action) {
  if (!user.hasPrivilege(action)) {
    throw new Error(
      // 传统写法为
      // 'User '
      // + user.name
      // + ' is not authorized to do '
      // + action
      // + '.'
      `User ${user.name} is not authorized to do ${action}.`);
  }
}

大括号内部可以放入任意的JavaScript表达式,可以进行运算,以及引用对象属性。

var x = 1;
var y = 2;

`${x} + ${y} = ${x + y}`
// "1 + 2 = 3"

`${x} + ${y * 2} = ${x + y * 2}`
// "1 + 4 = 5"

var obj = {x: 1, y: 2};
`${obj.x + obj.y}`
// "3"

模板字符串之中还能调用函数。

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

`foo ${fn()} bar`
// foo Hello World bar

如果需要引用模板字符串本身,在需要时执行,可以像下面这样写。

// 写法一
let str = 'return ' + '`Hello ${name}!`';
let func = new Function('name', str);
func('Jack') // "Hello Jack!"

// 写法二
let str = '(name) => `Hello ${name}!`';
let func = eval.call(null, str);
func('Jack') // "Hello Jack!"

4、padStart(),padEnd()

ES2017
引入了字符串补全长度的功能。如果某个字符串不够指定长度,会在头部或尾部补全。padStart()用于头部补全,padEnd()用于尾部补全。

'x'.padStart(5, 'ab') // 'ababx'
'x'.padStart(4, 'ab') // 'abax'

'x'.padEnd(5, 'ab') // 'xabab'
'x'.padEnd(4, 'ab') // 'xaba'

上面代码中,padStart和padEnd一共接受两个参数,第一个参数用来指定字符串的最小长度,第二个参数是用来补全的字符串。

如果原字符串的长度,等于或大于指定的最小长度,则返回原字符串。

'xxx'.padStart(2, 'ab') // 'xxx'
'xxx'.padEnd(2, 'ab') // 'xxx'

padStart的常见用途是为数值补全指定位数。下面代码生成10位的数值字符串。

'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"

另一个用途是提示字符串格式。

'05'.padStart(10, 'YYYY-MM-DD') // "YYYY-MM-05"
'05-10'.padStart(10, 'YYYY-MM-DD') // "YYYY-05-10"

金沙js娱乐场官方网站 2

padStart

模板字符串

在使用模板字符串时,所有模板字符串的空格和换行,都是被保留的,比如<ul>标签前面会有一个换行。如果你不想要这个换行,可以使用trim方法消除它。

     let str = `
         <ul>
             <li>first</li>
             <li>second</li>
         </ul>`.trim()
     console.log(str)

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

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

     console.log(`foo ${fn()} bar`) // foo Hello World bar

模板字符串

  • 模板字符串(template string)是增强版的字符串,用反引号标识。
  • 可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。
  • 在字符串中嵌入变量需要使用${变量名}的形式,$前面可以紧贴其他字符,$也可以加\转义。

// 普通字符串`In JavaScript '\n' is a line-feed.`// 多行字符串`In JavaScript this is not legal.`console.log(`string text line 1string text line 2`);// 字符串中嵌入变量let name = "Bob", time = "today";`Hello ${name}, how are you ${time}?`
  • ${}里面可以放任意表达式,可以理解为,先计算这个表达式,无论它返回什么,无论它是什么类型,都转换为字符串,然后再跟前、后字符串相连。

  • ${}里面还可以放函数调用,以返回值作为自己的值。

6.模板字符串

模板字符串(template string)是增强版的字符串,用反引号(`)标识。

它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。

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

 var string = `\`Hello\` World!`;
 console.log(string);//`Hello` World!

 

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

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

模板字符串中嵌入变量,需要将变量名写在${}之中。

大括号内部可以放入任意的JavaScript表达式,可以进行运算,以及引用对象属性。

var x = 1, y = 2,obj = {x: 1, y: 2};

  console.log(`${x} + ${y} = ${x + y}`);// "1 + 2 = 3"
  console.log(`${x} + ${y * 2} = ${x + y * 2}`);// "1 + 4 = 5"

  console.log(`${obj.x + obj.y}`);// 3

模板字符串之中还能调用函数。如下:

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

`foo ${fn()} bar`// foo Hello World bar

 模板字符串甚至还能嵌套。

3 includes(), startsWith(), endsWith()

传统上,JavaScript只有indexOf方法,可以用来确定一个字符串是否包含在另一个字符串中。ES6又提供了三种新方法。

includes():返回布尔值,表示是否找到了参数字符串。
startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。
这三个方法都支持第二个参数,表示开始搜索的位置。

var s = 'Hello world!';

s.startsWith('world', 6) // true
s.endsWith('Hello', 5) // true
s.includes('Hello', 6) // false

上面代码表示,使用第二个参数n时,endsWith的行为与其他两个方法有所不同。它针对前n个字符,而其他两个方法针对从第n个位置直到字符串结束。

3、repeat()

repeat方法返回一个新字符串,表示将原来字符串重复n次。

"x".repeat(3); // "xxx"
"diu".repeat(2); // "diudiu"
"he".repeat(0); // ""

注:repeat的参数一般都是传正整数

标签模板

模板字符串的功能,不仅仅是上面这些。它可以紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。

    alert`123`
    等同于
    alert(123)