es6核心特性是什么 - 三好互联网

本教程操作环境：windows7系统、ECMAScript 6版、Dell G3电脑。

ES6核心特性

1、类 Class

ES6正式启用 Class 关键字来创建"类”，再通过实例化"类”来创建“对象”。类抽象了对象的公共部分，通过实例化类可以得到一个具体的对象。

// 1.使用Class关键字创建类class 类名 {    // 自有属性    constructor(形参1, 形参2, ...) {        this.属性名1 = 形参1;        this.属性名2 = 形参2;        ...    }    // 共有属性    init() {        函数体;    }    ...}// 2.利用类结合New关键字实例化对象let Object = new 类名(实参1, 实参2, ...);// 3.在已有类基础上创建子类class 子类 extends 类名 {    // 自有属性（与父类相同）    constructor(形参1, 形参2, 新形参1...) {        //super函数调用父类的constructor        super(形参1, 形参2, ...);        // 子类新增属性需要单独定义        this.新属性1 = 新形参1;        ...    }    // 共有属性（子类函数位于自身父级原型上，优先调用，父类同名函数在更上层原型链上)    init() {        函数体;    }    ...}

2、箭头函数

注意事项

3、解构赋值

数组解构赋值

对象解构赋值

字符串解构赋值

函数参数解构赋值

// 函数参数支持解构赋值function sum([x, y]) {    return x + y;}// 传入参数时，数组参数解构为x与ysum([1, 2]);

圆括号使用注意

4、For…of 循环

for (value of arr) {    执行操作;}

Iterator

一种新的遍历机制，拥有两个核心。

5、数值新增方法

Number.isInteger()

Math.trunc()

// 低版本浏览器兼容语法Math.trunc = Math.trunc || function (x) {    return x < 0 ? Math.ceil(x) : Math.f1oor(x);};

Math.sign()

6、字符串新增方法

模板字符串

模板字符串用于简化字符串拼接，模板字符串支持解析变量、换行、调用函数。

`文本${变量}文本${变量}文本`

includes()、startsWith()、endsWith()

padStart()、padEnd()

ES2017引入了字符串补全长度功能，padstart() 用于头部补全，padEnd() 用于尾部补全。

// 补全长度方法提示字符串格式"12".padStart(10, "YYYY-MM-DD"); // "YYYY-MM-12""08-31".padStart(10, "YYYY-MM-DD"); // "YYYY-08-31"

trimStart()、trimEnd()

repeat()

replaceAll()

7、对象新增方法

Object.is()

console.log(Object.is(+0, -0)); //falseconsole.log(Object.is(NaN, NaN)); //true

Object.assign()

8、数组新增方法

Array.from()

Array.of()

// 兼容版本Arrayof()方法function Arrayof() {    return Array.prototype.slice.call(arguments);}

数组实例的fill()

数组实例的find()

findIndex()

includes()

9、Let & Const

Let

Const

暂时性死区

10、模块化开发

11、扩展运算符 & Rest运算符

ES6中新增了扩展运算符和 Rest运算符，它们可以很好地解决函数参数和数组元素长度未知情况下的编码问题，使得代码能更加健壮简洁。

扩展运算符

// 1.扩展运算符代替apply()函数获取数组最大值let arr = [1, 4, 2, 5, 3];// apply()方法Math.max.apply(null, arr);// 扩展运算符方法Math.max(...arr);// 2.扩展运算符代替concat()函数合并数组let arr1 = [1, 2, 3];let arr2 = [4, 5, 6];// concat()方法arr1.concat(arr2);// 扩展运算符方法[...arr1, ...arr2];

Rest运算符（剩余参数）

// 1.Rest运算符与解构组合使用拆分数组let arr = [1, 2, 3, 4, 5];// 将数组拆分，第一个元素赋值到arr1，其余元素赋值到arr2let [arr1, ...arr2] = arr;// 将数组拆分，前两个元素赋值到arr1与arr2，其余元素赋值到arr3let [arr1, arr2, ...arr3] = arr;// 2.Rest运算符代替argumentsfunction sum(...arg) {    // 获取形参数组    console.log(arg);}// 传入形参sum(形参1, 形参2, ...);

区分两种运算符