2019.10.11-ES6总结一

var 与 let const

var 定义的变量有声明提升,可以将声明语句提升至执行环境的提升至最顶端
let 定义的变量没有声明提升,也就是说,在使用该变量前,就得定义.
let定义的全局变量不能当作顶层属性使用.
let定义的是块级作用域,即 每个 { } 为一个作用域.
let定义的变量不能重复声明.
let定义的变量 生成的作用域也有作用域链 与函数作用域链一样.

var定义的变量是函数作用域 (作用域只和函数的 { } 有关)
let定义的变量是块级作用域 (只要是 { } 就会形成作用域)

const 也是块级作用域
const 定义的是常量 也就是一旦定义就不能改变它的值
const 只要声明了就必须要赋值

eg:
	{
		let a=10;
		console.log(a);  //  10
}
	console.log(a);  //  undefined

经典运用: 可代替 闭包函数

//let区分作用域：
            // for (let index = 0; index < 5; index++) {
            //     setTimeout(function(){
            //         console.log(index)
            //     },1000)
            // }

箭头函数

var fun1 = function(a){} ==> var fun1 = (a)=>{}

即 function() == ()=>

当箭头函数只有一个参数和一个return语句的时候,就可以把() 与 {} 都省略掉

eg:  {   let fun1=a=>a+10;
        // let fun1=(a)=>{
        //     a+=3;
        //     return a;
        // }

        console.log(fun1(3));
    }    

箭头函数的特点

箭头函数里没有 this ,但是它还是可以使用this 只不过该this 是其所在环境的this

var name1="小红";
        let obj={
            name2:"小明",
            say:function(a){
                // setTimeout(function(){
                //     console.log(this)
                //     console.log(this.name1)
                //     console.log(a);
                // }.bind(this,10),1000)

                // setTimeout(()=>{
                    // console.log(this)
                    // console.log(this.name1)
                    // console.log(a);
                // },1000)
                
                // 上下结果一样,即箭头函数可顶替bind运用,用于改变this指向

                // 改变this的指向的三种方法：
                // 1.保存this
                // 2.bind改变this
                // 3.箭头函数改变this
            }
        }

        obj.say();

// bind方法除了可以改变this指向 还可以传参数，没有办法传实参的时候，比如说计时器还有事件后的函数 可以用bind传
// 绑定在事件后面的函数 如果想要传实参 还有一种方法就是把事件写在标签里当作属性用

箭头函数里没有arguments对象

var obj={
        2:"aa",
        3:"bb",
        length:5
    }
    var arr1=Array.from(obj);// 把类数组转化为数组
    console.log(arr1);

当一个对象的key值是正整数 还有length属性的时候 这个对象就是一个类数组对象

函数的参数

// 默认参数
        function fun1(a,b=0){
            console.log(a+b);
        }
        fun1(20);
        //当定义b=0后,既可以传一个实参,也可以传俩个

        // 参数的不确定
        // ... 是扩展运算符
        let fun2=(...val)=>{
            // value就代表传进来的实参,是一个数组
            let [a,b,c]=val;
            console.log(a,b,c);
        }
        fun2(1,2,3,4)

数组的解构赋值

    =      

解构赋值是赋值运算符 = 的扩展
是对数组和对象的的模式匹配
说白了解构赋值就是把数组和对象解构成变量

数组的解构

let [a,b]=[1];
解构赋值分为俩部分 左边叫解构目标 右边叫解构源
左边的结构目标可以有初始值,如果右边的解构源的个数少于左边的结构目标的个数 就是不完全解构

数组的解构应用场景

1.俩个变量交换值

{
        //let c="aaa";
        //let b="bbb";
        //b=c;//=> b="aaa"

        let a=10,b=20;
        [a,b]=[b,a];// => [a,b]=[20,10]
        console.log(a,b);
    }

2.当一个函数有多个返回值的时候

{
        function fun1(){
            return [1,2];
        }

        console.log(fun1());
        let res=fun1();
        let [a,b]=res;
        console.log(a,b);
    }

对象的解构就是从对象里提取数据

var json={name:"小明",age:"18",sex:"男"};
    var {name,sex}=json;
    console.log(name,sex);

    var data={
        code:"200",
        result:[1,2,3,[4,5]],
        res2:[]
    }

    var {result,res2}=data;
    console.log(result);

ES6 新增了一种 for-of 循环

var arr=[1,2,3,4];
        for (let item of arr) {
            console.log(item);  
        }

可以在for-of循环里使用break和container

ES6 新增的数组–字符串方法

数组的方法

基本方法
1.Push 末尾添加
2.Pop 删除末尾元素
3.Shift 在开头删除
4.Unshift 在开头添加
5.Sort 排序
6.Concat合并数组
7.Reverse 倒序
8.Splice 删除/添加/替换数组的某一部分
9.join 把数组转化为字符串
10.indexOf 查找下标

复杂的方法（接受一个函数作为参数）
11.forEach 循环数组
12.Map 映射
13.Filter 过滤
14.Some 有一项符合就返回true
15.Every 每一项都符合返回true
16.Find 查找符合条件的元素 返回的是元素本身 找不到返回undefined
17.FindIndex 查找符合条件元素的下标 找不到返回-1

Es6新增的方法
18.Array.of 定义数组
19.Array.from 把类数组转化为数组
20.Fill 用某个值替换数组的某一部分
21.Flat 把多维数组转化为一维数组
22.copyWithIn 拿数组的某一部分替换数组的另一部分
23.Includes 判断数组里是否有某一项 返回布尔值
24.Keys 拿到数组的所有键值
25.Values 拿得数组的所有value值

字符串的方法

1.toLowerCase 转化为小写
2.ToUpperCase 转化为大写
3.Split 分割为数组
4.Repeat 重复字符串
5.Search 查找字符
6.Substring/substr 截取字符串
7.ToString string 转化为字符串
8.Replace 替换字符
9.IndexOf 查找下标
10.LastIndexOf 从最后一位开始查找下标
11.CharAt 查找某一位上的值
12.Concat 合并字符串
13.Includes 判断是否含有某个字符
14.PadStart 补全开头
15.PadEnd 补全结尾
16.Startswith 是否以谁为开头
17.Endswith 是否以谁为结尾