ES6新增特性
ES6: ECMA 第六次改版
块级作用域：
凡是被{ }包裹住的代码都是块级作用域，除了对象
特点：会造成一个暂时性死区
新增声明变量的两种方式：
let:
a. 不能重复被定义
b.没有变量声明提升
c.有块级作用域的用法，可以在块级作用域里做个保留
const：
a.定义一个常量，不允许被修改
b.没有变量声明提升
c.声明了不能不允许不赋值
d.支持块级作用域
字符串模板：
ES6之前
var age = 20;
var str = "<div class = 'box'><span>"+age+"</span></div>"
ES6之后
var age = 20;
var str = `<div class = 'box'><span>${age}</span></div>`
var age = "20";
var str = `<div class = 'box'><span>${age.slice(1)}</span></div>` // 变量可以做很多js操作
字符串新增api:
includes:
匹配当前字符是否出现在字符串中，如果存在则返回true,不存在则返回false
var str = "1906"
console.log(str.includes(5)) //false
console.log(str.includes(1)) //true
startsWith:
匹配字符串的第一个字符 如果存在则返回true 不存在返回false
var str="1906"
console.log(str.startsWith(9)) //false
endsWith:
匹配字符串的最后一个字符 如果存在则返回true 不存在返回false
var str="1906"
console.log(str.endsWith(9)) //false
repeat(n) 重复多少次
var str="1906"
console.log(str.repeat(4) //代表当前这个句话重复4次
解构赋值：
按照某种规则，将数据进行拆分
let arr = [10,20,30]
let [a,b] = arr
console.log(a,b) //10 20
let [,c,d] = arr
console.log(c,d) //20 30
let obj = {a:1,b:2}
let {a,b} = obj
console.log(a,b) //1 2
var obj = {a:10,b:20,info:{name:"张三"}}
var {info:{name:_name}} = obj;
console.log(_name) //张三
扩展运算符：
var arr = [10,20,30,40]
fn(...arr) //将数组的值展开传入fn中
var obj = {width:"100px",height:"200px"}
var obj = {background:"red",lineHeight:"30px"}
var newObj = {...obj,...obj1}
console.log(newObj) // {width:"100px",height:"200px",background:"red",lineHeight:"30px"}将两个对象值展开合并到一个对象里
Symbol:独一无二
作用：保护对象的属性和值
数据保护
Symbol是一个函数,
也是ES6新增的数据类型，基本数据类型变成6个
for in 是遍历不出来对象中Symbol的属性
一般情况下用来做对象的key值
const a = Symbol();
console.log(typeof a) //Symbol
const a = Symbol("a");
const b = Symbol("a");
console.log(a == b) //false
var obj = {}
var mySymbol = Symbol()
obj[mySymbol] =18
obj[Symbol()] =19
obj[Symbol()] =20
obj.a = 10
obj.b = 23
console.log(obj) //{Symbol():18,Symbol():19,Symbol():20,a:10,b:23}
//object.keys( ),这个方法可以获取对象身上所有的key值，不包括Symbol,返回值是一个数组
let arr = Object.keys(obj);
console.log(arr); //["a","b"]
//获取Symbol的key值
var arr1 = Object.getOwnPropertySymbols(obj);
console.log(arr1) //[Symbol(),Symbol(),Symbol()]
console.log(obj[arr1[0]]) //18
对象新增方法
对象的简写：
let a = 10;
let obj = {
//a=a;
a, //key与value值相同的情况下 ，可以写一个值
// show:function(){}
show(){} //方法简写
}
Object.is( ) 用来判断两个对象的索引是否指向同一索引地址
let obj = {a:10,b:20}
let obj1 = obj
let obj2 = {a:10,b:20}
console.log(Object.is(obj,obj1)) //true
console.log(Object.is(obj,obj2)) //false
Object.assign( ) 合并对象
参数1：需要合并的对象
参数2：被合并的对象
参数3：被合并的对象
......
返回值是一个新的对象
var obj = {a:10,b:13}
var obj1 = {c:131,d:23}
var newObject = Object.assign(obj,obj1)
console.log(newObj) //{a:10,b:13,c:131,d:23}
数组新增方法：
Array.of:将一组数值转换成数组
返回值是一个数组
let arr = Array.of(1,2,3,4)
console.log(arr) //[1,2,3,4]
includes:查找当前值是否属于当前数组 成功true 失败false
var arr = [12,13,14,111]
console.log(arr.includes(11)) //false
Array.from:将一个伪数组转换成纯数组
function fn(){
console.log(Array.from(arguments))
}
fn(1,2,3,4,5) //[1,2,3,4,5]
console.log(Array.from(arguments) instanceof Array) //true
Array.fill( )填充
参数1：需要填充的数据
参数2：（包括）填充开始的下标
参数3：（不包括）结束的下标
var arr = [10,20,30,40]
console.log(arr.fill("a",1,3)) //[10,"a","a",40]
Array.find( ) 根据条件找到相对应的值(最近的一个值)
var arr = [10,20,30,40]
var n = arr.find(function(item,index,array)){
return item>20
}
console.log(n) //30
Array.findIndex( ) 根据条件找到相对应值的下标(最近的一个值)
var arr = [10,20,30,40]
var n = arr.findIndex(function(item,index,array)){
return item>20
}
console.log(n) //2
函数参数的扩展
ES6之前
function fn(a){
var a = a || 10; //用户传递参数就用参数，没传参数就是10
console.log(a);
}
fn();
ES6之后
function fn1(a=10){
console.log(a);
}
fn1(); // 10
fn1("aaa"); //"aaa"
箭头函数:
简单的来说就是把function 换成了 =>
var fn = ()=>{
console.log("111")
}
fn();
语法1:
var fn = a=>a;
console.log(fn(2))
var fn = (a,b)=>a+b;
不写{}代表的是return
语法2:
var fn = ()=>({})
console.log(fn())
特点：
1、箭头函数中没有this的指向，在箭头函数中this的指向会指向离他最近的那个作用域
2、箭头函数中没有arguments这个参数
3、不能当做构造函数
4、箭头函数不能当做generator函数
