zoukankan      html  css  js  c++  java
  • Es6中的常用新特性

       引言

       ECMAScript6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在 2015 年 6 月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

     我们来看看ES6都做了哪些扩展。
       Let和const关键字
       变量的解构赋值
       函数参数默认值
       箭头(Arrow)函数
       字符串(模板字符串),数值的扩展
       数组,对象的扩展
       函数的扩展
       for...of

    1:先从let和const这两个关键字看起。
      let关键字类似于var,但是他又和var有些不同,主要有两点,
      (1):避免了变量提升
      (2):只在块级作用域内起作用
      const就是常量的意思,所以他就有了不可更改的属性,尝试给一个常量改变值是会报错的
      const和let一样,只在块级作用域内作用, 不存在变量提升,必须先定义后使用, 不可重复声明, 声明后必须赋值。

        2:再来看一个ES6的新特性,for…of。

    平时我们for循环的时候,是这样写的
      Arr=[1,2,3,4,5,6]
      for(vari=0;i<Arr.length;i++)
      有了for…of,我们可以更清晰,牛逼得去遍历数组。
      for(let itemof Arr)可以达到和上面代码同样得效果。
      
      比如
      var arr= [1,2,3,4,5];
       for(let valueof arr){
           if(value ==3){
              //终止整个循环
              break;
           }
            console.log(value);
       }
       这样我们就及时得跳出了循环
       只会打印出来1和2.
       
       也可以跳过当前循环,把break改成continue就可以了。我们也可以得到数字类型得索引,
        for(let indexof arr.keys()){
            console.log(index);
        }
        就可以打印出来0,1,2,3,4.

      3:箭头函数 ->

    箭头函数用 => 符号来定义。
      箭头函数相当于匿名函数,所以采用函数表达式的写法。左边是传入函数的参数,右边是函数中执行的语句。
      var sum =(x,y)=> {return x+y;}
      相当于
      var  sum = function(x,y){
        return x+y;
      }
      上面是完整的写法,左边小括号,右边大括号,而下面的情况可以简写:
      (1)当要执行的代码块只有一条return语句时,可省略大括号和return关键字:
        var sum =(x,y)=> return x+y;
      (2)当传入的参数只有一个时,可以省略小括号:
         var sum =x => x*x;
      (3)当不需要参数时,使用空的圆括号:
         var sum = ()  =>1;
        相当于
         var  sum = function(){
           return 1;
         }
      (4)箭头函数在回调函数中是很简洁的,像这样:
        var array=[1,2,3];
        var result=array.map(x =>x*x); //[1,4,9] 也就是[1*1,2*2,3*3]
      (5)在排序中:
        var array=[1,2,3];
        array.sort((a,b) => b-a) ;//[3,2,1]

     4:箭头函数循环数组 集合 Map

    (1):循环List集合
        String[] atp={"AAA","BBB","CCC"};
    	List<String> mytest=Arrays.asList(atp);
    	//传统方式
    	for(String s:mytest){
    		System.out.println(s);
    	}
    	//箭头函数循环
    	mytest.forEach((s) -> System.out.println(s)); //简写
    	
    	mytest.forEach((s) ->{
    	 System.out.println(s));
    	} 
    	
    (2):循环Map
        Map<String ,String> map=new HashedMap();
    	map.put("111","aaa");
    	map.put("222","bbb");
    	map.put("333","ccc");
    	//传统方式
    	for(Map.Entry<String,String> entry:map.entrySet()){
    		System.out.println("key:"+entry.getKey()+" || value:"+entry.getValue());
    	}
    	//箭头函数循环
    	map.forEach((key,value) ->{
    		System.out.println("key:"+key+" || value:"+value);
    	});		
    (3):循环数组
      先将数组转为集合,在循环集合

     5:函数参数默认值

    ES6支持在定义函数的时候为其设置默认值:
      function foo(height = 50, color = 'red')
      {
         // TODO
      }
      这样写一般没问题,但当参数的布尔值为false时,就会有问题了。比如,我们这样调用foo函数:
      foo(0, "")
      因为0的布尔值为false,这样height的取值将是50。同理color的取值为‘red’。
      所以说,函数参数默认值不仅能是代码变得更加简洁而且能规避一些问题。

    6:模板字符串

    ES6支持模板字符串,使得字符串的拼接更加的简洁、直观。
      不使用模板字符串:
      var name = 'Your name is ' + first + ' ' + last + '.'
      使用模板字符串:
      var name = `Your name is ${first} ${last}.`
      在ES6中通过${}就可以完成字符串的拼接,只需要将变量放在大括号之中。

    先总结这么多,后续的内容再慢慢补上

  • 相关阅读:
    15.6.6-sql字符串组装技巧
    15.5.26-linq to ef多级外链查询
    15.04.14-登录之后刷新AntiForgeryToken
    15.04.10-有意思的补码
    【每天进步一点】毒药和老鼠的研究
    MVC的JavaScriptResult使用
    15.03.28-有意思的位运算
    jQuery笔记三——text/html/val/attr/prop
    jQuery笔记二——基础/动画
    jquery笔记一——小问题+小技巧
  • 原文地址:https://www.cnblogs.com/zhaosq/p/13213379.html
Copyright © 2011-2022 走看看