22
2020
05

你能解释一下 ES5 和 ES6 之间的区别吗?

ECMAScript 5(ES5):ECMAScript 的第 5 版,于 2009 年标准化。这个标准已在所有现代浏览器中完全实现。

ECMAScript 6(ES6)或 ECMAScript 2015(ES2015):第 6 版 ECMAScript,于 2015 年标准化。这个标准已在大多数现代浏览器中部分实现。

以下是 ES5 和 ES6 之间的一些主要区别:


箭头函数和字符串插值:


const greetings = (name) => {

 return `hello ${name}`;

}

const greetings = name => `hello ${name}`;

常量


常量在很多方面与其他语言中的常量一样,但有一些需要注意的地方。常量表示对值的“固定引用”。因此,在使用常量时,你实际上可以改变变量所引用的对象的属性,但无法改变引用本身。


const NAMES = [];

NAMES.push("Jim");

console.log(NAMES.length === 1); // true

NAMES = ["Steve", "John"]; // error

块作用域变量。


新的 ES6 关键字 let 允许开发人员声明块级别作用域的变量。let 不像 var 那样可以进行提升。


默认参数值


默认参数允许我们使用默认值初始化函数。如果省略或未定义参数,则使用默认值,也就是说 null 是有效值。


// 基本语法

function multiply (a, b = 2) {

 return a * b;

}

multiply(5); // 10

类定义和继承


ES6 引入了对类(关键字 class)、构造函数(关键字 constructor)和用于继承的 extend 关键字的支持。


for…of 操作符


for…of 语句将创建一个遍历可迭代对象的循环。


用于对象合并的 Spread 操作


const obj1 = { a: 1, b: 2 }

const obj2 = { a: 2, c: 3, d: 4}

const obj3 = {...obj1, ...obj2}

promise


promise 提供了一种机制来处理异步操作结果。你可以使用回调来达到同样的目的,但是 promise 通过方法链接和简洁的错误处理带来了更高的可读性。


const isGreater = (a, b) => {

return new Promise ((resolve, reject) => {

 if(a > b) {

 resolve(true)

 } else {

 reject(false)

 }

 })

}

isGreater(1, 2)

.then(result => {

 console.log('greater')

})

.catch(result => {

 console.log('smaller')

})

模块导出和导入


const myModule = { x: 1, y: () => { console.log('This is ES5') }}

export default myModule;

import myModule from './myModule';

« 上一篇 下一篇 »

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。