【ES6】ES6的新特性
来源：互联网 发布：淘宝客的计划描述咋写 编辑：程序博客网 时间：2024/05/01 11:52
这是从别的博客上学到的，在这里做个整理：
(1)箭头操作符=>
简化了函数的书写。操作符左边为输入的参数，而右边则是进行的操作以及返回的值Inputs=>outputs。
var array = [1, 2, 3];//传统写法array.forEach(function(v, i, a) { console.log(v);});//ES6array.forEach(v = > console.log(v));(2)类的支持--class关键字
ES6中添加了对类的支持，引入了class关键字（其实class在JavaScript中一直是保留字，目的就是考虑到可能在以后的新版本中会用到，现在终于派上用场了）。JS本身就是面向对象的，ES6中提供的类实际上只是JS原型模式的包装。现在提供原生的class支持后，对象的创建，继承更加直观了，并且父类方法的调用，实例化，静态方法和构造函数等概念都更加形象化。
//类的定义class Animal {//ES6中新型构造器 constructor(name) { this.name = name; } //实例方法 sayName() { console.log('My name is '+this.name); }}//类的继承class Programmer extends Animal { constructor(name) { //直接调用父类构造器进行初始化 super(name); } program() { console.log("I'm coding..."); }}//测试我们的类var animal=new Animal('dummy'),wayou=new Programmer('wayou');animal.sayName();//输出 ‘My name is dummy’wayou.sayName();//输出 ‘My name is wayou’wayou.program();//输出 ‘I'm coding...’(3)增强的对象字面量
对象字面量被增强了，写法更加简洁与灵活，同时在定义对象的时候能够做的事情更多了。具体表现在：
- 可以在对象字面量里面定义原型
- 定义方法可以不用function关键字
- 直接调用父类方法
这样一来，对象字面量与前面提到的类概念更加吻合，在编写面向对象的JavaScript时更加轻松方便了。
//通过对象字面量创建对象var human = { breathe() { console.log('breathing...'); }};var worker = { __proto__: human, //设置此对象的原型为human,相当于继承human company: 'freelancer', work() { console.log('working...'); }};human.breathe();//输出 ‘breathing...’//调用继承来的breathe方法worker.breathe();//输出 ‘breathing...’(4)字符串模板
ES6中允许使用反引号 ` 来创建字符串
//产生一个随机数var num=Math.random();//将这个数字输出到consoleconsole.log(`your num is ${num}`);(5)解构赋值
自动解析数组或对象中的值。
var [x,y]=getVal(),//函数返回值的解构 [name,,age]=['wayou','male','secrect'];//数组解构function getVal() { return [ 1, 2 ];}console.log('x:'+x+', y:'+y);//输出：x:1, y:2 console.log('name:'+name+', age:'+age);//输出： name:wayou, age:secrect (6)参数默认值，不定参数，拓展参数
默认参数值：
在定义函数的时候指定参数的默认值了，而不用像以前那样通过逻辑或操作符来达到目的了。
function sayHello(name){//传统的指定默认参数的方式var name=name||'dude';console.log('Hello '+name);}//运用ES6的默认参数function sayHello2(name='dude'){console.log(`Hello ${name}`);}sayHello();//输出：Hello dudesayHello('Wayou');//输出：Hello WayousayHello2();//输出：Hello dudesayHello2('Wayou');//输出：Hello Wayou
不定参数
不定参数是在函数中使用命名参数同时接收不定数量的未命名参数。
//将所有参数相加的函数 function add(...x){ return x.reduce((m,n)=>m+n); } //传递任意个数的参数 console.log(add(1,2,3));//输出：6 console.log(add(1,2,3,4,5));//输出：15
拓展参数
拓展参数则是允许传递数组或者类数组直接做为函数的参数而不用通过apply。
var people=['Wayou','John','Sherlock']; //sayHello函数本来接收三个单独的参数人妖，人二和人三 function sayHello(people1,people2,people3){ console.log(`Hello ${people1},${people2},${people3}`); } //但是我们将一个数组以拓展参数的形式传递，它能很好地映射到每个单独的参数 sayHello(...people);//输出：Hello Wayou,John,Sherlock //而在以前，如果需要传递数组当参数，我们需要使用函数的apply方法 sayHello.apply(null,people);//输出：Hello Wayou,John,Sherlock(7)let与const 关键字
可以把let看成var，只是它定义的变量被限定在了特定范围内才能使用，而离开这个范围则无效。const则很直观，用来定义常量，即无法被更改值的变量。
for (let i=0;i<2;i++)console.log(i);//输出: 0,1console.log(i);//输出：undefined,严格模式下会报错
(8)for of 值遍历
我们都知道for in 循环用于遍历数组，类数组或对象，ES6中新引入的for of循环功能相似，不同的是每次循环它提供的不是序号而是值。
var someArray = [ "a", "b", "c" ];
for (v in someArray) {
console.log(v);//输出 0,1,2
}
for (v of someArray) {
console.log(v);//输出 a,b,c
}
(9)iterator, generator
基本概念：(10)模块（有待深入研究）
iterator:它是这么一个对象，拥有一个next方法，这个方法返回一个对象{done,value}，这个对象包含两个属性，一个布尔类型的done和包含任意值的value
iterable: 这是这么一个对象，拥有一个obj[@@iterator]方法，这个方法返回一个iterator
generator: 它是一种特殊的iterator。反的next方法可以接收一个参数并且返回值取决与它的构造函数（generator function）。generator同时拥有一个throw方法
generator 函数: 即generator的构造函数。此函数内可以使用yield关键字。在yield出现的地方可以通过generator的next或throw方法向外界传递值。generator 函数是通过function*来声明的
yield 关键字：它可以暂停函数的执行，随后可以再进进入函数继续执行
在ES6标准中，JavaScript原生支持module了。将JS代码分割成不同功能的小块进行模块化。
将不同功能的代码分别写在不同文件中，各模块只需导出公共接口部分，然后通过模块的导入的方式可以在其他地方使用。
// point.jsmodule "point" { export class Point { constructor (x, y) { public x = x; public y = y; } }} // myapp.js//声明引用的模块module point from "/point.js";//这里可以看出，尽管声明了引用的模块，还是可以通过指定需要的部分进行导入import Point from "point"; var origin = new Point(0, 0);console.log(origin);(11)Proxies
Proxy可以监听对象身上发生了什么事情，并在这些事情发生后执行一些相应的操作。
//定义被侦听的目标对象 var engineer = { name: 'Joe Sixpack', salary: 50 }; //定义处理程序 var interceptor = { set: function (receiver, property, value) { console.log(property, 'is changed to', value); receiver[property] = value; } }; //创建代理以进行侦听 engineer = new Proxy(engineer, interceptor); //做一些改动来触发代理 engineer.salary = 60;//控制台输出：salary is changed to 60 对于处理程序，是在被侦听的对象身上发生了相应事件之后，处理程序里面的方法就会被调用，上面例子中我们设置了set的处理函数，表明，如果我们侦听的对象的属性被更改，也就是被set了，那这个处理程序就会被调用，同时通过参数能够得知是哪个属性被更改，更改为了什么值。
(12)Symbols
我们知道对象其实是键值对的集合，而键通常来说是字符串。而现在除了字符串外，我们还可以用symbol这种值来做为对象的键。Symbol是一种基本类型，像数字，字符串还有布尔一样，它不是一个对象。Symbol 通过调用symbol函数产生，它接收一个可选的名字参数，该函数返回的symbol是唯一的。之后就可以用这个返回值做为对象的键了。Symbol还可以用来创建私有属性，外部无法直接访问由symbol做为键的属性值。
(13)Math，Number，String，Object 的新API
Number.EPSILON Number.isInteger(Infinity); // false Number.isNaN("NaN"); // false Math.acosh(3); // 1.762747174039086 Math.hypot(3, 4); // 5 Math.imul(Math.pow(2, 32) - 1, Math.pow(2, 32) - 2); // 2 "abcde".contains("cd"); // true "abc".repeat(3); // "abcabcabc" Array.from(document.querySelectorAll('*')); // Returns a real Array Array.of(1, 2, 3) // Similar to new Array(...), but without special one-arg behavior [0, 0, 0].fill(7, 1) // [0,7,7] [1,2,3].findIndex(x => x == 2) // 1 ["a", "b", "c"].entries() // iterator [0, "a"], [1,"b"], [2,"c"] ["a", "b", "c"].keys() // iterator 0, 1, 2 ["a", "b", "c"].values(); // iterator "a", "b", "c" Object.assign(Point, { origin: new Point(0,0) })(14)Promises
Promises是处理异步操作的一种模式，之前在很多三方库中有实现，比如jQuery的deferred 对象。当你发起一个异步请求，并绑定了.when(), .done()等事件处理程序时，其实就是在应用promise模式。
//创建promisevar promise = new Promise(function(resolve, reject) { // 进行一些异步或耗时操作 if ( /*如果成功 */ ) { resolve("Stuff worked!"); } else { reject(Error("It broke")); }});//绑定处理程序promise.then(function(result) {//promise成功的话会执行这里 console.log(result); // "Stuff worked!"}, function(err) {//promise失败会执行这里 console.log(err); // Error: "It broke"});
转自：http://www.cnblogs.com/Wayou/p/es6_new_features.html
