(一)ECMAScript 6 简介
1、Babel转码器:用于将ES6代码转换为ES5代码,实现兼容。
(二)let和const命令
1、let的基本用法
(1)let声明的变量只在代码块内有效,在代码块外调用:Uncaught ReferenceError: a is not defined。
经典面试题:for循环里面的i用var定义和let定义有什么区别?
var定义的是全局变量,let定义的变量每次循环都会重新声明,JS内部引擎会记住上一轮循环的值用于给本轮重新声明的循环赋值。
特别注意:设置循环变量的部分是父作用域,循环体内部是单独的子作用域(通过i可以重新赋值证明)。
(2)let不存在变量提升(声明变量必须在声明后使用)
暂时性死区:在代码块内,使用let命令声明变量之前,该变量都是不可用的。块作用域开始到变量声明前的区域,对该变量来说就是暂时性死区。
typeof会报错,但是在之前,没有定义和定义了没有赋值的变量都返回undefined。
(3)let不允许重复声明
既不允许在let后面用let重复声明,也不允许在let后面用var重复声明。(本质是变量名不能重复)
不允许let和函数签名重名。
2、块级作用域(不写{}就认为没有块级作用域)
在块级作用域里声明函数,ES6中类似于let的定义。
但是ES6浏览器规定:允许在块级作用域内声明函数;函数声明类似于var,即会提升到全局作用域或函数作用域的头部;同时,函数声明还会提升到所在的块级作用域的头部。
所以应尽量避免在块级作用域里声明函数,必须要声明的时候用函数表达式。
3、const
const的值不能改变,否则会报错:Uncaught TypeError: Assignment to constant variable.
const声明必须马上赋值,否则会报错:Uncaught SyntaxError: Missing initializer in const declaration.
特别说明:
基本数据类型变量存储的是值的内存地址,引用数据类型变量存的是地址的指针,const只能保证指针是固定的,但是可以给对象添加属性等,如果真的想完全不变应该使用Object.freeze方法冻结(对象和对象属性都要冻结)。
4、ES6声明变量的六种方法:var、function、let、const、import、class。
5、顶层对象的属性
顶层对象,在浏览器环境指的是window对象,在Node指的是global对象。
ES5中,顶层对象的属性与全局变量是等价的。
ES6中,var和function声明的全局变量依旧是顶层对象的属性,let、const、class声明的全局变量不属于顶层对象的属性。
ES2020引入globalThis作为顶层对象。
(三)解构赋值
解构:ES6允许按照一定模式,从数组和对象中提取值,对变量进行赋值。
(四)字符串的扩展
1、字符串的遍历器接口
字符串可以用for...of循环遍历,可以识别大于0xFFFF的码点。
2、模板字符串
增强版的字符串,用\`\`进行标识。
可以当作普通字符串。
可以定义多行字符串:空格和缩进会保留,但可以用\`\`.trim()方法消除。
可以在字符串里嵌入变量${}:{}里面执行的是JS代码,因此如果变量没有声明会报错,也可以用来调用函数(如果{}中不是字符串则转化为字符串,如果是对象则调用toString方法)。
可以嵌套。
3、标签模板
标签模板指的是,模板字符串紧跟在一个函数名后面,该函数将被调用来处理这个模板字符串。
应用:过滤HTML字符串,防止用户输入恶意内容;多语言转换(国际化处理);嵌入其它语言。
(五)字符串的新增方法
1、实例方法:includes(string s,[number n])、startsWith(string s,[number n])、endsWith(string s,[number n])
都是返回布尔值,都可以携带两个参数,但是includes()和startsWith()的第二个参数n表示从第n个位置直到字符串结束,endsWith()的第二个参数n表示针对前n个字符。
2、实例方法:repeat(number n)
返回一个新字符串,表示将原字符串重复n次。n如果是小数则取整,如果是负数或者无穷则报错,如果-1<n<0会当作0计算,如果是NaN也当作0,如果是字符串先转换成数字。
3、实例方法:padStart(number n,string s)、padEnd(number n,string s)
头部或者尾部用s补全到长度n,如果省略了第二个参数则用空格补全。
用途:为数值补全指定位数;提示字符串格式。
4、实例方法:trimStart()、trimEnd()
消除字符串的头部空格和尾部空格及换行等不可见空白符,返回新字符串。
5、实例方法:replaceAll(searchValue, replacement)
replace()只能替换一个字符,replaceAll()能替换多个字符,返回新字符串。
searchValue可以是字符串,也可以是正则表达式,如果是正则表达式则需要加g修饰符。
replacement可以是字符串,也可以是函数,函数返回值替换掉searchValue。
(六)正则的扩展
(七)数值的扩展
1、二进制和八进制表示法
二进制:0b、0B;八进制:0o、0O。
转换成十进制需要Number(number)。
2、数值分隔符
在数字里面,仅为了书写便利,字符串转数字的时候不被识别。
3、Number.isFinite()、Number.isNaN()
Number.isFinite()用来检查数字是否有限,无限和非数字都返回false。
Number.isNaN()只有对于NaN才返回true,非NaN一律返回false。
它们与传统的全局方法isFinite()和isNaN()的区别在于,传统方法先调用Number()将非数值的值转为数值,再进行判断,而这两个新方法只对数值有效。
4、Number.parseInt()、Number.parseFloat()
ES6将全局方法parseInt()和parseFloat(),移植到Number对象上面,行为完全保持不变。
5、Number.isInteger()
用来判断一个数值是否为整数,25.0同样视为整数。
但是小数位数过多或者值太小的时候,可能会出现误判,所以对精度要求高的时候不建议使用。
6、BigInt数据类型
只用来表示整数,没有位数限制,必须添加后缀n,不能与其它类型混合使用,typeof返回bigint。
BigInt()必须有参数,参数必须能转换成整数。