2022-09-15 03:35:27
ES6（ECMAscript 2015） 解决了无法开发大型应用的语言层面的问题， 也是从这个版本开始不再使用数组作为编号， 而是使用年份
let 和 const 的声明
优先使用
const定义，只在需要修改值的时候使用let，确保代码的可维护性
- 全局作用域：全局定义的常量不再作为属性添加到全局对象
- 暂时性死区：在变量声明前使用会报错
ReferenceError - 重复声明：在同一作用域内不可重复声明同名变量
- 初始化要求：
const声明的常量必须同时进行初始化 - 块级作用域：变量仅在声明的代码块内有效
Example
const MAX_COUNT = 100
const config = {
theme: 'dark',
language: 'en'
}
模版字符串
除了基本的变量插值， 还支持标签模板（Tagged Templates） 功能
Example
const color = 'red'
const styles = styled`
background: ${color};
color: "red";
`
function styled(parts, ...args) {
console.log(parts) // ['\n background: ', ';\n color: "', '";\n']
console.log(args) // ['red']
/**
* 目前有一个插值, 那么就会把字符串分为两个部分
* 也就是说 parts 的长度是 args 的长度 + 1
*/
let str = ''
for (let i = 0; i < parts.length; i++) {
str += parts[i] // 当前字符串的那部分
if (i < args.length) {
str += args[i] // 拼接对应的参数
}
}
return str
}
数组 API
| 方法 | 描述 | 返回值 |
|---|---|---|
| for...of | 遍历数组和类数组对象的值 | 无返回值 |
| forEach | 执行回调函数 | 无返回值 |
| map | 映射数组元素 | 新数组 |
| filter | 过滤数组元素 | 符合条件的新数组 |
| find | 查找满足条件的第一个元素 | 元素或 undefined |
| some | 检查是否至少有一个元素满足条件 | 布尔值 |
| every | 检查是否所有元素都满足条件 | 布尔值 |
| reduce | 将数组归约为单个值 | 累积结果 |
对象 API
- 扩展运算法
- 解构赋值
- 属性描述符
const obj = { a: 1, b: 2 }
const newObj = { ...obj }
const { a, b } = obj
Object.defineProperty(obj, 'name', {
value: 'es6',
writable: false, // 是否可以被重新定义
enumerable: true, // 是否可以被遍历，影响 for in
configurable: true // 是否可以被更改
})
箭头函数
限制
- 不能作为构造函数使用（不能被
new） - 没有自己的
this，继承定义上下文的this - 不绑定
arguments对象 - 没有
prototype属性
不适用方法
call、apply、bind无法改变箭头函数的this指向
Class 类
- 剩余参数：
...args static定义静态成员：static method(){}- 通过
extends实现类继承：class Child extends Parent