ES6新特性-------解构、参数、模块和记号(续)

六、解构

  解构提供了一个方便的地从对象或数组中提取数据的方法,请看下面的例子:

1
2
3
4
5
6
7
//ES6
let  [x,y]=[1,2]; //x=1,y=2
 
//ES5
var  arr=[1,2];
var  x=arr[0];
var  y=arr[1];

  使用这个语法,可以一次性给多个变量赋值。一个很好的附加用处是可以很简单的交换变量值:

1
2
3
let  x=1,y=2;
 
[x,y]=[y,x];x=2 y=1

  解构也可以用于对象,注意对象中必须存在的对应的键:

1
2
3
4
5
let  obj={x:1,y:2};
 
let  {x,y}=obj; //a=1,b=1
或者
let  {x:a,y:b}=obj; //a=1,b=2

  另一个有趣的模式是模拟多个返回值:

1
2
3
4
5
function  doSomething(){
      return  [1,2];
}
 
let  [x.y]=doSomething(); //x=1.y=2

  解构可以用来为参数对象赋默认值。通过对象字面量,可以模拟命名参数:

1
2
3
4
function  doSomething({y:1,z:0}){
       console.log(y,z);
}
doSomething({y:2})

七、参数

1、默认值

  在ES6中,可以定义函数的参数默认值。语法如下:

1
2
3
4
5
6
7
function  doSomething(){
       return  x*y;
}
 
doSomething(5); //10
doSomethinf(5,undefined); //10
doSomething(5,3); //15<br><br>//ES5中给参数赋默认值<br>function doSomething(x,y){<br>  y=y===undefined?2:y;<br>  return x*y;<br>}

   传递undefined或不传参数时都会触发参数使用默认值。

2、REST参数

  前面我们已经学习了省略号操作符,剩余参数和它很类似,它同样是使用‘...’语法,允许你把末尾的参数保存在数组中:

1
2
3
4
5
funtion doSomething(x,...remaining){
     return  x*rremaining.length;
}
 
dodSomething(5,0,0,0); //15

 

八、模块

  在ES6的模块语法中,模块设计围绕export和import关键词,现在让我们看一个包含两个模块的例子:

1
2
3
4
5
6
7
8
9
10
11
12
//lib/ath.js
 
export  function  sum(x,y){
     return  x+y
};
 
export  var  pi=3.14;
 
//app.js
 
import  {sum,pi}form "lib/math.js" ;
console.log(sum(pi,pi);

  正如你所见,可以存在多个export声明,每个都要明确的指出输出值得类型。本例中的import声明使用一种语法,来明确定义被导入的内容,可以使用*通配符,结合as关键词给模块提供一个本地名称,把模块当成一个整体导入:

1
2
3
4
//app.js
 
import *as math form "lib/math.js" ;
console.lgo(math.sum(math.pi,math.pi));

  模块系统有一个default输出,它可以是一个函数,只需要提供一个本地名称就可以导入这个默认值:

1
2
3
4
5
6
7
8
9
10
//lib/my-fn.js
 
export  default  function (){
     console.log( 'echo echo);
}
 
//app.js
 
import doSomething from ' lib/my-fn,js';
doSomething();

  请注意import声明是同步的,但是模块代码需在所有依赖加载完后才会运行

九、类  

  类的创建围绕calss和constructor关键词,以下是个简短的示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
class  Vehicle{
      constructor(name){
          this .name=name;
          this .kind= '' Vehicle";
      }
      
     getName(){
          return  this .name;
     }
};
 
 
//Create an instance
 
let  myVehicle= new  Vehicle( 'rocky' );

  注意类的定义不是一般的对象,因此,类的成员间没有逗号。创建一个类的对象时,需要使用new关键词,继承一个基类时,使用extends:

1
2
3
4
5
6
7
8
9
10
11
12
class  Car  extends  Vehicle{
      constructor(name){
             super (name);
             this .kind= 'car' ;
      }
}
 
let  myCar= new  Car( 'bumpy' );
 
myCar.getName(); //'bumpy';
myCar  instanceof  Car; //true
myCar  instanceof  Vehicle; //true

  从衍生类中,你可以使用从任何构造函数或方法中使用super来获取它的基类:使用super()调用父类构造函数;调用其他成员。

十、记号

  记号是一个新的原生数据的类型,像Number和String一样,你可以使用记号为对象属性创建唯一标示或创建唯一的常量。创建方法如下:

1
2
3
4
const MY_CONSTANT=Symbol();
 
let  obj={};
obj[MY_CONSTANT]=1;

  注意通过记号产生的键值对不能通过Object.getOwnPorpertyNames()获得,在for...in遍历、Object.key()、JSON.stringify()中均不可见,这是与基于字符串的键相反的,你可以通过Object.getOenPropertySymbols()获取一个对象的记号数组。记号与const配合很合适,因为它们都有不可改变的特性。

 

转译

  现在浏览器对ES6的支持还不广泛,且个浏览器也各不相同,可能你写的代码在用户的浏览器中还不能完全解析,这就是我们为什么需要把代码转换成能在当前的任何浏览器中良好运行的旧版本JavaScript(ES5),这种转换通常称为转译,我们必须要这么做,知道所有我们想兼容的浏览器都能运行ES6为止。转译的方法有很多种,包括Bable、Traceur、TypeScript等。

转载:http://www.cnblogs.com/mingxiastory/p/5745853.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值