ES6新特性-------解构、参数、模块和记号(续)
六、解构
解构提供了一个方便的地从对象或数组中提取数据的方法,请看下面的例子:
//ES6
let [x,y]=[1,2];//x=1,y=2 //ES5
var arr=[1,2];
var x=arr[0];
var y=arr[1];
使用这个语法,可以一次性给多个变量赋值。一个很好的附加用处是可以很简单的交换变量值:
let x=1,y=2; [x,y]=[y,x];x=2 y=1
解构也可以用于对象,注意对象中必须存在的对应的键:
let obj={x:1,y:2};
let {x,y}=obj;//a=1,b=1
或者
let {x:a,y:b}=obj;//a=1,b=2
另一个有趣的模式是模拟多个返回值:
function doSomething(){
return [1,2];
}
let [x.y]=doSomething();//x=1.y=2
解构可以用来为参数对象赋默认值。通过对象字面量,可以模拟命名参数:
function doSomething({y:1,z:0}){
console.log(y,z);
}
doSomething({y:2})
七、参数
1、默认值
在ES6中,可以定义函数的参数默认值。语法如下:
function doSomething(){
return x*y;
}
doSomething(5);//10
doSomethinf(5,undefined);//10
doSomething(5,3);//15
//ES5中给参数赋默认值
function doSomething(x,y){
y=y===undefined?2:y;
return x*y;
}
传递undefined或不传参数时都会触发参数使用默认值。
2、REST参数
前面我们已经学习了省略号操作符,剩余参数和它很类似,它同样是使用‘...’语法,允许你把末尾的参数保存在数组中:
funtion doSomething(x,...remaining){
return x*rremaining.length;
}
dodSomething(5,0,0,0);//15
八、模块
在ES6的模块语法中,模块设计围绕export和import关键词,现在让我们看一个包含两个模块的例子:
//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关键词给模块提供一个本地名称,把模块当成一个整体导入:
//app.js import*as math form"lib/math.js";
console.lgo(math.sum(math.pi,math.pi));
模块系统有一个default输出,它可以是一个函数,只需要提供一个本地名称就可以导入这个默认值:
//lib/my-fn.js
export default function(){
console.log('echo echo);
}
//app.js
import doSomething from 'lib/my-fn,js';
doSomething();
请注意import声明是同步的,但是模块代码需在所有依赖加载完后才会运行
九、类
类的创建围绕calss和constructor关键词,以下是个简短的示例:
class Vehicle{
constructor(name){
this.name=name;
this.kind=''Vehicle";
}
getName(){
return this.name;
}
};
//Create an instance
let myVehicle=new Vehicle('rocky');
注意类的定义不是一般的对象,因此,类的成员间没有逗号。创建一个类的对象时,需要使用new关键词,继承一个基类时,使用extends:
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一样,你可以使用记号为对象属性创建唯一标示或创建唯一的常量。创建方法如下:
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等。
ES6新特性-------解构、参数、模块和记号(续)的更多相关文章
- es6新特性-解构表达式、Lambda表达式、局部变量及map/reduce方法
循环内的变量在循环外可见,不合理: let定义的变量是局部变量: const修饰的是常量,不允许再次修改,类似于java中的static: 解构表达式:
- ES6相关特性(解构赋值)
解构赋值:本质上是一种匹配模式,等号两边的模式相同,则左边的变量可以被赋予对应的值. 注意:null & undefined 不能解构赋值!!! 数组的解构赋值: let [a,[[b],c] ...
- ES6新特性(函数默认参数,箭头函数)
ES6新特性之 函数参数的默认值写法 和 箭头函数. 1.函数参数的默认值 ES5中不能直接为函数的参数指定默认值,只能通过以下的变通方式: 从上面的代码可以看出存在一个问题,当传入的参数为0或者 ...
- ES6新特性三: Generator(生成器)函数详解
本文实例讲述了ES6新特性三: Generator(生成器)函数.分享给大家供大家参考,具体如下: 1. 简介 ① 理解:可以把它理解成一个函数的内部状态的遍历器,每调用一次,函数的内部状态发生一次改 ...
- ES6新特性概览
本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...
- 必须掌握的ES6新特性
ES6(ECMAScript2015)的出现,让前端开发者收到一份惊喜,它简洁的新语法.强大的新特性,带给我们更便捷和顺畅的编码体验,赞! 以下是ES6排名前十的最佳特性列表(排名不分先后): 1.D ...
- 你不知道的JavaScript--Item24 ES6新特性概览
ES6新特性概览 本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代 ...
- 前端入门21-JavaScript的ES6新特性
声明 本篇内容全部摘自阮一峰的:ECMAScript 6 入门 阮一峰的这本书,我个人觉得写得挺好的,不管是描述方面,还是例子,都讲得挺通俗易懂,每个新特性基本都还会跟 ES5 旧标准做比较,说明为什 ...
- Atitit js es5 es6新特性 attilax总结
Atitit js es5 es6新特性 attilax总结 1.1. JavaScript发展时间轴:1 1.2. 以下是ES6排名前十的最佳特性列表(排名不分先后):1 1.3. Es6 支持情况 ...
随机推荐
- C语言解析日志,存储数据到伯克利DB
编译命令 gcc -o dbwriter dbwriter.c -ldb dbwriter.c #include <assert.h> #include <stdlib.h> ...
- cocos2d-x特效之CCControlPotentiometer
在test示例下面,有一个关于此功能的代码,实现的效果如下: 通过拉动可旋转的按钮,从而改变所代表的值,这个效果的确是很棒的,但,和我的需求有一些差别,先贴上我实现的效果吧 ...
- esxi5.5 安装,虚拟机复制
尝试在vmware workstation上安装hadoop,感觉太慢了. 好在家里的台式机配置还可以,所以就想在它上面虚拟出几台服务器出来. 台式机配置如下: 虚拟出来三个应该没问题了吧. 第一步, ...
- 通用Makefile
本文推荐了一个用于对 C/C++ 程序进行编译和连接以产生可执行程序的通用 Makefile. 在使用 Makefile 之前,只需对它进行一些简单的设置即可:而且一经设置,即使以后对源程序文件有所增 ...
- sql server 2008 在与 SQL Server 提示建立连接时出现与网络相关的或特定于实例的错误
原文地址:http://zhidao.baidu.com/link?url=Ndav32DO9zL5XnltqoqlhvKHbJv_n3Zwihhw4cwF9ffNq8hb8z7h7n3vJVfoeW ...
- HDU 1394 Minimum Inversion Number(线段树 或 树状数组)
题目大意:给出从 0 到 n-1 的整数序列,A0,A1,A2...An-1.可将该序列的前m( 0 <= m < n )个数移到后面去,组成其他的序列,例如当 m=2 时,得到序列 A2 ...
- c、c++知识点
一. (1)在linux下类似uint8_t这样的文件定义在头文件<stdint.h>里面 (2)截取了stdint.h头文件里的一些常用部分 二.c++中c_str()用法 函数返回 ...
- 查看登录用户who
几个命令:wwho每隔5秒钟,就来查看hadoop是否已经登录,如登录,显示其已经登录,并退出:sleep whoami last,显示/var/log/wtmp文件,显示用户登录历史及系统重启历史 ...
- ABAP - 日期格式转换 & ABAP经常使用日期处理函数
ABAP - 日期格式转换 如今提供下面一些日期格式转换的函数: Below are several FMs which can be used to convert date format. 1. ...
- Linux基本操作 2-----Linux文件系统基本结构
Linux的文件系统结构 Linux文件系统为一个倒转的单根树状结构 文件系统的根为"/" 文件系统严格区分大小写 路径使用“/”来分割,在windows使 ...