什么是ES6_es6 << 是什么意思

什么是ES6

ES6， 全称 ECMAScript 6.0 ，是 JavaScript 的下一个版本标准，2015.06 发版。
ES6 主要是为了解决 ES5 的先天不足，比如 JavaScript 里并没有类的概念，

Let、const和var的区别

ES6新增了let和const来声明变量，主要是解决var声明变量所造成的困扰和问题：

• var不能用于定义常量
• var可以重复声明变量
• var存在变量提升
• var不支持块级作用域

let和const解决了以上问题如下：

• 不可以重复声明变量

let site = 'itLike';
let site = 'itLike';
console.log(site);
1
2
3

• 不存在变量提升

console.log(site);

let site = 'itLike';
1
2
3

• 可以定义常量

const E = 2.718;

E = 2.71;

console.log(E);

//  引用类型
const LK = {

   name:'itLike',

   intro: '喜欢IT, 就上撩课(itLike.com)'

};

LK.name = '撩课';
console.log(LK);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

• 块级作用域
  如果用var定义变量，变量是通过函数或者闭包拥有作用域；但，现在用let定义变量，不仅仅可以通过函数/闭包隔离，还可以通过块级作用域隔离。
  块级作用域用一组大括号定义一个块，使用 let 定义的变量在大括号的外部是访问不到的，此外，let声明的变量不会污染全局作用域。

{let site = 'itLike';}

console.log(site);

if(1){  let str = '04'; }

console.log(str);
1
2
3
4
5
6
7

解构赋值

解构赋值是对赋值运算符的扩展。
他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。
在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。

• 构的源，解构赋值表达式的右边部分。
• 解构的目标，解构赋值表达式的左边部分。

变量解构赋值（数组解构）

let nameArr = ['撩课', '小撩', '小煤球'];

let name1 = nameArr[0];

let name2 = nameArr[1];

let name3 = nameArr[2];

//  解构写法

let [name1, name2, name3] = nameArr;

console.log(name1, name2, name3);
1
2
3
4
5
6
7
8
9
10
11
12
13

变量解构赋值（对象解构）

//  写法1

let {name, age, sex}

 = {name: '小煤球', age: 1, sex: '公'};

// 结果: 小煤球 1 公

console.log(name, age, sex);

//  写法2： 解构重命名

let {name: lkName, age: lkAge, sex: lkSex}

= {name: '小煤球', age: 1, sex: '公'};

// 结果: 小煤球 1 公

console.log(lkName, lkAge, lkSex);  

//  写法3： 可以设置默认值

let {name, age, sex = '公'}

= {name: '小煤球', age: 1};

console.log(sex);  // 公


//  写法4：省略解构

let [, , sex] = ['小煤球', 1, '公 '];

console.log(sex);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

字符串、正则、数值、函数、数组、对象的扩展，箭头函数和普通函数区别

模板字符串

模板字符串用反引号()包含，变量用${}括起来; 在开发中使用是非常灵活的。

 let name = '小煤球';
 let sex = '公';
 let result = `我叫 ${name} , 我是 ${sex} 的`;
 console.log(result);
1
2
3
4

字符串扩展方法

• startsWith()
  判断字符串是否以 XX 开头

let url = 'http://www.itlike.com';

console.log(url.startsWith('http'));  // true
1
2
3

• endsWith()
  判断字符串是否以 XX 结尾

let file = 'index.html';

console.log(file.endsWith('html'));  // true
1
2
3

• includes
  判断字符串中是否包含 XX

let str = 'liaoke';

console.log(str.includes('ao')); // true
1
2
3

• repeat()
  拷贝n份

let title = '撩课在线';

console.log(title.repeat(100));
1
2
3

• padStart() / padEnd()

padStart()用于头部补全，
padEnd()用于尾部补全;

第一个参数用来指定字符串的最小长度，

第二个参数是用来补全的字符串。

//  "2030111111"

let y1 = '2030'.padEnd(10, '1');

//   "2030-11-22"

let y2 = '11-22'.padStart(10, '2030-MM-DD');  

console.log(y1, y2);
1
2
3
4
5
6
7
8
9

延展操作符

• 延展数组

let arr1 = [ 'a', 'b', 'c'];
let arr2 = [1, 2, 3];
let result = [...arr1, ...arr2];
console.log(result);
 //  [ "a", "b", "c", 1, 2, 3 ]
1
2
3
4
5

• 延展对象

let smallDog = {name:'小煤球', age: 1};
let bigDog = {name: 'Python', age: 2};
let dog = {...smallDog, ...bigDog};
console.log(dog);  
// {name: "Python", age: 2}
1
2
3
4
5

注意: 如果对象中的属性一致, 会被覆盖

• 开发应用场景

function getMinValue() {
     console.log(Math.min(...arguments));
}
getMinValue(1, -99, 22, 10, 9); // -99
1
2
3
4

数值扩展

• 常量
  Number.EPSILON ,属性表示 1 与大于 1 的最小浮点数之间的差。
  它的值接近于 2.2204460492503130808472633361816E-16，或者 2-52。
  测试数值是否在误差范围内:

0.1 + 0.2 === 0.3; // false
// 在误差范围内即视为相等
var equal = (Math.abs(0.1 - 0.3 + 0.2) < Number.EPSILON); // true
1
2
3

• 最大安全整数
  安全整数：Number.MAX_SAFE_INTEGER
  安全整数表示在 JavaScript 中能够精确表示的整数，安全整数的范围在 2 的 -53 次方到 2 的 53 次方之间（不包括两个端点），超过这个范围的整数无法精确表示。
  最大安全整数
  安全整数范围的上限，即 2 的 53 次方减 1 。

• 最小安全整数
  安全整数范围的下限，即 2 的 53 次方减 1 的负数。
  Number.MIN_SAFE_INTEGER

Number 对象新方法

• Number.isFinite()
  用于检查一个数值是否为有限的（ finite ），即不是 Infinity

console.log( Number.isFinite(1));   // true
console.log( Number.isFinite(0.1)); // true

// NaN 不是有限的
console.log( Number.isFinite(NaN)); // false

console.log( Number.isFinite(Infinity));  // false
console.log( Number.isFinite(-Infinity)); // false

// Number.isFinate 没有隐式的 Number() 类型转换，所有非数值都返回 false
console.log( Number.isFinite('foo')); // false
console.log( Number.isFinite('15'));  // false
console.log( Number.isFinite(true));  // false
1
2
3
4
5
6
7
8
9
10
11
12
13

• Number.isNaN()
  用于检查一个值是否为 NaN 。

console.log(Number.isNaN(NaN));      // true
console.log(Number.isNaN('true'/0)); // true

// 在全局的 isNaN() 中，以下皆返回 true，因为在判断前会将非数值向数值转换
// 而 Number.isNaN() 不存在隐式的 Number() 类型转换，非 NaN 全部返回 false
Number.isNaN("NaN");      // false
Number.isNaN(undefined);  // false
Number.isNaN({});         // false
Number.isNaN("true");     // false
1
2
3
4
5
6
7
8
9

• 从全局移植到 Number 对象的方法
  逐步减少全局方法，用于全局变量的模块化。
  方法的行为没有发生改变。

Number.parseInt()

用于将给定字符串转化为指定进制的整数。
// 不指定进制时默认为 10 进制
Number.parseInt('12.34'); // 12
Number.parseInt(12.34);   // 12

// 指定进制
Number.parseInt('0011',2); // 3

// 与全局的 parseInt() 函数是同一个函数
Number.parseInt === parseInt; // true
Number.parseFloat()
用于把一个字符串解析成浮点数。
Number.parseFloat('123.45')    // 123.45
Number.parseFloat('123.45abc') // 123.45

// 无法被解析成浮点数，则返回 NaN
Number.parseFloat('abc') // NaN

// 与全局的 parseFloat() 方法是同一个方法
Number.parseFloat === parseFloat // true
Number.isInteger()
用于判断给定的参数是否为整数。
Number.isInteger(value)
Number.isInteger(0); // true
// JavaScript 内部，整数和浮点数采用的是同样的储存方法,因此 1 与 1.0 被视为相同的值
Number.isInteger(1);   // true
Number.isInteger(1.0); // true

Number.isInteger(1.1);     // false
Number.isInteger(Math.PI); // false

// NaN 和正负 Infinity 不是整数
Number.isInteger(NaN);       // false
Number.isInteger(Infinity);  // false
Number.isInteger(-Infinity); // false

Number.isInteger("10");  // false
Number.isInteger(true);  // false
Number.isInteger(false); // false
Number.isInteger([1]);   // false

// 数值的精度超过 53 个二进制位时，由于第 54 位及后面的位被丢弃，会产生误判
Number.isInteger(1.0000000000000001) // true

// 一个数值的绝对值小于 Number.MIN_VALUE（5E-324），即小于 JavaScript 能够分辨
// 的最小值，会被自动转为 0，也会产生误判
Number.isInteger(5E-324); // false
Number.isInteger(5E-325); // true
Number.isSafeInteger()
用于判断数值是否在安全范围内。
Number.isSafeInteger(Number.MIN_SAFE_INTEGER - 1); // false
Number.isSafeInteger(Number.MAX_SAFE_INTEGER + 1); // false
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

Math 对象的扩展

ES6 在 Math 对象上新增了 17 个数学相关的静态方法，这些方法只能在 Math 中调用。

• 普通计算
  Math.cbrt
  用于计算一个数的立方根。

Math.cbrt(1);  // 1
Math.cbrt(0);  // 0
Math.cbrt(-1); // -1
// 会对非数值进行转换
Math.cbrt('1'); // 1

// 非数值且无法转换为数值时返回 NaN
Math.cbrt('hhh'); // NaN
1
2
3
4
5
6
7
8

• Math.imul

两个数以 32 位带符号整数形式相乘的结果，返回的也是一个 32 位的带符号整数。
// 大多数情况下，结果与 a * b 相同
Math.imul(1, 2);   // 2

// 用于正确返回大数乘法结果中的低位数值
Math.imul(0x7fffffff, 0x7fffffff); // 1
1
2
3
4
5
6

• Math.hypot
  用于计算所有参数的平方和的平方根。

Math.hypot(3, 4); // 5

// 非数值会先被转换为数值后进行计算
Math.hypot(1, 2, '3'); // 3.741657386773941
Math.hypot(true);      // 1
Math.hypot(false);     // 0

// 空值会被转换为 0
Math.hypot();   // 0
Math.hypot([]); // 0

// 参数为 Infinity 或 -Infinity 返回 Infinity
Math.hypot(Infinity); // Infinity
Math.hypot(-Infinity); // Infinity

// 参数中存在无法转换为数值的参数时返回 NaN
Math.hypot(NaN);         // NaN
Math.hypot(3, 4, 'foo'); // NaN
Math.hypot({});          // NaN
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

• Math.clz32
  用于返回数字的32 位无符号整数形式的前导0的个数。

Math.clz32(0); // 32
Math.clz32(1); // 31
Math.clz32(0b01000000000100000000000000000000); // 1

// 当参数为小数时，只考虑整数部分
Math.clz32(0.5); // 32

// 对于空值或非数值，会转化为数值再进行计算
Math.clz32('1');       // 31
Math.clz32();          // 32
Math.clz32([]);        // 32
Math.clz32({});        // 32
Math.clz32(NaN);       // 32
Math.clz32(Infinity);  // 32
Math.clz32(-Infinity); // 32
Math.clz32(undefined); // 32
Math.clz32('hhh');     // 32
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

• 数字处理
  Math.trunc

用于返回数字的整数部分。
Math.trunc(12.3); // 12
Math.trunc(12);   // 12

// 整数部分为 0 时也会判断符号
Math.trunc(-0.5); // -0
Math.trunc(0.5);  // 0

// Math.trunc 会将非数值转为数值再进行处理
Math.trunc("12.3"); // 12

// 空值或无法转化为数值时时返回 NaN
Math.trunc();           // NaN
Math.trunc(NaN);        // NaN
Math.trunc("hhh");      // NaN
Math.trunc("123.2hhh"); // NaN
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

Math.fround

用于获取数字的32位单精度浮点数形式。
// 对于 2 的 24 次方取负至 2 的 24 次方之间的整数（不含两个端点），返回结果与参数本身一致
Math.fround(-(2**24)+1);  // -16777215
Math.fround(2 ** 24 - 1); // 16777215

// 用于将 64 位双精度浮点数转为 32 位单精度浮点数
Math.fround(1.234) // 1.125
// 当小数的精度超过 24 个二进制位，会丢失精度
Math.fround(0.3); // 0.30000001192092896
// 参数为 NaN 或 Infinity 时返回本身
Math.fround(NaN)      // NaN
Math.fround(Infinity) // Infinity

// 参数为其他非数值类型时会将参数进行转换
Math.fround('5');  // 5
Math.fround(true); // 1
Math.fround(null); // 0
Math.fround([]);   // 0
Math.fround({});   // NaN
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

判断
Math.sign
判断数字的符号（正、负、0）。

Math.sign(1);  // 1
Math.sign(-1); // -1

// 参数为 0 时，不同符号的返回不同
Math.sign(0);  // 0
Math.sign(-0); // -0

// 判断前会对非数值进行转换
Math.sign('1');  // 1
Math.sign('-1'); // -1  

// 参数为非数值（无法转换为数值）时返回 NaN
Math.sign(NaN);   // NaN
Math.sign('hhh'); // NaN
1
2
3
4
5
6
7
8
9
10
11
12
13
14

对数方法
Math.expm1()
用于计算 e 的 x 次方减 1 的结果，即 Math.exp(x) - 1 。

Math.expm1(1);  // 1.718281828459045
Math.expm1(0);  // 0
Math.expm1(-1); // -0.6321205588285577
// 会对非数值进行转换
Math.expm1('0'); //0

// 参数不为数值且无法转换为数值时返回 NaN
Math.expm1(NaN); // NaN
1
2
3
4
5
6
7
8

Math.log1p(x)
用于计算1 + x 的自然对数，即 Math.log(1 + x) 。

Math.log1p(1);  // 0.6931471805599453
Math.log1p(0);  // 0
Math.log1p(-1); // -Infinity

// 参数小于 -1 时返回 NaN
Math.log1p(-2); // NaN
1
2
3
4
5
6

Math.log10(x)
用于计算以 10 为底的 x 的对数。

Math.log1p(1);  // 0.6931471805599453
Math.log1p(0);  // 0
Math.log1p(-1); // -Infinity

// 参数小于 -1 时返回 NaN
Math.log1p(-2); // NaN

Math.log10(1);   // 0
// 计算前对非数值进行转换
Math.log10('1'); // 0
// 参数为0时返回 -Infinity
Math.log10(0);   // -Infinity
// 参数小于0或参数不为数值（且无法转换为数值）时返回 NaN
Math.log10(-1);  // NaN
Math.log2()
用于计算 2 为底的 x 的对数。
Math.log2(1);   // 0
// 计算前对非数值进行转换
Math.log2('1'); // 0
// 参数为0时返回 -Infinity
Math.log2(0);   // -Infinity
// 参数小于0或参数不为数值（且无法转换为数值）时返回 NaN
Math.log2(-1);  // NaN
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

• 双曲函数方法
  Math.sinh(x): 用于计算双曲正弦。
  Math.cosh(x): 用于计算双曲余弦。
  Math.tanh(x): 用于计算双曲正切。
  Math.asinh(x): 用于计算反双曲正弦。
  Math.acosh(x): 用于计算反双曲余弦。
  Math.atanh(x): 用于计算反双曲正切。

• 指数运算符

1 ** 2; // 1
// 右结合，从右至左计算
2 ** 2 ** 3; // 256
// **=
let exam = 2;
exam ** = 2; // 4
1
2
3
4
5
6

函数扩展

• 默认参数
  基本用法

function fn(name,age=17){
 console.log(name+","+age);
}
fn("Amy",18);  // Amy,18
fn("Amy","");  // Amy,
fn("Amy");     // Amy,17
注意点：使用函数默认参数时，不允许有同名参数。
// 不报错
function fn(name,name){
 console.log(name);
}

// 报错
//SyntaxError: Duplicate parameter name not allowed in this context
function fn(name,name,age=17){
 console.log(name+","+age);
}
只有在未传递参数，或者参数为 undefined 时，才会使用默认参数，null 值被认为是有效的值传递。
function fn(name,age=17){
    console.log(name+","+age);
}
fn("Amy",null); // Amy,null
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

函数参数默认值存在暂时性死区，在函数参数默认值表达式中，还未初始化赋值的参数值无法作为其他参数的默认值。

function f(x,y=x){
    console.log(x,y);
}
f(1);  // 1 1

function f(x=y){
    console.log(x);
}
f();  // ReferenceError: y is not defined
1
2
3
4
5
6
7
8
9

• 不定参数
  不定参数用来表示不确定参数个数，形如，…变量名，由…加上一个具名参数标识符组成。具名参数只能放在参数组的最后，并且有且只有一个不定参数。
  基本用法

function f(...values){
    console.log(values.length);
}
f(1,2);      //2
f(1,2,3,4);  //4
1
2
3
4
5