JavaScript 是一门非常流行的脚本语言，用于开发 Web 应用程序。随着技术的不断发展，JavaScript 也在不断更新迭代，其语言特性也在不断演进。本文主要介绍 JavaScript 从 ES6 到 ES12 的特性变迁。
ES6
ECMAScript 6.0（简称 ES6）是 JavaScript 语言的一个重大升级。这个版本引入了很多新的语言特性，以下是其中比较重要的一些：
let 和 const 声明
ES6 引入了 let 和 const 两个新的变量声明关键字。let 声明的变量是块级作用域的，const 声明的变量是常量，其值不能被修改。
let a = 10; const b = 20;
解构赋值
ES6 允许使用解构赋值的方式获取数组或对象中的某些元素。
// 数组解构赋值
const [x, y] = [1, 2];
// 对象解构赋值
const user = { name: 'John', age: 30 };
const { name, age } = user;箭头函数
ES6 引入了箭头函数，它能够更简洁地声明函数。
const sum = (a, b) => a + b;
模板字符串
ES6 允许使用模板字符串的方式创建带有变量或表达式的字符串。
const name = 'John';
const str = `My name is ${name}`;Promise
ES6 引入了 Promise，它是一种用于处理异步操作的机制。
-- -------------------- ---- -------
----- --------- - -- -- -
------ --- ----------------- ------- -- -
------------- -- -
-------------- --------
-- ------
---
--
----------------------- -- -------------------ES7 到 ES11
在接下来的几个版本中，JavaScript 各种新特性层出不穷。以下是 ES7 到 ES11 中比较重要的一些新特性：
ES7
- 数组 includes 方法：用来判断一个数组是否包含某个元素。
- 幂运算符：用来计算一个数的幂运算。
const arr = [1, 2, 3]; arr.includes(2); // true const pow = 2 ** 3;
ES8
- 异步函数 async/await：用于更方便地处理异步操作。
const fetchData = async () => {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
return data;
};
fetchData().then((data) => console.log(data));ES9
- Rest/Spread 属性：用于将数组或对象展开成单独的元素，或将多个元素合并成一个数组或对象。
-- -------------------- ---- ------- -- ------ ----------- ----- --- - - ----- ------- ---- --- ------- ------ -- ----- - ---- ------- - - ---- ----- ------ - - -------- --------- ---- ----- -- -- ----- ----------- ----- ---- - --- -- --- ----- ---- - --- -- --- ----- ---- - --------- ---------
ES10
- Array flat 和 flatMap：用于将多维数组展平成一维数组。
- String 的 trimStart 和 trimEnd 方法：用于去掉字符串开头和结尾的空格。
const arr = [1, [2, [3, [4]]]]; const flatArr = arr.flat(); // [1, 2, 3, [4]] const str = ' Hello World '; const trimmedStr = str.trimEnd(); // ' Hello World'
ES11
- Nullish Coalescing 运算符：用于判断变量是否为 null 或 undefined，并提供默认值。
- Optional Chaining 运算符：用于安全地访问对象的属性或方法。
const name = null ?? 'John'; // 'John'
const obj = { name: 'John', address: { city: 'New York' } };
const city = obj?.address?.city; // 'New York'ES12
ES12（ES2021）是 JavaScript 的最新版本，引入了一些新的语言特性：
Promise.any
Promise.any 方法返回一组 Promise 中第一个 Fulfilled（已完成）的 Promise 的值。
const promise1 = Promise.reject('error');
const promise2 = Promise.resolve('success');
const promise3 = Promise.resolve('another success');
Promise.any([promise1, promise2, promise3])
.then((value) => console.log(value))
.catch((error) => console.error(error)); // 'success'WeakRef 和 FinalizationRegistry
WeakRef 和 FinalizationRegistry 是用于支持 JavaScript 的垃圾回收机制的特性，它们可以帮助开发人员更好地管理内存。
-- -------------------- ---- ------- ----- --- - - ----- ----- ----- -- ----- --- - --- ------------- ----- -------- - --- -------------------------- -- - -------------------- ----------- ----- -- -------- ---------- --- ---------------------- ------- --- - ----- -- --- ---- ----- -------------- ----------------------- -- -------------
总结
JavaScript 的语言特性变迁不断更新迭代，开发人员需要学习和掌握这些新特性，以便更好地开发出高性能、高质量的 Web 应用程序。在本文中，我们介绍了 JavaScript 从 ES6 到 ES12 中比较重要的语言特性和示例代码，希望对读者有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6465c9ba968c7c53b0672d07