ES6新增语法整理

文档参考：MDN

var，let，const

var：

• var可以重复声明

• 作用域：全局作用域 和 函数作用域

• 会进行预解析（先console后定义）

let：

• 同一作用域下不能重复声明
• 作用域：全局作用域 和 块级作用域 { }
• 不会进行预解析

const：

• 使用的时候必须赋值，并且不能修改
• 块级作用域：
• 地方

解构赋值：

• 按照一定模式，从数组中或对象中提取值，将提取出来的值赋值给另外的变量。
• 对象的解构赋值
  let obj = { a：1， b：2}； let{a ，b} = obj； console.log(a,b)

数组的解构赋值：

 let arr = [“a”，“b”，“c”]； let [e，f] = arr； let [ a,b,c ] = [ 1,2,3 ] console.log(a)

面试题（怎样快速交换a，b的值）

let a = 0；
let b = 1；
[a,b] = [b,a]

展开运算符

对数组展开：
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 [a,b,…c] = arr; console.log(a,b,c); //
1,2,{3,4} 把剩余的东西都放在c里

对对象展开：
let obj = { a : 1, b : 2 };
let obj2 ={ …obj, c : 3, d : 4 };
console.log(obj2);
let {a,b,…c} = obj2;
console.log(a,b,c); //1,2, { c:3,d:4 }set

set本身是一个对象，用来构造函数
构造函数，用来构造某一类型的对象
对象构建的过程叫做对象的实例化
let arr = [2,1,2,1,3,4,4,5,1]
let s = new Set(arr);
console.log (s)； //{2,1,3,4,5} //与普通输出的区别是：可以自动去重。
//去重，还是以数组形式输出，
按照出现顺序保留

arr = […s]; console.log(arr); //[2,1,3,4,5]

set的属性和方法

let arr = [2,1,2,1,3,4,4,5,1]
let s = new Set (arr) ;
console.log (s.size)； // size数值的个数，
==> length 方法
s.clear() //清空所有值
s.delete（4） //删除掉某个值
s.delete（“a”） s.add（5）; //添加一项
s.has（5） //是否包含某一项map
let arr = [ [“a”，1]， [“b”，2]， [“c”，3]， ]；
let s = new Map(arr); console.log(s); // 方法：
clear（）清空所有值
delete（key）删除某一项
get（key）获取某一项的值
has（key）是否包含某一项
set（key，val）设置一个值
key 数据的key值
val 数据的val值
输出的是map本身函数新增内容

箭头函数

function的简写
箭头函数：
let fn = （ ）=>{ console.log（“天气不错”）; return“返回值” }； console.log（ fn( ) ）;

1. 形参=>返回值

2. （形参，形参）=> 返回值

3. （）=> 返回值

4. （）=>{
   执行语句
   }

5. （）=>{
   执行语句
   return 返回值
   }

6. （形参）=>{
   执行语句
   return 返回值
   }

rest参数 （剩余参数）

let fn = （a，b，. . .arg）=>
{ console.log（arg）;
[3,4] } fn（1,2,3,4）；

箭头函数的this问题

箭头函数本身没有this，调用尽头函数的this时，指向是其声明时，所在的作用域的this
document.onclick = function（）{
let fn = （）=>{
console.log（this）；
//document }；
function fn（）{
console.log（this）；
//window }
fn () }数组新增内容

Array.from

Array Array.form（arrayLike[ , mapFn [ , thisArg ] ] ）将类数组转换成数组
参数：
arrayLike 类数组
可选参数：
mapFn 类似 map 方法，循环类数组时的回函函数，返回值组成数组
thisArg mapFn 函数执行时的 this 指向
返回值
根据arrayLike 生成新数组

Array.isArray

Boolean Array.isArray（data）检测数据是否是个数组
参数：
data要检测的数据
返回值：
true 数组， false 非数组

Array.of

Array Array.of（element0 [ , element1 [ , … [ , elementN ] ] ] ）将参数转成一个数组
参数：
elementN 要放入数组中的数据
返回值：
新数组
*
数组的find和findIndex

检索数组中的某个值

arr.find

value arr.find(callback [ , thisArg]) 查找数组中满足要求的第一个元素的值
（find这里接收的是一个函数）
参数：
callback 在数组上每一项执行的函数，接收3个参数：
element 当前遍历到的数组
index【可选】当前遍历到的索引
array【可选】 数组本身
let arr = [1 ,2 ,3 ,4] let val = arr.find ( ( item, index ) ) => { if ( item >= 3 ) { return true; } }) ; 简写上面的代码： val = arr.find( item=>item>=3 ); console.log ( val ) ; // 3

arr.findIndex

Index arr . findIndex ( callback [ , thisArg ]) 查找数组中满足要求的第一个元素的值的索引
参数：
callback 针对数值中的每个元素，都会执行该回调函数，执行时会自动传入下面三个参数；
element 当前元素
index 当前元素的索引
array 调用findIndex的数组
可选参数：
thisArg 执行callback时作为this对象的值
返回值：不是具体的值，而是索引
let arr = [1 ,2 ,3 ,4] let index = arr.findIndex( item>=item>=3); console.log( index ); // 2数组扁平化flat和includes
扁平化：把后端传过来的二维数组转化为一维数组

arr.flat

Array arr.flat ([depth]) 扁平化多维数组
可选参数：
depth 指定要提取嵌套数组的结构深度，默认值为1；
返回值：
一个包含将数组与子数组中所有元素的新数组

arr.flatMap

Array arr.flatMap ( function callback ( currentValue [ , index [ , array] ] ) {
//返回新数组的元素
} ) [ ，thisArg ] ) 方法首先使用映射函数映射每个元素，然后将界都压缩成一个新数组。它与map和深度1的flat几乎相同，但flatMap通常在合并成一种方法的效率稍微高一些。
只能替换一层，想要替换多层需要用到递归。

arr.fill

Array arr. fill ( value[ , start[ , end ] ] ) 扁平化多维数组
参数：
用来填充数组元素的值。
可选参数：
start：起始索引，默认值为0
end：终止索引，默认值为arr.length

arr.includes（）

判断是否存在指定的一个值
参数：
valueToFind 需要查找的值
可选参数：
从fromIndex处开始向后查找
返回值：
true代表数组中包含valueTofind，false代表数组中不包含fromIndex模板字符串

let name =（）=> { var n = “小明” ； return n； } let age = 18； p . innerHTML = ` 今年$name()</strong>就要<strong>${ age>13?“保密” : age} 岁了，