1， 什么是ES6 ？
ES6实际上是一个泛指，代表ES2015及后续的版本
2， 为什么要使用ES6 ？
新增功能的使用、标准化统一化
3， 块级作用域
在ES6以前只有 全局作用域 和 局部作用域，ES6新增 块级作用域 { }
4， let 新增变量声明的关键字
- let 声明的变量只在所处的块级有效 具有块级作用域
意义：在业务逻辑比较复杂时，防止内层变量覆盖外层变量。在循环时，防止循环变量（i）变成 全局变量，实际上，循环结束后，循环变量就没有存在的必要了。
-
不存在变量提升， 必须先声明后使用
-
变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部
-
JavaScript 只有声明的变量会提升，初始化的（var a = 100;）不会。
-
暂时性死区
-
暂时性死区的本质就是，只要一进入当前作用域，所要使用的变量就已经存在了，但是不可获取，只有等到声明变量的那一行代码出现，才可以获取和使用该变量。
var temp = 100;
if(true){
// 将报错， 一旦用let声明 变量， 变量将与 { } 块级作用域 绑定
console.log(temp);
let temp;
}
-
let 的经典面试题 ， 关键点在于，前面使用的是全局作用域变量，后面i变为2时，前面的i也修改成了i， 而后面使用的是块级作用域变量，一次循环产生一个块级域，一共有2个，每个里面的i 互不干扰，所以输出 0，1；
-
输出的为 2 2
- 输出为 0 1
5，const 关键字
作用： 声明常量， 常量是值（或内存地址）不能变化的量
- ** 具有块级作用域 （同let）**
- 声明常量时必须赋值 （常量一般都是大写字母）
- **常量赋值后，值（内存地址）不可以修改 {**对于复杂类型数据是可以修改的，地址（引用不可修改）}
6， 解构赋值
ES6中允许从数组中提取值，按照对应位置，对变量赋值。 对象也可以实现解构。
-
数组解构 按照一一对应的关系从数组中提取值，然后将值赋给变量
-
对象解构 属性与变量匹配，匹配成功时，将属性值赋值给变量
// 2，对象解构赋值
let obj = {
id : 1,
name:'周杰伦',
age: 40
}
let {number, name, age} = obj;
console.log(number); // 匹配失败 undefined
console.log(name); // 匹配成功 周杰伦
console.log('=================================');
// 可以给变量取别名
let{id:idNumber, name:starName, age: year} = obj ;
console.log(idNumber); // 匹配成功 1
console.log(name); // 匹配成功 周杰伦
console.log(starName); // 匹配成功 周杰伦
7， 箭头函数 新增定义函数的方式
作用： 简化函数定义语法 （）=>{ }
<script type="text/javascript">
let fn = () => {
console.log('这时箭头函数体');
};
fn();
</script>
-
当函数体只有一句话，且代码执行结果就是返回值时，可以不写大括号
let sum = (a,b) => a+ b; console.log(sum(1,2));
-
如果形参只有一个，可以省略小括号。
const opp = flag => !flag ; console.log(opp(true));
-
箭头函数不绑定this关键字， 箭头函数中的this，指向的是 函数定义位置上下文this，
8， 剩余参数
剩余参数语法允许我们将一个不定数量的参数表示为一个数组。
扩展运算符
<script type="text/javascript">
const sum = (...args)=>{
let total = 0;
args.forEach((item)=>{
total += item;
})
return total;
}
console.log(sum(10,20,30));
console.log('===========================');
// 扩展运算符
let arys = [1,2,3];
// ...arys 等于 1,2,3
console.log(...arys); //1 2 3 // 逗号不会被输出，逗号被当做了参数分隔符
</script>
- 扩展运算符用于合并数组
// 合并数组
let ary1 = [1,2,3];
let ary2 = [4,5,6];
// 方法一
let ary3 = [...ary1,...ary2];
// 方法二
let ary4 = ary1.push(...ary2);
console.log(ary3);
console.log(ary4);
- 扩展运算符用于将类数组或可遍历的对象转换成真数组， （伪数组：伪数组表示在结构上与数组相似，有索引index，也有长度length， 我们常见的有俩个，一个是arguments，还有一个是DOM的children属性，获取回来的子节点集合）。
- Array.from( ) 从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例
<script type="text/javascript">
// 扩展运算符用于将类数组或可遍历的对象转换成真数组
let divs = document.querySelectorAll('div');
console.log(divs);
// 方法一： 使用扩展运算符
var realArray = [...divs];
console.log(realArray);
// 方法二： 使用 Array的 方法
var realArray2 = Array.from(divs);
console.log(realArray2);
// Array.from() 方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例
</script>
- arr.find( ) 用于找出第一个符合条件的数组成员，没有找到就返回undefined
// ----------------------------------------------
// find()
const arr = [1,2,0,4,5,6];
// find中写一个函数作为find 查找的判断条件，该函数可以有item，index
// 例：查找arr中 第一个大于 2 的值
var rs = arr.find((item) => item>2);
console.log(rs);
- arr.findIndex( ) 用于查找第一个符合条件的数组成员的索引，
const arr2 = [12 ,34, 33, 45];
let index = arr2.findIndex(item=> item>12 );
console.log(index); // 1
10， String 的扩展方法
-
模板字符串 ， 使用反引号定义 例： let name =
zhangsan -
模板字符串可以解析变量
let name = `zhangsan`;
let outline = `你好，我是 ${name}` ;
console.log(outline); // 你好，我是 zhangsan
- 可以调用函数
function sayHi(){
alert('hi');
}
let hi = `${sayHi()}`;
console.log(hi);
-
startsWith 和 endsWith
-
str.startsWith('123') // 判断字符串 str是否 以 123 开头，返回boolean 值
-
str.endsWith('ing') // 判断字符串str 是否以 ing 结尾，返回boolean 值
-
repeat（）
-
var str = 'xin'.repeat(2) // 'xinxin'
11, Set 数据结构
Set 数据结构类似于 数组， 但是成员 的值是唯一，不重复的。
- 长度用 size 而不用 length
const setdate = new Set([1,2,2,3,4,5,5,5,5]);
console.log(setdate.size); // 5 重复的值将被忽略
-
妙用： 数组去重
-
将数组转换成set 数据结构， set 数据结构再转换成数组
const arr = [1,2,2,3,4,5,5,5,5,9,99,9,88]; const newarr = [...(new Set(arr))]; console.log(newarr); // [1,2,3,4,5,9,99,88] -
实例方法
const s = new Set([]); console.log(s.size); s.add(1).add(3).add(4); // 返回Set本身，所以可以迭代写 s.delete(3); // 返回布尔值 s.has(1); // 返回 布尔值 // s.clear(); // 清空
// 和数组一样也可以使用forEach遍历， 用于对每个成员执行某种操作，没有返回值 s.forEach(value => console.log(value));
