ECMAScript（简称 ES）是一种通用脚本语言标准，它是由 Ecma 国际组织维护和发布的。JavaScript 就是这个标准的一种实现。ES6 是 ECMAScript 的第六个版本，ES11 是第十一个版本，他们都引入了一些新特性，让开发者们在编写 JavaScript 代码时更加方便、更加高效。这篇文章将会介绍这些新特性，以及它们的实际运用。
ES6
块级作用域变量（let/const）
ES6 引入了块级作用域变量 let 和 const，可以在块级作用域（大括号包围的区域）内声明变量，并且只在该块级作用域内有效。
-- ------ -
--- - - --
----- - - --
-
--------------- -- --------------- - -- --- -------
--------------- -- --------------- - -- --- -------箭头函数
箭头函数是一种更简洁的函数声明方式，可以让函数更加精简，同时也更加易读。
--- --- - --- -- -- - - -- ------------------ ---- -- -
类（class）
ES6 提供了用于创建对象的 class 关键字，class 可以更方便地定义一个对象，并且它也支持继承。
----- ------ -
----------------- -
--------- - -----
-
--------- -
-----------------------
-
-
----- --- ------- ------ -
----------------- ------ -
------------
---------- - ------
-
-
----- ----- - --- --------- ------
---------------- -- ----
------------------------- -- ----模板字符串
模板字符串是一种新的字符串表示方式，支持使用 ${} 语法来嵌入变量和表达式。
--- ---- - ------ --- ----- - ------- ---------- ------------------- -- ------- -----
解构赋值
解构赋值让我们可以方便地从对象或数组中提取值并赋值给变量。
--- --- - --- -- -- --- --- --- -- - ---- --------------- -- - --------------- -- - --- --- - --- -- --- --- --- -- -- - ---- --------------- -- - --------------- -- - --------------- -- -
ES7
指数运算符
ES7 引入了指数运算符 **，用于简化求幂运算。
------------- -- --- -- --- - - ---
Array.prototype.includes()
ES7 引入了一个数组方法 includes()，用于检查数组是否包含某个元素。
--- --- - --- -- --- ----------------------------- -- ---- ----------------------------- -- -----
ES8
异步函数
ES8 引入了异步函数 async/await，更好的解决了回调地狱的问题，让异步处理更为简单。
----- -------- --------- -
--- -------- - ----- --------------------------------------
--- ---- - ----- ----------------
------ -----
-
------------------- -- -------------------Object.values()/Object.entries()
ES8 提供两种方便的方法，可以让我们更方便地操作对象。
Object.values() 返回一个包含对象所有属性值的数组。
--- --- - --- -- -- -- -- --- --- ------ - ------------------- -------------------- -- --- -- --
Object.entries() 返回一个包含对象所有属性键值对的数组，每个元素是一个包含键值对的数组。
--- --- - --- -- -- -- -- --- --- ------- - -------------------- --------------------- -- ------ --- ----- --- ----- ---
ES9
异步迭代
ES9 引入了异步迭代器，让我们可以在异步操作中遍历数据。
----- -------- --------- -
--- -------- - ----- --------------------------------------
--- ---- - ----- ----------------
------ -----
-
----- -------- ------------ -
--- ---- - ----- ----------
--- ----- ---- ---- -- ----- -
------------------
-
-Promise.finally()
ES9 引入了 Promise 对象方法 finally()，无论 Promise 对象状态如何都会执行。
--- ------- - --- ----------------- ------- -- -
------------- -- -
----------------
-- ------
---
-------
------------ -- --------------------
------------ -- -------------------
----------- -- ------------------------ES10
扩展操作符（...）解决 new Array() 引起的问题
在旧版 JavaScript 中，使用 new Array(n) 创建一个长度为 n 的数组时，可能会产生一些问题。
--- --- - --- --------- ----------------- -- - - - - ------------------------ -- - -------------------- -- ---------
ES10 引入了扩展操作符 ... 可以快速地创建指定长度的数组，并且数组中所有值默认为 undefined。
--- --- - ------- ---------- ----------------- -- ----------- ---------- ---------- ------------------------ -- - -------------------- -- ---------
BigInt
ES10 引入了一种新的基本数据类型 BigInt，用于表示超出 JS 安全整数范围的整数。
--- --- - -------------------------------- --- --- - --- - ---------- ----------------- -- -----------------
ES11
可选链式调用
ES11 引入了可选链式调用操作符 ?.，可以在访问对象属性或方法时，自动判断属性或方法是否存在，解决了过多的判空操作。
--- --- - -
----- ------
---- ---
--------- -
------ ------ ------------- ---- -------------
-
--
--- ---- - -----------------
------------------ -- ------ ---- ---- ---
--- ---- - -----
--- ---- - -----------
------------------ -- ---------空值合并操作符
ES11 引入了空值合并操作符 ??，可以用来判断一个值是否为 null 或 undefined，如果是 null 或 undefined，则使用给定的默认值，否则返回该值本身。
--- ----- - ----- --- ----- - ------ ----------------- -- ----------- -- --------- ----------------- -- ----------- -- -----
结论
本文介绍了 ES6 到 ES11 所带来的一些新特性和语法，它们的引入让 JavaScript 变得更加便捷和高效。这些新特性并不是必须要使用的，但了解它们可以让我们更为深入地学习 JavaScript，同时也能够提高我们在实际开发中的工作效率。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6714798aad1e889fe213f953