• es6中的部分新特性


    1、es6中变量声明可以使用let声明变量,用const声明常量。例:

    test:function(){
      {
        var num=10;
        let num1=11;
        const num2=12;
      }  
      console.log(num);  //10
      console.log(num1);  //报错
      console.log(num2);  //报错
    }

    2、es6中的模板字符串。使用反撇号字符`代替普通字符串的引号'或"。例:

    test:function(){
      var num=12;
      var num1=15;
      var str=`${num}+${num1}=${num+num1}`;
      console.log(str);  //12+15=27
    }

    3、箭头函数。例:

    test:()=>{
      num=[1,2,3,4,5,6,7];
      num.forEach(function(v){
        console.log(v);  //输出数组中的每个值
      })
      //使用箭头函数(=>符号取代function,当参数只有一个的时候,可以省略参数外面的括号)
      num.forEach(v=>{
        console.log(v);  //输出数组中的每个值
      });
      //参数的扩展
      function root(num=4){
        console.log(num);
      }
      function root1(...num){
        let sum=0;
        for(let n of num){
          sum+=n;
        }
      }
      root();  //4  没有参数的时候默认值为4
      root(8);  //8  传递参数的时候所传的参数取代默认值
      root1(1.2);  //1.2
      root1(1,2,3,4,5) //15
      //this作用域
      wx.getSystemInfo({
        success:function(res){
          this.setData({  //没有使用箭头函数时,这样写会报错,因为this指向是wx.getSystemInfo
            //假设data里面有定义一个name的值
            name:"123"
          })
        success:res=>{
          this.setData({  //使用了箭头函数,this指向是test,所以可以修改data里面的值
          //假设data里面有定义一个name的值
          name:"123"
          })
        }
      })
    }

    4、增强的变量字面量。例:

    test:function(){
      var tool={
        ['str'+'name'+'you']:"ok",
      };
      console.log(tool);  //strnameyou:ok
    }

    5、解构赋值:es6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,叫做解构

      ①:数组的解构赋值,可以从数组中提取值,按照对应位置,对变量赋值

      ②:对象的解构赋值

      ③:字符串的解构赋值,字符串被转换成了一个类似数组的对象

      ④:函数参数的解构赋值

    test:function(){
    
      //数组的解构
      var num=[45,46,85,22];
      var [a,b,c,d]=num;
      console.log(a,d);  //45,22
    
      //对象的解构
      var tool={
        name:"loop",
        age:12,
        sex:'男'
      };
      var {name,sex}=tool;
      console.log(name,sex);  //loop,男
    
      //字符串的解构赋值
      var [a,b,c,d]="java";
      console.log(a,b,c,d);  //j a v a
    
      //函数的解构赋值
      function tt([x,y]){
        console.log(x,y);  //1,2
      }
      tt([1,2]);
    }

    6、类:Class是es6引入的最重要的特性之一,在没有Class之前,我们只能通过原型链来模拟类

    test:function(){
      var Root=function(){
        
      };
      Root.prototype.eat=function(){
        console.log("es5 eat");
      }
      Root.doing=function(){
        console.log("es5 eat")
      }
    
      let a=new Root();
      a.eat();  //es5 eat
      Root.doing();  //es5 eat
    
      class Roots{
        constructor(){
          
        }
        eat(){
          console.log("Es6 eat");
        }
        static doing(){
          console.log("Es6 doing");
        }
      }
      let b=new Roots();
      b.eat();  //Es6 eat
      Roots.doing();  //Es6 doing
    }
  • 相关阅读:
    什么是单例模式?
    下拉列表(web),用jQuery实现
    PS基础
    C#笔记
    C#基础篇--文件(流)
    C#基础篇03
    今天自学了网页上注册某某时的倒计时设置
    主数据管理的Jill Dyche, Evan Levy六层次模型
    scala akka 修炼之路6(scala函数式柯里化风格应用场景分析)
    OpenWrt mt7620n双SSID实现原理
  • 原文地址:https://www.cnblogs.com/chao202426/p/10734370.html
Copyright © 2020-2023  润新知