es6学习

记录一些es6 新增的语法，使用技巧等

1、解构

//数组的解构赋值
var [a,b,c] = [1,2,3];
//对象的解构
var {bar, foo} = {foo: "aaa", bar: "bbb"};
foo   //"aaa"
bar   //"bbb"
var {firstName: name, lastName}={firstName: "John", lastName: "Doe"}
name  //John
lastName   //Doe
firstName   //firstName is not defined
// 可以设置默认值，默认值只对undefined 起作用
var {firstName = "John", lastName = "Doe"} = {firstName: undefined, lastName: null};
firstName   //John
lastName    //null     -----只对undefined起作用

2、扩展运算符和rest运算符

// -----扩展运算符--------
var foo = function(a, b, c) {
	console.log(a);
	console.log(b);
	console.log(c);
}
var arr = [1, 2, 3];
foo(...arr);
//输出
1
2
3
// 字符串转数组
var str = 'love';
var arr5 = [...str];
console.log(arr5);   //["l", "o", "v", "e"]
// 比较最大值
var arr=[25,3,62,21,45,18];
 var a=Math.max(...arr);    //62
// ------rest运算符---------
// rest运算符也是三个点号，不过其功能与扩展运算符恰好相反，把逗号隔开的值序列组合成一个数组
var bar = function(...args) {
	    for (let el of args) {
	        console.log(el);
	    }
	}
bar(1, 2, 3, 4);  
// 输出
1
2
3
4

3、字符串扩展

除了indexOf(),新增了三个方法，确定一个字符串是否包含在另一个字符串里

includes()：返回布尔值，表示是否找到了参数字符串.

startsWith()：返回布尔值，表示参数字符串是否在源字符串的头部.

endsWith()：返回布尔值，表示参数字符串是否在源字符串的尾部.

其他方法

repeat()返回一个新字符串，表示将原字符串重复n次。

"x".repeat(3) // "xxx"
"hello".repeat(2) // "hellohello"

新增了 字符串模板 和 多行字符串

4、模块

模块功能主要由两个命令构成：export和import。

module命令可以取代import语句，达到整体输入模块的作用。

为加载模块指定默认输出，使用export default命令。

5、数组的扩展

Array.from方法用于将两类对象转为真正的数组：类似数组的对象（array-like object）和可遍历（iterable）的对象（包括ES6新增的数据结构Set和Map）。

let list = document.querySelectorAll('ul.fancy li');
Array.from(list).forEach(function (li) {
  document.write(li);
});

Array.of方法用于将一组值，转换为数组。

find() 用于找出第一个符合条件的数组成员。

1 2	let array = [1, 4, -5, 10].find((n) => n < 0); document.write("array:", array); //-5

findIndex() 用法与find方法非常类似，返回第一个符合条件的数组成员的位置，如果所有成员都不符合条件，则返回-1。

let index = [1, 5, 10, 15].findIndex(function(value, index, arr) {
  return value > 9;
})
document.write(index);  // 2

fill()使用给定值，填充一个数组。

let arr = ['a', 'b', 'c'].fill(7)
document.write(arr);  // [7, 7, 7]
//指定位置
let newArr = ['a', 'b', 'c'].fill(7, 1, 2)
document.write(newArr);   // ['a', 7, 'c']

遍历方法：entries()、 keys()、 values()。

for (let index of ['a', 'b'].keys()) {
  document.write(index);
}
// 0
// 1
for (let elem of ['a', 'b'].values()) {
  document.write(elem);
}
// 'a'
// 'b'
for (let [index, elem] of ['a', 'b'].entries()) {
  document.write(index, elem);
}
// 0 "a"
// 1 "b"

6、对象的扩展

Object.is()方法。用于比较两个值是否严格相等，相对于运算符===有两个不同：一是+0不等于-0，二是NaN等于自身。

Object.assign方法用来将源对象（source）的所有可枚举属性，复制到目标对象（target）。它至少需要两个对象作为参数，第一个参数是目标对象，后面的参数都是源对象。只要有一个参数不是对象，就会抛出TypeError错误。

7、Class 类

//定义类
class Point {
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}

constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。

prototype对象的constructor属性，直接指向“类”的本身.

Point.prototype.constructor === Point // true

类的内部所有定义的方法，都是不可枚举的（non-enumerable）。

Object.keys(Point.prototype)
// []
Object.getOwnPropertyNames(Point.prototype)
// ["constructor","toString"]

Class类的继承

class ColorPoint extends Point {
 constructor(x, y, color) {
	 super(x, y); // 调用父类的constructor(x, y)
	 this.color = color;
 }
 toString() {
	 return this.color + ' ' + super.toString(); // 调用父类的toString()
 }
}

子类必须在constructor方法中调用super方法，否则新建实例时会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用super方法，子类就得不到this对象。

8、Math和Number对象的扩展

Math.trunc(n) 去除一个数的小数部分
Math.sign(b) 判断一个数是正数、负数还是0.
Math.acosh(x) 返回x的反双曲余弦（inverse hyperbolic cosine）
Math.asinh(x) 返回x的反双曲正弦（inverse hyperbolic sine）
Math.atanh(x) 返回x的反双曲正切（inverse hyperbolic tangent）
Math.cbrt(x) 返回x的立方根
Math.clz32(x) 返回x的32位二进制整数表示形式的前导0的个数
Math.cosh(x) 返回x的双曲余弦（hyperbolic cosine）
Math.expm1(x) 返回eˆx - 1
Math.fround(x) 返回x的单精度浮点数形式
Math.hypot(...values) 返回所有参数的平方和的平方根
Math.imul(x, y) 返回两个参数以32位整数形式相乘的结果
Math.log1p(x) 返回1 + x的自然对数
Math.log10(x) 返回以10为底的x的对数
Math.log2(x) 返回以2为底的x的对数
Math.tanh(x) 返回x的双曲正切（hyperbolic tangent)

将全局对象isFinite(),isNaN(),parseInt(), parseFloat()移至Number上，分别变为
Number.isFinite(),Number.isNaN(),Number.parseInt(), Number.parseFloat()。