ES6 新特性

• 类的支持

//类的定义
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...’

• 字面量

字面量表示如何表达这个值，一般除去表达式，给变量赋值时，等号右边都可以认为是字面量。
字面量分为字符串字面量(string literal )、数组字面量(array literal)和对象字面量(object literal)，另外还有函数字面量(function literal)。
示例：
var test="hello world!";
"hello world!"就是字符串字面量，test是变量名。

对象字面量被增强了，写法更加简洁与灵活，同时在定义对象的时候能够做的事情更多了。具体表现在：

• 可以在对象字面量里面定义原型
• 定义方法可以不用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...’

• 字符串模板

字符串模板相对简单易懂些。ES6中允许使用反引号 ` 来创建字符串，此种方法创建的字符串里面可以包含由美元符号加花括号包裹的变量${vraible}

//产生一个随机数
var num=Math.random();
//将这个数字输出到console
console.log(`your num is ${num}`);

• 解构

解构赋值允许你使用类似数组或对象字面量的语法将数组和对象的属性赋给各种变量。这种赋值语法极度简洁，同时还比传统的属性访问方法更为清晰

//以前我们获取对象数组的前三个数组的方法  

    var first = someArray[0];
    var second = someArray[1];
    var third = someArray[2];
//现在ES6
var [first, second, third] = someArray;

• 默认函数值，（在定义函数的时候，可以给定默认参数）

function sayHello(name){
	//传统的指定默认参数的方式
	var name=name||'dude';
	console.log('Hello '+name);
}
//运用ES6的默认参数
function sayHello2(name='dude'){
	console.log(`Hello ${name}`);
}
sayHello();//输出：Hello dude
sayHello('Wayou');//输出：Hello Wayou
sayHello2();//输出：Hello dude
sayHello2('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

   

• 拓展参数（... 传递数组为参数）

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 

• let 和 const

// let可以看做var,但是限定了作用范围


for (let i=0;i<2;i++)console.log(i);//输出: 0,1
console.log(i);//输出：undefined,严格模式下会报错
 //const 就是定义常量了

• for  of (循环提供的不是index而是 val)

• var someArray = [ "a", "b", "c" ];
   
  for (v of someArray) {
      console.log(v);//输出 a,b,c
  }

  module(不同功能的代码分别写在不同文件中，各模块只需导出公共接口部分，然后通过模块的导入的方式可以在其他地方使用)

• // point.js
  module "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);

  Map，Set 和 WeakMap，WeakSet

• // Sets
  var s = new Set();
  s.add("hello").add("goodbye").add("hello");
  s.size === 2;
  s.has("hello") === true;
  
  // Maps
  var m = new Map();
  m.set("hello", 42);
  m.set(s, 34);
  m.get(s) == 34;
  
  //如果怕内存泄漏，可以使用WeakMap,WeakSet
  // Weak Maps
  var wm = new WeakMap();
  wm.set(s, { extra: 42 });
  wm.size === undefined
  
  // Weak Sets
  var ws = new WeakSet();
  ws.add({ data: 42 });//因为添加到ws的这个临时对象没有其他变量引用它，所以ws不会保存它的值，也就是说这次添加其实没有意思

  JavaScript越来越强大了

转载于:https://my.oschina.net/u/1031097/blog/1525621