ES6新特性【介绍比较常用的部分】

来源:互联网 发布:wifi限制网速软件 编辑:程序博客网 时间:2024/05/16 07:25

比较常用的新特性

  • 箭头操作符 :⇒ 简化代码编写方式、方便写回调、this指针问题

  • 类的支持:引入了class关键字(其实class在JavaScript中一直是保留字,目的就是考虑到可能在以后的新版本中会用到,现在终于派上用场了)。JS本身就是面向对象的,ES6中提供的类实际上只是JS原型模式的包装。现在提供原生的class支持后,对象的创建,继承更加直观了,并且父类方法的调用,实例化,静态方法和构造函数等概念都更加形象化。

  • 解构:自动解析数组或对象中的值。比如若一个函数要返回多个值,常规的做法是返回一个对象,将每个值做为这个对象的属性返回。但在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
  • 默认参数值:现在可以在定义函数的时候指定参数的默认值了,而不用像以前那样通过逻辑或操作符来达到目的了
function sayHello2(name='dude'){    console.log(`Hello ${name}`);}
  • 不定参数:和java类似function add(…x)

  • let与const 关键字

  • for of 值遍历

  • 模块:在ES6标准中,JavaScript原生支持module了。这种将JS代码分割成不同功能的小块进行模块化的概念是在一些三方规范中流行起来的,比如CommonJS和AMD模式。

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

  • 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 = Proxy(engineer, interceptor);// 做一些改动来触发代理engineer.salary = 60;//控制台输出:salary is changed to 60
  • 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"});// 后面如果你用到async和await来拉开回调嵌套问题。那么success和faild可以用try catch来解决。
0 0
原创粉丝点击