ES6
1.什么是es6？
es的全称是ecmascript，es6就是es2016之后的一个泛称，是由ecma国际标准化组织制定的一项脚本语言的标准化规范。
2.es6新增语法
1. let
es6中新增的用于声明变量的关键字
特点：
1.let声明的变量具有块级作用域的特点，只在所处的块级作用域有效
if(true) {
let a = 10;
}
console.log(a); // a is not defined
2.不存在变量提升
console.log(a)； //a is not defined
let a = 10；
3.暂时性死区
利用let声明的变量会绑定在当前作用域，哪怕当前作用域外有相同变量名，也不会受影响。
2.const
声明常量，常量就是值(内存地址)不能变化的量。
特点：
1.具有块级作用域的特点
if(true) {
const a = 10;
}
console.log(a); // a is not defined
2. 声明常量时必须赋值
const p; //missing initializer in const declaration
不赋值则会报错
3. 常量赋值后，值不能修改
1 const p = 3; 2 p = 100; //assignment to constant variable. 3 4 5 const arr = [10,20]; 6 7 arr[0] = 'a'; 8 9 arr[1] = 'b'; 10 11 console.log(arr); //["a","b"]; 12 13 //直接给数组重新赋值则会报错 14 arr = ["a","b"] //assignment to constant variable.
常量不能重新进行赋值，如果是基本数据类型，不能更改值，如果是复杂数据类型，不能更改地址值。
3.解构赋值
在es6中允许从数组中提取值，按照对应位置，对变量赋值，对象也可以实现解构
1.数组解构
let[a,b,c] = [1,2,3];
console.log(a,b,c); //输出结果 1 2 3
如果解构不成功，变量的值是undefined
2.对象解构
let person = {name:'书记',age:22};
let{name, age} = person;
console.log(name,age) // 输出结果 '书记' 22
let {name: myname, age: myage} = person; // myname myage 属于别名
console.log(myname); // 'zhangsan'
console.log(myage); // 20
小结：
解构赋值就是把数据结构分解，然后给变量进行赋值
如果解构不成功，变量跟数值个数不匹配的时候，变量的值为undefined
数组解构用中括号包裹，多个变量用逗号隔开，对象解构用花括号包裹，多个变量用逗号隔开
利用解构赋值能够让我们方便的去取对象中的属性和方法
4.箭头函数
es6新增的定义函数的方式
() => {} //()代表函数，=>必须要给的符号，指向那一块代码 {}函数体
const fn() => {} //代表把一个函数赋值给fn
特点：
1.如果函数体只有一句代码，且代码的执行结果就是返回值，可以省略大括号
function fn(n1,n2){
return n1 + n2;
}
//es6箭头函数写法
const fn = (n1,n2)=>n1 +n2;
2.如果形参只有一个，可以省略小括号
function fn(num){
return num;
}
//es6箭头函数写法
const fn = num => num;
3. 箭头函数不绑定this，箭头函数中的this指向的是函数定义位置的上下文this
5.剩余函数
在不知道有多少个参数的时候使用，允许我们将一个不定数量的参数表示为一个数组，不定参数定义方式，这种方式很方便的去声明一个不知道参数情况下的一个函数
function sum (first,...args){
console.log(first); // 10
console.log(args); // [20,30]
}
sum(10,20,30);
剩余参数和解构配合使用
let uname = ['andy','tony','tommy']; let [s1,...s2] = uname; console.log(s1); //'andy' console.log(s2); //['tony','tommy']
3.es6内置对象扩展
array的扩展方法
1.扩展运算符：可以将数组或对象转为用逗号隔开的参数序列
let arr = [1,2,3]; ...arr; console.log(...arr); //1 2 3 console.log(1,2,3) //1 2 3
可以用于合并数组，也可以将伪数组或可遍历对象转换为真正的数组
// 合并数组
// 方法一
let ary1 = [1, 2, 3];
let ary2 = [3, 4, 5];
let ary3 = [...ary1, ...ary2];
console.log(ary3); //[1,2,3,3,4,5]
//方法二
ary1.push(...ary2);
console.log(ary1) //[1,2,3,3,4,5]
// 转为真的数组
var divs = document.queryselectorall('div');
divs = [...divs];
console.log(divs)；
构造函数方法 array.from()
将伪数组或可遍历对象转换为真正的数组
let obj = {
'0': "a",
'1': "b",
'2': "c",
length : 3
};
let arr = array.form(obj);
console.log(arr); //["a","b","c"]
方法还可以接受第二个参数，作用类似于数组的map方法，用来对每个元素进行处理，将处理后的值放入返回的数组
let arraylike = {
"0": 1,
"1": 2,
"length": 2
}
let newary = array.from(arraylike, item => item *2)
console.log(newary) //[2,4]
// 如果是对象，那么属性需要写对应的索引
find() :用于找出数组里第一个符合条件的元素对象，没有找到则返回undefined
let arr = [{
id: 1,
name : 'andy'
},{
id : 2,
name: 'tom'
}];
let result = arr.find((item, index) => item.id == 2) ////找数组里面符合条件 的值，当数组中元素id等于2的查找出来，注意，只会匹配第一个
findindex()：用于找出数组里第一个符合条件的元素的位置，返回的是符合条件的元素的索引号，如果没有找到返回-1
let arr = [1, 2, 3, 4, 5];
let result = arr.findindex((value,index) => { return value > 4 });
console.log(result); // 4
includes(): 判断某个数组是否包含给定的值，返回布尔值
let arr = [1,2,3,4];
console.log(arr.includes('a')); // false
console.log(arr.includes(2)); // true
string的扩展方法
es6中新增的创建字符串的方式，使用反引号定义
let str = `hello world`;
特点：
1.模板字符串中可以解析变量 （ 用${变量名}包裹变量名 ）
let name = `王书记`;
let sayhello = `你好，我的名字叫${name}`;
console.log(sayhello); // 你好，我的名字叫王书记
2.模板字符串里可以换行
let result = {
name : '张三',
age : 22,
sex : '男'
}
let str = `
<div>${result.name}</div>
<div>${result.age}</div>
<div>${result.sex}</div>
`;
console.log(str);
3. 在模板字符串中可以调用函数
function fn(){
return `我亚索真的很快乐`
};
let str = `${fn()},你相信我`;
console.log(str); //我亚索真的很快乐,你相信我
方法：
startswith()和endswith()方法
startswith() 表示参数字符串是否在原字符串的头部，返回布尔值
endswith() 表示参数字符串是否在原字符串的尾部，返回布尔值
let str1 = `hello world`;
console.log(str1.startswith('h')); // true
console.log(str1.endswith('d')); // true
repeat(n) 方法：表示将字符串重复n次，返回一个新的字符串
let str2 = 'panpan'; let newstr = str2.repeat(3); console.log(newstr); //panpanpanpanpanpan
set数据结构
类似数组，但是成员的值都是唯一的，没有重复的值
set本身是一个构造函数，用来生成 set 数据结构
const s = new set();
set函数可以接收一个数组作为参数，用来初始化
const s = new set([1,2,3,4]); // {1,2,3,4}
方法：
遍历：
set结构的实例和数组一样，也拥有foreach方法，用于对每个成员执行某种操作，没有返回值
语法：s.foreach( (value) => {console.log(value)}) 打印每一个成员值