首页 > 其他 > 详细

Es6

时间:2019-07-31 14:41:02      阅读:84      评论:0      收藏:0      [点我收藏+]

一.let&const

   1.没有变量提升,不能重复定义,不挂在到window上。

   2.声明在{}内部的变量无法在外部使用(块级作用域)】、

   3.产生临时死区

          技术分享图片

 

   4.const声明后不能修改;

二:spreed&rest   收集与展开     

     1.写

 1 function average(...arg){
 2         var averageNumber = 0;
 3         //数组按照从小到大排序
 4         arg.sort(function(a, b){
 5                 return a - b;
 6         });
 7         //去掉第一个和最后一个
 8         arg.pop();
 9         arg.shift();
10         for(var i = 0; i < arg.length; i++){
11             averageNumber += arg[i];
12         }
13         return averageNumber 
14     }
15     console.log(average(3, 1, 4, 2));//2.5

 

  收集: 将参数收集起来,收集方式为将参数放入数组中;

   技术分享图片

 

  控制台打印:技术分享图片

 

 技术分享图片

 

rest运算符需要放在参数的最后一位

  2.读 

1 let arr = [1, 2, 3, 4, 5];
2     console.log(arr); //打印[1, 2, 3, 4, 5];
3     console.log(...arr);//会变成散列的值: 1, 2, 3, 4, 5

 

  这里arr3通过使用spreed运算符,合成了一个数组

1 let arr1 = [1, 2, 3, 4];
2     let arr2 = [5, 6, 7, 8];
3     let arr3 = [...arr1, ...arr2];
4     console.log(arr3);//[1, 2, 3, 4, 5, 6, 7, 8]

    三:解构(结构化赋值)

     解构过程中,具备赋值和变量声明两个功能。
   目的在于把等号左右长的相似的两个东西内部的值取出来

   作用:简化书写长度,提升开发效率

   1.基本

1 let [a, b, c] = [1, 2, 3];
2 console.log(a,b,c)

 技术分享图片

  2.可嵌套  

1 let [a, [[b], c]] = [1, [[2], 3]];

     技术分享图片

   3.可忽略

    

1 let [a, , b] = [1, 2, 3];

  技术分享图片

   4.解构默认值

      当解构模式有匹配结果,且匹配结果是 undefined 时,会触发默认值作为返回结果

1 let [a = 3, b = a] = [];     // a = 3, b = 3
2 let [a = 3, b = a] = [1];    // a = 1, b = 1
3 let [a = 3, b = a] = [1, 2]; // a = 1, b = 2

    5.对象模型的解构(Object)

      技术分享图片

   四:箭头函数

           1.基本形式:

1  let sum = (a,b) => {
2     return a+b;
3  }
4 
5 let sum = (a,b) => a+b;

 

           2. 箭头函数基本特点

        (1) 箭头函数this为外围最接近一层的非箭头函数,不是调用时的this。

       (2)  箭头函数不能作为构造函数,不能使用new

       (3) 箭头函数没有arguments

 

         (5). 箭头函数没有原型属性

   五:map  对象,存储内容的     

1 var map = new Map();
2     map.abc = 123
3     map.bcd = 456
4 console.log(map)

    1. 通过set存储,get获取

    2. for of 循环 。 对象不能循环

        

 1 for(var index of map){
 2 console.log(index);
 3 }
 4 
 5 for(var name of map.entries()){
 6 console.log(name)
 7 }
 8 
 9 for (var [key,value] of map.entries()){
10 console.log(key,value)
11 }
12 
13 for (var val of map.values()){
14 console.log(val)
15 }

  六:class类

1 class Coder{ //类
2     name(val){//构造函数
3         console.log(val);
4     }
5 }
6  
7 let shuang= new Coder;
8 shuang.name(‘shuang‘);

   Class继承

  特点:

   a. 使用extends 关键字

   b. 子类会继承父类的属性和方法

   

 1 class Point{
 2         constructor(){
 3             this.name = "Jack";
 4             this.age = 20;
 5         }
 6         getName(){
 7             console.log(this.name);
 8         }
 9         getAge(){
10             console.log(this.age);
11         }
12     }
13  
14     class ColorPoint extends Point{
15         getInfo(){
16             console.log("ColorPoint")
17         }
18  
19         //与父类方法同名,会覆盖父类
20         getAge(){
21             console.log("替换父类getAge()")
22         }
23     }
24  
25     let cp = new ColorPoint();
26     cp.getName();
27     cp.getAge();
28     cp.getInfo();

 

   super关键字: 子类中声明constructor时,里面必须调用super();否则会报错

 

    七:promise 承诺

    就是一个对象,用来做异步的消息处理的

      用法:

      var  p1=new Promise(function(reslove,reject){

               if(成功){

                 resolve(1)

              }else{

                reject(1)

           }

          })

 三种状态  pending 等待      resolve成功      reject 失败

          .then链试调用,如果成功了执行成功的函数,如果失败了执行失败的函数

var num = new Promise(function(resolve,reject){
            resolve(1)
             reject(2)
        })


        //then调用以后又返回一个promise对象
        num.then(function(data){
            return data + 10;
        },function(){
        }).then(function(data){
            console.log(data)
        },function(err){

        })

       .all() 所有的promise对象是成功,才能走成功

      .race()谁先加载完谁就先执行

      resolve()     var p3 = Promise.resolve(‘成功了‘);

      reject()        var p4 = Promise.reject("失败了");

     

 

Es6

原文:https://www.cnblogs.com/yuyuanwen/p/11275770.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!