普歌-飞灵团队-ES6总结（一）

一.为什么使用ES6？

1.变量提升特性，增加了程序运行时的不可预测性。
2.语法过于松散，实现相同的功能，不同的人可能会写出不同的代码。

二.内置对象扩展

1.Array的扩展方法
（1）扩展运算符（展开语法）

• 扩展运算符可以将数组或者对象转为用逗号分隔的参数序列

let arr = [1,2,3];
...arr  //1,2,3
console.log(...arr);  //1 2 3
console.log(1,2,3); 

• 扩展运算符可以应用于合并数组。

//方法一
let arr = [1,2,3];
let arr2 = [4,5,6];
let arr3 = [...arr,...arr2];  
//方法二
arr.push(...arr2);

（2）构造函数方法：Array.form()

• 将类数组或可遍历对象转化为真正的数组。

let array = {
     '0' : 'a',
     '1' : 'b',
     '2' : 'c',
     length:3
};
let arr = Array.form(array);  //['a','b','c']

• 方法还可以接受第二个参数作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组。

let array = {
     '0' : 1,
     '1' :2,
     'length':3
};
let newArr = Array.form(array,item = > item * 2);

（3） 实例方法：find()
用于找到第一个符合条件的数组成员。如果没有找到返回undefined。

let arr = [{
     id:1,
     name:'Bob'
     },
     {
     id:2,
     name:'ava'
}];
let target = arr.find((item,index) => item.id == 2);

（4）实例方法：findIndex()
用于找到第一个符合条件的数组成员的位置，如果没有找到返回-1。

let arr = [10,22,5,9];
let index = arr.findIndex((value,index) => value > 9);

（5）实例方法：includes()
表示某个数组是否包含给定的值，返回布尔值。

[1,2,3].includes(2);  //true
[1,2,3].includes(5);  //false

2.String的扩展方法
（1）模板字符串

• 模板字符串中可以解析变量。

 let name = 'LiHua';
 let sayHello = `hello ,my name is ${name}`;  //hello ,my name is LiHua

• 模板字符串可以换行。

let res = {
    name : 'LiHua',
    age : 20,
    sex : '女'
}
let html = `
    <div>
       <span>${res.name}</span>   
       <span>${res.age}</span>
       <span>${res.sex}</span>
    </div>
`;

• 在模板字符串中可以调用函数。

const sayHello = function () {
      return 'hello,';   
};
let res = `${sayHello()} world`;
console.log(res);  //hello,world

（2）实例方法：startsWith() 和 endsWith()
startsWith()：表示参数字符串是否在原字符串的头部，返回布尔值。
endsWith()：表示参数字符串是否在原字符串的尾部，返回布尔值。

let str = 'hello world!';
str.startsWith('hello');  //true
str.endsWith('world');  //false

（3）实例方法：repeat()
repeat方法表示将原字符串重复n次，返回一个新字符串。

'X'.repeat(3);  //XXX
'Hi'.repeat(2);  //HiHi

3.Set数据结构
ES6提供了新的数据结构Set，它类似于数组，但是成员的值都是唯一的，没有重复的值。

• Set本身是一个构造函数，用来生成Set数据结构。

const s = new Set();

• Set函数可以接受一个数组作为参数，用来初始化。

const set = new Set([1,2,3,4]);

（1）实例方法

• add(value)：添加某个值返回Set结构本身。
• delete(value)：删除某个值，返回一个布尔值，表示删除是否成功。
• has(value)：返回一个布尔值，表示该值是否为Set的成员。
• clear()：清除所有成员，没有返回值。

const s = new Set();
s.add(1).add(2).add(3);  //向Set结构中添加值。
s.delete(2);  //删除Set结构中的2值。
s.has(1);  //表示Set结构中是否有1这个值，返回布尔值。
s.clear();  //清除Set结构中的所有值。

（2）遍历
Set结构的实力与数组一样，也拥有forEach()方法，用于对每个成员执行某种操作，没有返回值。

s.forEach(value => console.log(value));

———————————————————————————————————————
作者：wx_mz
出处/源自：wx_mz的《普歌-飞灵团队-ES6总结（一）》
本文版权归作者和CSDN共有，欢迎转载，且在文章页面明显位置给出原文链接，未经作者同意必须保留此段声明，否则保留追究法律责任的权利。