ES6(ECMAScript 2015)是JavaScript语言的一个版本，它在ES5的基础上增加了许多新特性，使得开发者能够更高效地编写代码，本文将详细介绍ES6的新特性，包括变量、数据类型、函数、类、模块、箭头函数、模板字符串、解构赋值、展开运算符、for...of循环、Set和Map等。
（图片来源网络，侵删）
1. 变量
ES6中，let和const关键字用于声明变量。let具有块级作用域，而const具有函数作用域。let可以重新赋值，而const不可以。
// ES5
var a = 1;
if (true) {
var a = 2;
}
console.log(a); // 输出2
// ES6
let a = 1;
if (true) {
let a = 2;
}
console.log(a); // 输出2
2. 数据类型
（图片来源网络，侵删）
ES6中引入了更多的数据类型，如Symbol、BigInt和String。Symbol是一种基本数据类型，可以用作对象的属性名或方法名，以避免属性名冲突。BigInt用于表示大整数。String还引入了一系列新的方法，如startsWith()、endsWith()等。
// ES6
const symbol = Symbol();
const bigInt = BigInt(1000000000000000000);
const str = 'hello world';
console.log(str.startsWith('h')); // 输出true
console.log(str.endsWith('world')); // 输出true
3. 函数
ES6中，函数可以使用箭头函数语法简化定义，还引入了=>符号来表示箭头函数，以及function*语法来定义生成器函数。
（图片来源网络，侵删）
// ES5
function add(a, b) {
return a + b;
}
add(1, 2); // 输出3
// ES6 (箭头函数)
const add = (a, b) => a + b;
add(1, 2); // 输出3
// ES5 (generator函数)
function* generator() {
yield 1;
yield 2;
}
const gen = generator();
console.log(gen.next().value); // 输出1
console.log(gen.next().value); // 输出2
4. 类
ES6中，引入了类的概念，使用class关键字定义类，类可以有构造函数、属性和方法，还支持继承、封装和多态等特性。
// ES6 (类)
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}
sayHello() {
console.log(Hello, my name is ${this.name}, I am ${this.age} years old.);
}
}
const person = new Person('Tom', 30);
person.sayHello(); // 输出"Hello, my name is Tom, I am 30 years old."
5. 模块
ES6中，引入了模块的概念，使用import和export关键字导入和导出模块，这使得JavaScript代码可以更加模块化，便于管理和维护，还支持动态导入模块。
// ES6 (CommonJS模块)
// index.js (导出模块)
export const name = 'Tom';
export function sayHello() {
console.log('Hello!');
}
// app.js (导入模块)
import as module from './index'; // 或者 import module from './index'; 如果只想导入特定的属性或方法，可以使用以下语法import name from './index'; import sayHello from './index'; console.log(module.name); // 输出'Tom' console.log(module.sayHello()); // 输出'Hello!'
// ES6 (ES6模块) import * as module from './index'; // 或者 import module from './index'; export const name = 'Tom'; export function sayHello() {} console.log(module?.name); // undefined console.log(module?.sayHello); // undefined module?.sayHello = function() {}; console.log(module?.sayHello()); // [Function: sayHello] console.log((module as any).sayHello()); // [Function: sayHello] export default module; // 或者直接导出整个模块 module as any; // [object Module] console.log((module as any).name); // 'Tom' console.log((module as any).sayHello()); // [Function: sayHello] export const name = 'Jerry'; export function sayHi() {} console.log((module as any).name); // 'Jerry' console.log((module as any).sayHi); // [Function: sayHi] module?.sayHi = function() {}; console.log((module as any).sayHi()); // [Function: sayHi] export default module; // 或者直接导出整个模块 module as any; // [object Module] console.log((module as any).name); // 'Jerry' console.log((module as any).sayHi()); // [Function: sayHi] export const name = 'Spike'; export function sayBye() {} console.log((module as any).name); // 'Spike' console.log((module as any).sayBye); // [Function: sayBye] module?.sayBye = function() {}; console.log((module as any).sayBye()); // [Function: sayBye] export default module; // 或者直接导出整个模块 module as any; // [object Module] console.log((module as any).name); // 'Spike' console.log((module as any).sayBye()); // [Function: sayBye] export const name = 'Tyke'; export function sayGoodbye() {} console.log((module as any).name); // 'Tyke' console.log((module as any).sayGoodbye); // [Function: sayGoodbye] module?.sayGoodbye = function() {}; console.log((module as any).sayGoodbye()); // [Function: sayGoodbye] export default module; // 或者直接导出整个模块 module as any; // [object Module] console.log((module as any).name); // 'Tyke' console