es6学习总结 （this，Promise）

this指向问题

es5中一句话可有概括谁调用this就指向谁（运行时生效），es6中箭头函数中没有this，所以es6中的this相当于一个变量，她永远继承外层作用域的this（定义时生效），需要注意的对象不构成作用域，当然函数在生效时才能行车作用域。

1.  
   function f(){
2.  
   this.s1=18;
3.  
   this.s2=19;
4.  
   setInterval(()=>this.s1++,1000);
5.  
   setInterval(function func(){
6.  
   this.s2++
7.  
   },1000)
8.  
    
9.  
   }
10.  
    var obj=new f()
11.  
    setTimeout(()=>{console.log("s1:",obj.s1)},3000)
12.  
    setTimeout(()=>{console.log("s2:",obj.s2)},3000)
13.  
     
14.  
    //21
15.  
    //19 借鉴官网的例子

promise的链式调用

1.  
   function  china(){
2.  
                       console.log('china中国')
3.  
                       var p =new Promise(
4.  
                       function( resolve,reject ) {
5.  
                                setTimeout(function(){
6.  
   //                              console.log('中国  国家')
7.  
                                resolve('教育大省份')
8.  
                            },1000)
9.  
                       }
10.  
                   )
11.  
                   return  p;
12.  
               }
13.  
     
14.  
               function  jiangshu(data){
15.  
                        console.log('江苏'+data);
16.  
                        var p=new Promise(function(resolve,reject){
17.  
                             setTimeout(function (){
18.  
    //                          console.log('江苏 省份')
19.  
                             resolve('地级市');
20.  
                        },2000)
21.  
                   })
22.  
                   return p;
23.  
               }
24.  
     
25.  
               function  xian(data){
26.  
                       console.log('盱眙县'+data)
27.  
                        var p=new Promise(function(resolve,reject){
28.  
                             setTimeout(function(){
29.  
    //                          console.log('盱眙县');
30.  
                             resolve ('淮河镇')
31.  
                        },2000)
32.  
                   })
33.  
                   return p;
34.  
                }
35.  
    china ().then(jiangshu).then(xian).then(function(data){
36.  
    console.log(data)
37.  
    })
38.  
     
39.  
    //china中国
40.  
    //Promise {<pending>}
41.  
    //江苏教育大省份
42.  
    //盱眙县地级市
43.  
    //淮河镇

如上代码所示，promise的链式调用很好的避免的函数的回调地狱问题。 

数组扩展运算符

   作用将一个数组转为用逗号分隔的参数序列。

  运算

1.  
   var add=(a,c)=>a+c;
2.  
   var Arr=[1,3]；
3.  
   add(...Arr)
4.  
   //4

 替代apply方法（只是相对数组用调用其它方法来说，因为apply的第二个参数正好是一个数组，因为apply本来是改变函数的this指向（箭头函数除外））,这是扩展运算符相当于数组的遍历看的很清楚。

1.  
   var arr1 = [0, 1, 2];
2.  
   var arr2 = [3, 4, 5];
3.  
   Array.prototype.push.apply(arr1, arr2);
4.  
   console.log(arr1)
5.  
   // [0, 1, 2, 3, 4, 5]
6.  
    
7.  
    
8.  
   let arr3=[1,2,3];
9.  
   let arr4=[4,5,6];
10.  
    arr3.push(...arr4)
11.  
    console.log(arr3)
12.  
    // [1, 2, 3, 4, 5, 6]

  数组的浅拷贝

1.  
   const a1 = [1, 2];
2.  
   const a2 = [...a1];

 将字符串转为数组

1.  
   [...'hello']
2.  
   // [ "h", "e", "l", "l", "o" ]

rest参数 

  arguments类数组通过Array.prototype.slice.call()转化为数组

1.  
   function f(){
2.  
   console.log(arguments)
3.  
   let a=Array.prototype.slice.call(arguments,0)
4.  
   console.log(a)
5.  
   }
6.  
   f(1,2,3,4)
7.  
   // Arguments(4) [1, 2, 3, 4, callee: ƒ, Symbol(Symbol.iterator): ƒ]
8.  
   // [1, 2, 3, 4]
9.  
    

es6通过rest参数去掉arguments参数，rest直接是个数组

1.  
   const numbers = (...nums) => nums;
2.  
    
3.  
   numbers(1, 2, 3, 4, 5)
4.  
    
5.  
   //[1,2,3,4,5]

 

对象

ES6 引入了跟Object.keys配套的Object.values和Object.entries，作为遍历一个对象的补充手段，供for...of循环使用。

1.  
   let {keys, values, entries} = Object;
2.  
   let obj = { a: 1, b: 2, c: 3 };
3.  
    
4.  
   for (let key of keys(obj)) {
5.  
   console.log(key); // 'a', 'b', 'c'
6.  
   }
7.  
    
8.  
   for (let value of values(obj)) {
9.  
   console.log(value); // 1, 2, 3
10.  
    }
11.  
     
12.  
    for (let [key, value] of entries(obj)) {
13.  
    console.log([key, value]); // ['a', 1], ['b', 2], ['c', 3]
14.  
    }

 map数据结构（类似对象，值-值的对应，后续补充） 

 set数据结构（类似数组，没有重复元素）

  看一个例子，数组去重的简单写法

1.  
   let arr = [1,2,3,4,5,5,4,3,2,1];
2.  
   let quchong= [...new Set(arr)];
3.  
   console.log(quchong); // [1,2,3,4,5]
4.  
    
5.  
   [...new Set('ababbc')].join('') //字符串去重