Javascript 的ES5、ES6更新重要新特性整理

前言

ES5发布于2009，ES6于2015，从2015开始使用年份命名，ES6即是ECMAScript 2015，目前大部分浏览器都已经支持ES6了，除了IE。

    

ES5

1、 严格模式（use strict）

这种模式，使得JavaScript在更严格的语法条件下运行：

(1)变量必须使用var声明；

(2)禁止自定义的函数中的this指向window

(3)创建 eval 作用域即为块级作用域

(4)对象不能有重名的属性

use strict可以在脚本或者函数开头声明，分别具有全局和函数作用域。

2、 增加JSON对象

JSON.stringify(obj/arr);

JSON.parse(json);

3、 扩展了数组Array的方法

Array.isArray()            方法检查对象是否为数组
Array.forEach(funName)     每个数组元素调用一次函数
Array.map(funName)         遍历数组返回一个新数组，返回加工后的值
Array.filter(funName)      遍历过滤出一个新的子数组，返回条件为true的值
Array.reduce(funName)      按funName方法处理数组，最后返回一个值，funName有两个参数，第一个是最后返回的归并值，第二个是元素
Array.reduceRight(funName) 同上，只是从最后一个数据开始计算
Array.every(funName)       遍历数组，检查是否每一个值都符合条件，返回bool    
Array.some(funName)        遍历数组，检查是存在至少一个值符合条件，返回bool
Array.indexOf(value)       检索数组中的某个元素值并返回其位置,多个则返回第一个
Array.lastIndexOf(value)   同上，只是从最后开始检索

4、 对象增加属性 Getter 和 Setter

允许使用类似于获取或设置属性的语法来定义对象方法

// 创建对象：
var person = {
  firstName: "Bill",
  lastName : "Gates",
  get fullName() {
    return this.firstName + " " + this.lastName;
  }
};
//获取对象
person. fullName

 

5、 函数扩展Function.prototype.bind(obj)

可将函数内的this绑定为obj，并将函数返回；

 

ES6

1、 变量声明关键字let、const

let 是在代码块内有效，var 是在全局范围内有效；

let 只能声明一次，var 可以声明多次；

let 不存在变量提升，var 会变量提升:

const 用来声明常量

2、 许函数参数设置默认值

function testAdd(x, y = 10) {
  // 当y不给值或者为undefined时值取10
  return x + y;
}

3、 箭头函数（Arrow Function）

类似于匿名函数，但没有自己的 this，不适合定义对象方法；

如果只是单个语句，则可省略掉return和花括号(但保留一般更好一些)

    例：z = (x, y) => { return x * y };

4、 class 关键字定义类

class 的本质是 function，它可以看作一个语法糖，让对象原型的写法更加清晰、更像面向对象编程的语法；

(1) 声明

class Example {
    constructor(a) {
        this.a = a;
    }
}

(2) 实例化

let exam1 = Example(1);

(3) 修饰器decorator

类比java的注解，是一个函数，用来修改类的行为，在代码编译时产生作用

(4) 其他

类可以继承，使用extends;

constructor 方法是类的默认方法，创建类的实例化对象时被调用;

类定义不会被提升，必须在访问前对类进行定义;

类中方法不需要 function 关键字,类似于java；

Class 内部只有静态方法，没有静态属性；

ES6 引入了模块化，分export与import,模块自动开启了严格模式；

Promise 对象用于异步编程； 

5、 解构赋值

是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值

示例：

数组

数组
let [a, b, c] = [1, 2, 3];  //a,b,c变量值同时赋予了；
let [a, , b] = [1, 2, 3];
let [a = 1, b] = [];  //不完全解构，a = 1, b = undefined
let [a, ...b] = [1, 2, 3];  //剩余运算符,a=1, b=[2,3]
（字符串是数组）
对象
let {a, b} = {a : 1, b : 2};  //a=1,b=2
let {a : b} = {a : 1};  //b=1
let {a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40};//rest = {c: 30, d: 40}

 

其他：

扩展了Array方法、对象

代理Proxy对象

function f(...values)可为函数设置不确定个数参数 ，values为最后所有参数的集合

增加for...of循环，用于替代 for..in 和 forEach()