ES6——（二）

最新推荐文章于 2024-07-30 11:56:22 发布

丸子嘻嘻

最新推荐文章于 2024-07-30 11:56:22 发布

阅读量202

点赞数

本文链接：https://blog.csdn.net/TWFKXP/article/details/79521940

版权

目录：
（八）字符串
（九）正则的扩展
（十）数值的扩展
（十一） Math 对象的扩展

（八）字符串

字符串的遍历器接口

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

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

at()
at方法，可以识别Unicode编号大于0xFFFF的字符，返回正确的字符。

'abc'.at(0) // "a"
''.at(0) // ""

includes()
返回布尔值，表示是否找到了参数字符串。

       let song = "let her go";
       console.log(song.includes('her')); // true

   // includes（x,n） 它针对从n个位置直到字符串结束         
       let song = "let her go";
       console.log(song.includes('go',8)); // true

startsWith()
返回布尔值，表示参数字符串是否在源字符串的头部。

       let song = "let her go";
       console.log(song.startsWith('her')); // false

   // startsWith（x,n） 它针对从n个位置直到字符串结束   
       let song = "let her go";
       console.log(song.startsWith('go',8)); // true

endsWith()
返回布尔值，表示参数字符串是否在源字符串的尾部。

       let song = "let her go";
       console.log(song.endsWith('her')); // false

   // endsWith（x,n） 它针对前n个字符   
       let song = "let her go";
       console.log(song.endsWith('let',3)); // true

repeat()

返回一个新字符串，表示将原字符串重复n次。

alert( song.repeat(2)); // let her golet her go

padStart()

用于头部补全 ,接受两个参数，第一个参数用来指定字符串的最小长度，第二个参数是用来补全的字符串。

 alert(song.padStart(21,"you sha bi ")); 
 // you sha bi let her go

padEnd()
用于尾部补全，接受两个参数，第一个参数用来指定字符串的最小长度，第二个参数是用来补全的字符串。


       alert(song.padEnd(17," please")); 
       //let her go please

注意
padStart()，padEnd()

1.如果省略第二个参数，默认使用空格补全长度。

2.如果用来补全的字符串与原字符串，两者的长度之和超过了指定的最小长度，则会截去超出位数的补全字符串。

用途
（1）为数值补全指定位数。

 // 下面代码生成10位的数值字符串。 
'1'.padStart(10, '0') // "0000000001"
'12'.padStart(10, '0') // "0000000012"
'123456'.padStart(10, '0') // "0000123456"

（2）提示字符串格式。

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

模板字符串

（1）用反引号 ` 标识。

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

（3）使用模板字符串时，所有的空格和缩进都会被保留在输出之中

 // 多行字符串, 会按照字符串的格式输出
       alert(`boys:
              let her go please!`); 

 // 嵌入变量              
       let boy = "john";
       let girl = "lisa ";
       alert(`${boy} let ${girl} go please!`);  
       //john let lisa  go please!

大括号内部可以放入任意的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

（九）正则的扩展

RegExp构造函数

如果RegExp构造函数第一个参数是一个正则对象，那么可以使用第二个参数指定修饰符。而且，返回的正则表达式会忽略原有的正则表达式的修饰符，只使用新指定的修饰符。

// 修改修饰符
new RegExp(/abc/ig, 'i').flags
// "i"

u修饰符

含义为“Unicode模式”，用来正确处理大于\uFFFF的Unicode字符。即会正确处理四个字节的UTF-16编码。

（1）点字符

含义是除了换行符以外的任意单个字符。对于码点大于0xFFFF的Unicode字符，点字符不能识别，必须加上u修饰符。

var s = '';

/^.$/.test(s) // false
/^.$/u.test(s) // true

（2）Unicode字符表示法

/\u{61}/.test('a') // false
/\u{61}/u.test('a') // true
/\u{20BB7}/u.test('') // true

上面代码表示，如果不加u修饰符，正则表达式无法识别 \u{61} 这种表示法，只会认为这匹配61个连续的u。

（3）量词

使用u修饰符后，所有量词都会正确识别码点大于0xFFFF的Unicode字符。

/a{2}/.test('aa') // true
/a{2}/u.test('aa') // true
/{2}/.test('') // false
/{2}/u.test('') // true

另外，只有在使用u修饰符的情况下，Unicode表达式当中的大括号才会被正确解读，否则会被解读为量词。

（4）i修饰符

有些Unicode字符的编码不同，但是字型很相近，比如，\u004B与\u212A都是大写的K。

/[a-z]/i.test('\u212A') // false
/[a-z]/iu.test('\u212A') // true

上面代码中，不加u修饰符，就无法识别非规范的K字符。

y 修饰符

叫做“粘连”（sticky）修饰符。

y修饰符的作用与g修饰符类似，也是全局匹配，后一次匹配都从上一次匹配成功的下一个位置开始。不同之处在于，g修饰符只要剩余位置中存在匹配就可，而y修饰符确保匹配必须从剩余的第一个位置开始，这也就是“粘连”的涵义。

var s = 'aaa_aa_a';
var r1 = /a+/g;
var r2 = /a+/y;

r1.exec(s) // ["aaa"]
r2.exec(s) // ["aaa"]

r1.exec(s) // ["aa"]
r2.exec(s) // null

（1）g 与 y “联手”

单单一个y修饰符对match方法，只能返回第一个匹配，必须与g修饰符联用，才能返回所有匹配。

'a1a2a3'.match(/a\d/y) // ["a1"]
'a1a2a3'.match(/a\d/gy) // ["a1", "a2", "a3"]

（2）sticky属性

判断是否设置了 y 修饰符

var r = /hello\d/y;
r.sticky // true

（3）flags属性

返回正则表达式的修饰符。

（十）数值的扩展

二进制和八进制表示法

ES6 提供了二进制和八进制数值的新的写法，分别用前缀0b（或0B）和0o（或0O）表示。

  // 如果要将0b和0o前缀的字符串数值转为十进制，要使用Number方法。
    Number('0b111')  // 7
    Number('0o10')  // 8

Number

（1）Number.isFinite()

检查一个数值是否为有限的

 // 只有参数是数值时，才会返回true
Number.isFinite(15); // true
Number.isFinite(0.8); // true
Number.isFinite(NaN); // false
Number.isFinite(Infinity); // false
Number.isFinite(-Infinity); // false
Number.isFinite('foo'); // false
Number.isFinite('15'); // false
Number.isFinite(true); // false

（2）Number.isNaN()

用来检查一个值是否为NaN

// 只有参数是 NAN 和'true'/'true' 的时 才返回true
Number.isNaN(NaN) // true
Number.isNaN(15) // false
Number.isNaN('15') // false
Number.isNaN(true) // false
Number.isNaN(9/NaN) // true
Number.isNaN('true'/0) // true
Number.isNaN('true'/'true') // true

与传统的全局方法isFinite()和isNaN()的区别

传统方法先调用Number()将非数值的值转为数值，再进行判断，而这两个新方法只对数值有效，Number.isFinite()对于非数值一律返回false, Number.isNaN()只有对于NaN才返回true，非NaN一律返回false。

（3）Number.parseInt() 与Number.parseFloat()

ES6将全局方法parseInt()和parseFloat()，移植到Number对象上面，行为完全保持不变，这样做的目的，是逐步减少全局性方法，使得语言逐步模块化。

// ES5的写法
parseInt('12.34') // 12
parseFloat('123.45#') // 123.45

// ES6的写法
Number.parseInt('12.34') // 12
Number.parseFloat('123.45#') // 123.45

（4）Number.isInteger()

判断一个值是否为整数

注意，JavaScript内部，整数和浮点数是同样的储存方法，所以3和3.0被视为同一个值。

Number.isInteger(25) // true
Number.isInteger(25.0) // true
Number.isInteger(25.1) // false
Number.isInteger("15") // false
Number.isInteger(true) // false

（十一） Math 对象的扩展

Math.trunc()

用于去除一个数的小数部分，返回整数部分。

Math.trunc(4.1) // 4
Math.trunc(4.9) // 4
Math.trunc(-4.1) // -4
Math.trunc(-4.9) // -4
Math.trunc(-0.1234) // -0

对于非数值，Math.trunc内部使用Number方法将其先转为数值。

Math.trunc('123.456')
// 123

对于空值和无法截取整数的值，返回NaN。

Math.trunc(NaN);      // NaN
Math.trunc('foo');    // NaN
Math.trunc();         // NaN

Math.sign()

用来判断一个数到底是正数、负数、还是零。

返回的规则：

参数为正数，返回+1；
参数为负数，返回-1；
参数为0，返回0；
参数为-0，返回-0;
其他值，返回NaN。


Math.sign(-5) // -1
Math.sign(5) // +1
Math.sign(0) // +0
Math.sign(-0) // -0
Math.sign(NaN) // NaN
Math.sign('foo'); // NaN
Math.sign();      // NaN

Math.cbrt()

Math.cbrt方法用于计算一个数的立方根。对于非数值，Math.cbrt方法内部也是先使用Number方法将其转为数值。

Math.cbrt(-1) // -1
Math.cbrt(0)  // 0
Math.cbrt(1)  // 1
Math.cbrt(2)  // 1.2599210498948734
Math.cbrt('8') // 2
Math.cbrt('hello') // NaN

Math.hypot()

Math.hypot方法返回所有参数的平方和的平方根,如果参数不是数值，Math.hypot方法会将其转为数值。只要有一个参数无法转为数值，就会返回NaN。

Math.hypot(3, 4); // 5
Math.hypot(3, 4, 5); // 7.0710678118654755
Math.hypot(); // 0
Math.hypot(NaN); // NaN
Math.hypot(3, 4, ‘foo’); // NaN
Math.hypot(3, 4, ‘5’); // 7.0710678118654755
Math.hypot(-3); // 3

对数方法

1） Math.expm1()

Math.expm1(x)返回ex - 1，即Math.exp(x) - 1。

Math.expm1(-1) // -0.6321205588285577
Math.expm1(0)  // 0
Math.expm1(1)  // 1.718281828459045

（2）Math.log1p()

Math.log1p(x)方法返回1 + x的自然对数，即Math.log(1 + x)。如果x小于-1，返回NaN。

 Math.log1p(1)  // 0.6931471805599453
Math.log1p(0)  // 0
Math.log1p(-1) // -Infinity
Math.log1p(-2) // NaN

（3）Math.log10()

Math.log10(x)返回以10为底的x的对数。如果x小于0，则返回NaN。

Math.log10(2)      // 0.3010299956639812
Math.log10(1)      // 0
Math.log10(0)      // -Infinity
Math.log10(-2)     // NaN
Math.log10(100000) // 5

（4）Math.log2()

Math.log2(x)返回以2为底的x的对数。如果x小于0，则返回NaN。

Math.log2(3)       // 1.584962500721156
Math.log2(2)       // 1
Math.log2(1)       // 0
Math.log2(0)       // -Infinity
Math.log2(-2)      // NaN
Math.log2(1024)    // 10
Math.log2(1 << 29) // 29