ES6新特性简介

来源:互联网 发布:seo设置是什么意思 编辑:程序博客网 时间:2024/06/16 00:42

(1)箭头操作符:操作符左边为输入的参数,而右边则是进行的操作以及返回的值Inputs=>outputs。

var array = [1, 2, 3]; //ES6 array.forEach(v = > console.log(v));

(2)类的支持:引入了class关键字

//类的定义class Animal {    //ES6中新型构造器    constructor(name) {        this.name = name;    }    //实例方法    ……}//类的继承class Programmer extends Animal {    constructor(name) {        //直接调用父类构造器进行初始化        super(name);    }    //实例方法    ……}//测试我们的类var animal=new Animal(‘dummy‘),animal.sayName();//输出 ‘My name is dummy’

(3)增强的对象字面量:可以在对象字面量里面定义原型,定义方法可以不用function关键字,直接调用父类方法

//通过对象字面量创建对象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中允许使用反引号 ` 来创建字符串,此种方法创建的字符串里面可以包含由美元符号加花括号包裹的变量${vraible}

var num=5;var str=`your num is ${num}`//输出‘your num is 5’

(5)解构:自动解析数组或对象中的值。在ES6中,利用解构这一特性,可以直接返回一个数组,然后数组中的值会自动被解析到对应接收该值的变量中。

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)let与const 关键字:可以把let看成var,只是它定义的变量被限定在了特定范围内才能使用,而离开这个范围则无效。const则很直观,用来定义常量,即无法被更改值的变量

for (let i=0;i<2;i++)console.log(i);//输出: 0,1console.log(i);//输出:undefined,严格模式下会报错

(7)for of 值遍历:for in 循环用于遍历数组,类数组或对象,ES6中新引入的for of循环功能相似,不同的是每次循环它提供的不是序号而是值。

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

(8)模块:在ES6标准中,JavaScript原生支持module了。这种将JS代码分割成不同功能的小块进行模块化的概念是在一些三方规范中流行起来的,比如CommonJS和AMD模式。
将不同功能的代码分别写在不同文件中,各模块只需导出公共接口部分,然后通过模块的导入的方式可以在其他地方使用。

// 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);

(9)Map,Set 和 WeakMap,WeakSet:这些是新加的集合类型,提供了更加方便的获取属性值的方法,不用像以前一样用hasOwnProperty来检查某个属性是属于原型链上的呢还是当前对象的。同时,在进行属性值添加与获取时有专门的get,set 方法

// Setsvar s = new Set();s.add("hello").add("goodbye").add("hello");s.size === 2;s.has("hello") === true;// Mapsvar m = new Map();m.set("hello", 42);m.set(s, 34);m.get(s) == 34;

(10)Symbols:我们知道对象其实是键值对的集合,而键通常来说是字符串。而现在除了字符串外,我们还可以用symbol这种值来做为对象的键。Symbol是一种基本类型,像数字,字符串还有布尔一样,它不是一个对象。Symbol 通过调用symbol函数产生,它接收一个可选的名字参数,该函数返回的symbol是唯一的。之后就可以用这个返回值做为对象的键了。Symbol还可以用来创建私有属性,外部无法直接访问由symbol做为键的属性值。

(function() {  // 创建symbol  var key = Symbol("key");  function MyClass(privateData) {    this[key] = privateData;  }  MyClass.prototype = {    doStuff: function() {      ... this[key] ...    }  };})();var c = new MyClass("hello")c["key"] === undefined//无法访问该属性,因为是私有的

(11)Math,Number,String,Object 的新API
(12)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"});
0 0
原创粉丝点击