Quelles sont les principales fonctionnalités d'es6

• 如果解构失败，变量的值等于 undefined。
• 对象属性没有次序，但变量必须与属性同名，才能解析到正确的值。
• 对象解构可以指定默认值，默认值生效的条件是对象的属性值严格等于undefined。
• 对象解构时，由于JavaScript引擎会将{}理解成一个代码块，从而发生语法错误，需要将整个解构赋值语句放在圆括号()里面，即可正确执行。

字符串解构赋值

• 字符串也支持解构赋值，此时字符串被转换成了类数组对象。
• 类数组对象都有一个Length属性，因此可以对这个属性解构赋值。

函数参数解构赋值

// 函数参数支持解构赋值
function sum([x, y]) {
    return x + y;
}

// 传入参数时，数组参数解构为x与y
sum([1, 2]);

圆括号使用注意

• 函数参数禁用圆括号。
• 变量声明语句禁用圆括号。
• 赋值语句的模式匹配部分禁用圆括号。
• 只有赋值语句的非模式匹配部分，可以使用圆括号。

4、For…of 循环

• 优点，支持Break，Continue 和 Return关键字， for-of循环用于遍历数据、数组、类数组对象。
• 缺点，没有提供下标，不能修改原数组，只能遍历索引数组，不能遍历 Hash 数组（对象）。

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

Iterator

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

1. 迭代器是一个接口，能快捷的访问数据，通过Symbol.iterator来创建迭代器，通过迭代器的next()方法获取迭代之后的结果。
2. 迭代器是用于遍历数据结构的一个指针（类似于数据库的游标）

5、数值新增方法

Number.isInteger()

• Number.isInteger()，用来判断数值是否为整数。
• 如果参数不是数值返回false。
• JavaScript内部整数和浮点数采用同样的储存方法，所以25和25.0被视为同一个值。
• JavaScript数值存储为64位双精度格式，数值精度最多可以达到53个二进制位(1个隐藏位与52个有效位)，如果数值的精度超过这个限度，第54位及后面的位就会被丢弃，方法失效。

Math.trunc()

• Math.trunc()方法用于去除一个数的小数部分，返回整数部分。
• 对于非数值，Math.trunc()内部使用Number方法将其先转为数值。
• 对于空值和无法截取整数的值，返回NaN。

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

Math.sign()

• Math. sign()方法用来判断一个数到底是正数、负数、还是零。
• 如果参数是非数值，会自动转为数值，对于无法转为数值的值，会返回NaN。
• 它会返回五种值，参数为正数返回+1，参数为负数返回-1，参数为0返回0，参数为-0返回-0，其他值返回NaN。

6、字符串新增方法

模板字符串

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

模板字符串（template string）是增强版的字符串，用反引号标识，可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

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

includes()、startsWith()、endsWith()

• includes()，返回布尔值，表示是否找到了参数字符串。
• startsWith()，返回布尔值，表示参数字符串是否在原字符串的头部。
• endsWith()，返回布尔值，表示参数字符串是否在原字符串的尾部。
  -【注】这三个方法都支持第二个参数，表示开始搜索的位置。

padStart()、padEnd()

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

• padstart() 和 padEnd() 共接受两个参数，第一个参数是字符串补全生效的最大长度第二个参数是用来补全的字符串，如果省略第二个参数，默认使用空格补全长度。
• 如果原字符串的长度等于或大于最大长度，则字符串补全不生效，返回原字符串。
• 如果用来补全的字符串与原字符串两者的长度之和超过了最大长度，则会截去超出位数的补全字符串。
• padstart()的常见用途是为数值补全指定位数，也可以用于提示字符串格式。

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

trimStart()、trimEnd()

trimStart()消除字符串头部的空格，trimEnd()消除字符串尾部的空格，它们返回的都是新字符串，不会修改原始字符串，两个方法对字符串头部（尾部）的tab键、换行符等不可见的空白符号也有效。

repeat()

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

replaceAll()

ES2021引入了replaceAll()方法，可以一次性替换所有匹配，它的用法与 replace()相同，返回一个新字符串，不会改变原字符串。

7、对象新增方法

• 在ES6中，可以直接在对象中写入变量，key相当于变量名，value相当于变量值，并且可以直接省略value，通过key表示一个对象的完整属性。
• 除了属性可以简写，函数也可以简写，即省略掉关键字function。

Object.is()

它用来比较两个值是否严格相等，与严格比较运算符(===) 的行为基本- -致。

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

Object.assign()

• object. assign()方法用于对象的合并,将源对象(source) 的所有可枚举属性,复制到目标对象(target) 。
• obiect. assign()方法的第一个参数是目标对象.后面的参数都是源对象。注意，如果目标对象与源对象有，同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。

8、数组新增方法

Array.from()

• Array.from()用于将类数组对象和可遍历对象（包括Set和Map）转为真正的数组。
• Array.from()方法还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

Array.of()

• Array.of()用于将一组值转换为数组。
• Array. of()返回参数值组成的数组，如果没有参数就返回一个空数组。
• 此方法可以弥补数组构造函数Array()因为参数个数的不同的差异。
• Array.of()基本上可以替代Array()或new Array()，它不存在由于参数不同而导致的重载。

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

数组实例的fill()

• fill()方法使用给定值，填充一个数组。
• 用于空数组的初始化非常方便。数组中已有的元素，会被全部抹去。
• 方法支持第二个和第三个参数，用于指定填充的起始位置和结束位置。
• 如果填充的类型为对象，那被赋值的是同一个内存地址的对象，而不是深拷贝对象。

数组实例的find()

• 用于找出第一个符合条件的数组成员，如果没有找到返回undefined。

findIndex()

• 用于找出第一个符合条件的数组成员的位置，如果没有找到返回-1。

includes()

• 表示某个数组是否包含给定的值，返回布尔值。

9、Let & Const

ES6中，除了全局和局部作用域，新增了块级作用域。

Let

• 语法：let 变量名 = 变量值;
• let禁止在相同作用域内重复声明同一个变量，所以不能在函数内部重新声明参数。
• let声明的变量只在 let 命令所在的代码块内有效，带有{块级作用域}，不会导致声明提升，可以记录触发鼠标事件元素的下标。

Const

• 语法：const 常量名 = 常量值;
• 常量不占内存空间，常量名一般使用纯大写。
• const声明变量必须立即初始化，不能留到以后赋值。
• const声明的常量只在所在的块级作用域内有效，带有{块级作用域}，不会导致声明提升，同样存在暂时性死区，且同一常量禁止重复声明，常量值无法改变。
• const声明的变量，可以保证变量的内存地址不变，对于简单类型的数据来说相当于常量，对于引用类型的数据只能保证其内存地址中指向实际数据的指针不变，而无法保证数据结构不变，将对象声明为常量需要特别注意！

暂时性死区

暂时性死区（TDZ）一种语法规则，只要块级作用域内存在 let 或 const 命令，内部声明的变量就会"绑定"这个区域，形成封闭作用域，即代码块内的变量必须先声明再使用。

10、模块化开发

• 用于分工合作，每一个js都是一个模块，每个工程师都可以单独开发自己的模块，主模块最后引入调用
• 1、子模块要公开暴露
  export var obj={};
  2、主模块引入并且使用
  import {obj as 别名} from “./文件路径”
  3、HTML页面引入时需要将type更换为module
  
• ES6模块功能主要有两个命令构成，export和import，export用于规定独立的对外接口，import用于输入其他模块提供的功能，一个模块就是一个独立的文件，引入模块的script标签的type要设置为module。

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

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

扩展运算符

• 扩展运算符用3个点表示...。
• 作用：将数组或类数组对象转换为用逗号分隔的值序列，基本用法是拆解数组和字符串。

// 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运算符（剩余参数）

• Rest运算符使用3个点表示...。
• 作用：与扩展运算符相反，用于将以逗号分隔的值序列转换成数组。
• 使用rest运算符进行解构时，res运算符对应的变量必须放在最后一位，否则变量无法识别读取多少个数值，就会抛出错误。
• 函数的参数是一个使用逗号分隔的值序列，可以使用rest运算符转换成数组以代替arguments的使用。

// 1.Rest运算符与解构组合使用拆分数组
let arr = [1, 2, 3, 4, 5];
// 将数组拆分，第一个元素赋值到arr1，其余元素赋值到arr2
let [arr1, ...arr2] = arr;
// 将数组拆分，前两个元素赋值到arr1与arr2，其余元素赋值到arr3
let [arr1, arr2, ...arr3] = arr;

// 2.Rest运算符代替arguments
function sum(...arg) {
    // 获取形参数组
    console.log(arg);
}
// 传入形参
sum(形参1, 形参2, ...);

区分两种运算符

• L'opérateur spread et l'opérateur rest sont les opérations inverses l'un de l'autre, l'opérateur spread consiste à diviser le tableau en séquences indépendantes , et opérateur de repos fusionne les séquences indépendantes dans un tableau. 扩展运算符和rest运算符互为逆运算，扩展运算符是将数组分割成独立的序列，而rest运算符是将独立的序列合并成一个数组。
• 当三个点出现在函数形参上或赋值等号左侧，则为rest运算符。
• 当三个点出现在函数实参上或赋值等号右侧，则为扩展运算符。

拓展 | Let、Var、Const区别

• Let声明的变量，存在块级作用域，不存在变量提升，值可更改。
• Var声明的变量，存在函数作用域，存在变量提升，值可更改。
• Const声明的常量，存在块级作用域，值不可更改
Lorsque trois points apparaissent sur les paramètres de fonction ou sur le côté gauche du signe égal d'affectation, il s'agit d'un opérateur de repos.

Lorsque trois points apparaissent sur les paramètres de fonction ou sur le côté droit du signe égal d'affectation, il s'agit d'un opérateur étendu.

• Extension | Différences entre Let, Var et Const

Variable déclarée par Var a une portée de fonction, une promotion de variable existe et la valeur peut être modifiée .

• Extension | ES6 cinq méthodes pour parcourir les propriétés de l'objet

for…in

• for…in est utilisée pour parcourir l'objet et ses propriétés énumérables propres et héritées (à l'exclusion des propriétés des symboles). La fonction

Object.keys(obj)

• Object.keys() renvoie un tableau contenant toutes les propriétés énumérables de l'objet lui-même, à l'exclusion des propriétés héritées et des propriétés de symbole. La fonction

Reflect.ownKeys(obj)

• Reflect.ownKeys(obj) renvoie un tableau, qui peut contenir des propriétés énumérées, des propriétés non énumérables et des propriétés de symbole, et n'inclut pas les propriétés héritées. La fonction

Object.getOwnPropertyNames(obj)

Object.getOwnPropertyNames(obj) renvoie un tableau contenant les propriétés énumérables et non énumérables de l'objet lui-même, à l'exclusion des propriétés héritées et des propriétés de symbole. La fonction

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!