ES6ES7ES8

ES6

1、let & const & 顶层对象

• let 和var类似，但只在let命令所在的代码块内有效（没有变量提升）(暂时性死区)（不允许重复声明）
  用let声明的变量，在声明之前使用都会报错
• const 声明一个只读的常量，一旦声明，常量的值就不能改变。（不允许重复声明）

  1 2 3 4

  const foo = {} foo.a = 3; // 可以 foo = {a:3}; // 不行 指向的地址不能改变 // 可以使用Object.freeze({}) 冻结对象

• 顶层对象 window global

  1 2 3 4

  var a = 1; window.a // 1 let b == 2; window.b // undefined

2、结构赋值

• 数组的结构赋值
  本质上，只要等号两边的模式相同，左边的变量就会赋予对应的值。如果结构不能成，变量的值就等于undefined（如果等号右边不是数组将会报错）

  1 2 3 4

  let [foo,[[bar],baz]] = [1,[[2],3]]; foo // 1 bar // 2 baz // 3

  可以给默认值

  1 2	let [foo = 'a'] = []; foo // 'a'

• 对象的结构赋值
  变量必须与属性同名才能取到正确的值

  1 2 3

  let {foo,baz} = {foo:'a',bar:'b'}; foo // 'a' baz // undefined

  也可以嵌套结构

  1 2 3 4 5 6 7 8 9

  let obj = { p:[ 'a', {y:'b'} ] }; let {p:[foo,{y}]} = obj; foo // 'a' y // 'b'

• 字符串的结构赋值

  1 2 3

  let [a,b,c,d,e] = 'hello'; a // 'h' b // 'e'

  也可以对属性结构赋值

  1 2	let {length : len} = 'hello'; length // 5

• 数值和布尔值的结构赋值
  如果等号右边的是数值和布尔，则会先转为对象

  1 2 3 4

  let {toString : s} = 123; s === Number.prototype.toString // true let {toString : s} = true; s === Boolean.prototype.toString // true

  undefined 和 null 无法转为对象，所以对他们进行结构赋值会报错
• 函数参数的结构赋值

  1 2 3 4 5 6

  function add([x,y]){ return x + y } add([1,2]) // 3 [[1,2],[3,4]].map(([a,b])=>a+b) // [3,7]

• 结构赋值少使用圆括号，会报错*

3、字符串的 方法和扩展

• 字符的Unicode表示法

  1 2 3 4 5

  '\z' === 'z' // true '\172' === 'z' // true '\x7A' === 'z' // true '\u007A' === 'z' // true '\u{7A}' === 'z' // true

• 字符串的遍历器接口
  字符串可以被 for…of 循环遍历

  1 2 3 4 5 6

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

• 模板字符串

  1	let a = `${b}eee`;

  .trim() 可以消除换行

  4、正则

• 1、RegExp 构造函数

  1 2 3 4

  let regex = new RegExp('xyz','i') let regex = new RegExp(/xyz/,'i') let regex = new RegExp(/xyz/i) let regex = new RegExp(/xyz/ig,'i') // ig 会被第二个参数覆盖

• 2、字符串的正则方法

  • match
  • replace
  • search
  • split

• 3、u 修饰符
  Unicode模式 （汉字的时候注意）
  /\,/u //报错

• 4、RegExp.prototype.unicode
  是否设置了u修饰符；

  1 2 3 4 5

  const r1 = /hello/; const r2 = /hello/u; r1.unicode // false r2.unicode // true

• 5、y 修饰符
  “粘连”修饰符
  y跟g一样，y修饰符确保匹配必须从第一位值开始
  g会忽略非法字符，y不会

• 6、RegExp.prototype.sticky
  是否这是了y修饰符

  1 2	let r = /hello/y; r.sticky // true

• 7、RegExp.prototype.flags

  1 2	/abc/ig.source // 返回正则表达式正文 'abc' /abc/.ig.flags // 返回正则表达式修饰符 'ig'

• 8、s 修饰符：dotAll 模式
  正则表达式中，点（.）是一个特殊字符，代表任意的单个字符，但是有两个 例外。一个是四个字节的 UTF-16 字符，这个可以用u修饰符解决；另一个 是行终止符（line terminator character）。

  1 2	/foo.bar/.test('foo\nbar') // false /foo.bar/s.test('foo\nbar') // true

  这被称为dotAll模式，即点（dot）代表一切字符。所以，正则表达式还引入了一个dotAll属性，返回一个布尔值，表示该正则表达式是否处在dotAll模式。

  1 2 3 4

  const re = /foo.bar/s; re.test('foo\nbar') // true re.dotAll // true re.flags // 's'

• 9、后行断言

• 10、Unicode 属性类

• 11、具名匹配
  正则表达式使用圆括号进行组匹配
  ES2018 引入类 具名匹配，允许每个组匹配质地ing一个名字，即便于阅读代码，又便于引用

  1 2	let re = /(?<year>\d{4})=(?<month>\d{2})-(?<day>\d{2})/u; '2015-01-02'.replace(re,'$<day>/$<month>/$<year>') // '02/01/2015'

  replace 方法的第二个参数也可以是函数

  1 2 3 4 5 6 7 8 9 10 11 12

  '2015-01-02'.replace(re,( matched, // 整个匹配的结果 2015-01-02 capture1， // 第一个组匹配 2015 capture2，// 第二个组匹配 01 capture3， // 第三个组匹配 02 position， // 匹配开始的位置 0 s，// 原字符串 groups // 具名组构成的一个对象 {year,month,day} ) => { let {day,month,year} = groups; return `${day}/${month/${year}}` })

• 12、正则匹配索引
  在exec（）方法的返回结果上加indices属性，在这个属性上面可以那道匹配开始位置和结束位置。

  1 2 3 4 5 6

  const text = 'zabbcdef'; const re = /eb/; const result = re.exec(text); result.index // 1 result.indices // [[1,3]] 每组开始结束的位置

• 13、 String.prototype.matchAll()
  ES2020 增加了 matchAll方法，可以一次性去除所有匹配。返回的是一个遍历器（Iterator），而不是数组。可以使用for…ofxunhuan取出。相对于返回数组，返回遍历器的好处在于，如果匹配结果是一个很大的数组，那么遍历器比较节省资源。

  1 2 3 4 5 6 7 8 9

  const string = 'test1test2test3'; const regex = /t(e)(st(\d?))/g; for( const match of string.matchAll(regex)){ console.log(match) } // ['test1','e','st1','1',index:0,input:'test1test2test3'] // ['test2','e','st2','1',index:5,input:'test1test2test3'] // ['test3','e','st3','1',index:10,input:'test1test2test3']

  • 遍历器转为数组的方式非常简单，使用…运算符和Array.from（）方法就可以了

    1 2	[...string.matchAll(regex)] Array.from(string.matchAll(regex))

5、Number的方法和扩展

• 1、 二进制八进制表示法
  二进制前缀0b(或0B)
  八进制前缀0o(或0O)

  1 2	0b11110111 === 503 // true 0o767 === 503 // true

• 二进制和八进制转换十进制使用Number*

  1 2	Number('0b111') // 7 Number('0o10') // 8

• 2、Number.isFinite(),Number.isNaN()
  Number.isFinite()用来检查数值是否为有限的（finite），即不是Infinity。

  1 2 3 4 5

  Number.isFinite(15) // true Number.isFinite(0.8) // true Number.isFinite(NaN) // false Number.isFinite(Infinity) // false Number.isFinite('foo') // false 参数不是数值，一律返回false

  Number.isNaN() 用来检查一个值是否为NaN

  1 2 3 4 5 6 7 8

  Number.isNaN(NaN) // true Number.isNaN(15) // false Number.isNaN('15') // false 参数类型不是NaN 一律返回false ``` * 3、Number.parseInt()、Number.paresFloat() Es6将全局方法parseInt和paresFloat，移植到Number对象上面，行为完全保持不变 * 4、Number.isInteger() `Number.isInteger()` 用来判断一个数值是否为整数

  Number.isInteger(25) // true
  Number.isInteger(25.1) // false
  Number.isInteger(25.0) // true
  Number.isInteger(‘15’) // false 参数不是数值 返回false
  Number.isInteger(25.0) // true

  1 2 3 4 5 6 7 8

  * 5、number.EPSILON es6在Number对象上面，新增一个极小的常量Number.EPSILON。根据规定它表示1与大于1的最小浮点数之间的差。 * 6、安全整数和Number.isSafeInteger() javaScript能够准确表示整数范围在-2^53到2^53之间（不含两个端点）， 超过这个范围，无法精确表示这个值。 `Number.isSafeInteger()`则是用来判断一个整数是否落在这个范围之内 * 7、Math对象的扩展 * 8、指数运算符 ES2016 新增落一个指数运算符（**）。

  2 ** 2 // 4
  2 ** 3 // 8

  1	这个运算符的一个特点是右结右，多个指数运算符连用时，是从最右边开始计算的

  // 相当于 2 ** （3 ** 2）
  2 ** 3 ** 2
  // 512

  1	指数运算符可以与等号结合，形成一个新的运算符（**=）

  let a = 1.5
  a *= 2
  // 等同于 a = a * a;
  let b = 4;
  b *= 3;
  // 等同于 b = b * b * b;
  ```

• 10、BigInt对象