1、var 和let 的区别
var ：
1.var 可以重复声明
2.作用域：全局作用域和函数作用域
3.会进行预解析
let ：
1.同一作用域下不能重复声明
2.作用域：全局作用域和块级作用域（块级作用域指{}）
3.不进行预解析
2、块级作用域
在ES6之前作用域只有全局作用域和函数作用域，不存在块级作用域的概念。ES6中新增了块级作用域。块级作用域由{}包括，if语句和for语句里面的{}也属于块级作用域。
3、解构赋值
对象解构赋值
let obj = {
a:1,
b:2
}
let {
a,b}= obj
console.log(a,b);//1 2
前面大括号里的要和对象里的属性名一一对应关系
数组解构赋值
let arr=["a","b","c"];
let [e,f]=arr;
console.log(e,f);//a b
前面的第一项对应数组的第一项，第二项对应数组的第二项，顺序保持一致。
//面试题 怎么快速交换a,b的值
let a = 0;
let b=1;
[a,b]=[b,a]
4、展开运算符
数组展开运算符
let arr=[1,2,3,4];
let arr2=["a","b",...arr,"c","d"];
console.log(arr2);//["a","b",1,2,3,4,"c","d"]
对象展开运算符
let obj ={
a:1,
b:2
}
let obj2={
...obj,
c:3,
d:4
};
console.log(obj2);//{a:1,b:2,c:3,d:4}
剩余参数
var arr=[1,2,3,4]
let [a,b,...c]=arr;
console.log(a,b,c);//1 2 [3,4] //前面的两个数据赋值给a,b 剩下的放在c里面
5、Set对象
Set 需要注意的是：
- Set 是ES6提供的一种新的数据结构，类似于数组，但是成员的值都是唯一的，没有重复的值。
- Set本身是一个构造函数，用来实例化生成Set数据结构。
- Set对象允许你存储任何类型的唯一值，无论是原始值还是对象引用
Set 的属性和方法
1、size 属性相当于length属性
var arr = [2,4,7,1,3,2,8,6];
let s = new Set(arr);
console.log(s.size);//7
2、clear()清空所有值
var arr = [2,4,7,1,3,2,8,6];
let s = new Set(arr);
s.clear();
console.log(s);
3、delete() 删除某一项
s.delete("a")
4、add()添加某个值
s.add(5)
5、has()查看是否包含某个值
s.has("a");
6、map对象
Map 需要注意的是：
Map是ES6提供的一种新的数据结构，类似与对象。
let arr =[
["a",1],
["b",2],
["c",3]
]
let m = new Map(arr);
console.log(m);
Map 的属性和方法
1、clear();清空所有的值
m.clear()
2、delete(key) 删除某一项
3、get(key) 获取某一项值
4、has(key) 是否包含某一项值
5、set(key,val) 设置一个值
7、函数新增内容
1.箭头函数的基本语法
箭头函数最基本的写法： 形参=>返回值
let fn= nub => nub*2;
console.log(fn(10));//20
多个形参要加括号： (形参，形参)=>返回值
let fn = (nub,nub2)=>nub*nub2;
console.log(fn(10,3))//30
如果没有参数也要加括号：()=>返回值
let fn= ()=>'jiantouhanshu';
console.log(fn());//jiantouhanshu
如果后面不是返回值是执行语句
()=>{
执行语句
}
let fn =()=>{
console.log("天气不错");
}
fn()//天气不错
2.箭头函数没有arguments
let fn = ()=>{
console.log(arguments);//报错
}
fn(1,2,3,4)
可以使用剩余参数获取箭头函数的参数
let fn= (..arg)=>{
console.log(arg);
}
fn(1,2,3,4)//[1,2,3,4]
3.箭头函数的this问题
箭头函数本身没有this，调用箭头函数的this时，指向是其声明时所在作用域的this。
let fn;
let fn2 = function(){
console.log(this);
fn=()=>{
console.log(this);
}
}
fn2 = fn2.bind(document.body);
fn2();//body
fn();//body
4.函数参数默认值
let fn= (a=10,b=2)=>{
console.log(a*b);
}
fn();//20 如果没有传参数，那函数的默认值就是a等于10，b等于2
8、数组新增内容
1.Array.from(类数组)
把一个类数组转换成真正的数组（类数组：有下标有length）
返回值：转换之后的新数组
语法：Array.from(arrayLike[, mapFn[, thisArg]])
参数：arrLike :想要转换成数组的伪数组对象或可迭代对象。
mapFn:（ 可选）如果制定了该参数，新数组中的每个元素会执行该回调函数。
thisArg:（可选）可选参数，执行回调函数mapFn时this对象。
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<script>
{
let lis =document.querySelectorAll("#list li");
console.log(lis);//类数组
lis = Array.from(lis);
}
{
let lis =document.querySelectorAll("#list li");
let arr =[];
lis = Array.from(lis,function(item,index){
console.log(item,index,this);
return index;
},arr);
console.log(lis);
}
</script>
2.Array.of()创建数组
Array.of() 方法创建一个具有可变数量参数的新数组实例，而不考虑参数的数量或类型。
Array.of() 和 Array 构造函数之间的区别在于处理整数参数：Array.of(7) 创建一个具有单个元素 7 的数组，而 Array(7) 创建一个长度为7的空数组（注意：这是指一个有7个空位(empty)的数组，而不是由7个undefined组成的数组）。
Array.of(7); // [7]
Array.of(1, 2, 3); // [1, 2, 3]
Array(7); // [ , , , , , , ]
Array(1, 2, 3); // [1, 2, 3]
3.Array.isArray() 检测数据是否是个数组
Array.isArray(data) 参数data要检测的数据，返回值 true 数组，false 非数组
index
9、数组的find和findIndex
arr.find() 查找数组中满足要求的第一个元素的值
Value arr.find(callback[,thisArg])
参数：callback 在数组每一项上执行的函数。element 当前遍历到的元素，index当前遍历到的索引，array 数组本身。
findIndex 和find用法一样，区别是findexIndex返回的不是具体值，而是索引。
10、数组扁平化
数组扁平化是指将一个多维数组变为一维数组
[1, [2, 3, [4, 5]]] ------> [1, 2, 3, 4, 5]
1、arr.flat
Array arr.flat([depth]) 扁平化多维数组
可选参数：depth 指定要提取嵌套数组的结构深度，默认值为1.
返回值：一个包含将数组与子数组中所有元素的新数组。
var arr = [
["小明","18"],
["小刚"，"18"],
[
[1,
[3,4]
]
]
]
console.log(arr.flat());
console.log(arr.flat(2));
console.log(arr.flat(3));
使用Infinity 可以提取无线层，有多少层可以提取多少层
console.log(arr.flat(Infinity));
2、arr.flatMap
arr.flatMap(function callback(currentValue[,index,[,array]]){
//返回新数组的元素
}[,thisArg])
方法对原数组的每个成员执行一个函数，然后对返回值组成的数组执行flat()方法。该方法返回一个新数组，不改变原数组。但是flatMap()只能展开一层数据。
let arr =[
["小明","18"],
["小刚"，"18"]
];
let newArr = arr.flatMap((item)=>{
item = item.filter((item,index)=>{
return index==0;
});
return item;
})
console.log(newArr);
3、arr.fill
arr.fill(value[,start[,end]]); 用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引
参数：用来填充数组元素的值。
可选参数：start 起始索引，默认值为0。 end 终止索引，默认值为arr.length
let arr=[0,1,2,3,4];
arr.fill("a",1,20);
console.log(arr);
4、arr.includes
arr.includes(valueToFind[,fromIndex]) 判断数组中是否包含一个指定的值。
参数：valueTofind 需要查找的值
可选参数 ： 从fromIndex 处开始向后查找
返回值：true 代表数组中包含valueTofind ,false 代表数组中不包含从fromIndex后
let arr =["a","b","c","d","e"];
console.log(arr.includes("c",3));//false
11、字符串方法
JavaScript 只有indexOf方法，可以用来确定一个字符串是否包含在另一个字符串中。如果不存在返回-1，如果存在返回字符串的位置。ES6 又提供了三种新方法。
includes()：返回布尔值，表示是否找到了参数字符串。
startsWith()：返回布尔值，表示参数字符串是否在原字符串的头部。
endsWith()：返回布尔值，表示参数字符串是否在原字符串的尾部。
let str = '小猫和小狗是好朋友';
console.log(str.startsWith("小猫"));//true
console.log(str.startsWidth("小猫"，2));//false
console.log(str.endsWidth("好朋友"));//true
console.log(str.endsWidth("好朋友",2));//false 后面的参数是从前计算的第几位
repeat 方法返回一个新字符串，表示将原字符重复n次。
{
let str ="a";
console.log(str.repeat(3));//aaa
12、模板字符串
let p =document.querySelector("p");
let name ="小明";
let age=18;
let school="初中";
p.innerHTML =`今年<strong>${
name}</strong>就要<strong>${
age>13?"保密":age}</strong>岁了，终于升入了<strong>${
school}</strong>了`;
${} 插值表达式 {}里面可以插入任何js表达式，可以是一个对象、数组，甚至是一个函数。
13、对象新增方法
1、对象简洁表示法
let a = 0;
let b = 1;
//let obj ={
//a:a,
//b:b
//}
//简洁写法是
let obj ={
a,
b
}
2、属性名表达式
let name="小明";
let obj ={
[name]:111
}
3、Object.assign对象合并
Object.assign(target,…sources) 将所有的可枚举属性的值从一个或多个源对象复制到目标对象
参数： target 目标对象 source源对象 返回值目标对象
4、Object.is
Object.is(value1,value2)判断两个值是否是相同的值。
Object.is('foo', 'foo'); // true
Object.is(window, window); // true
Object.is('foo', 'bar'); // false
Object.is([], []); // false
var foo = {
a: 1 };
var bar = {
a: 1 };
Object.is(foo, foo); // true
Object.is(foo, bar); // false
Object.is(null, null); // true
// 特例
Object.is(0, -0); // false
Object.is(0, +0); // true
Object.is(-0, -0); // true
Object.is(NaN, 0/0); // true
14、Babel 是一个JavaScript编译器。
利用babel就可以让我们在当前的项目中随意的使用这些新最新的es6，甚至es7的语法。说白了就是把各种javascript千奇百怪的语言统统专为浏览器可以认识的语言。