ES6新增特性

65. ES6新增特性

1. let和const声明

let和const是用于声明变量的新关键字。let声明的变量是块级作用域的，而const声明的变量是常量，一旦被赋值就不能再被修改。
示例代码：

// let声明
let x = 10;
if (true) {
  let x = 20;
  console.log(x); // 输出20
}
console.log(x); // 输出10

// const声明
const PI = 3.1415;
PI = 3.14; // 报错，常量不能被修改

2. 箭头函数

箭头函数是一种新的函数声明方式，可以简化函数声明的语法。它们的this绑定规则与普通函数不同，这意味着它们可以轻松地访问外部作用域的变量。
示例代码：

// 普通函数
function add(a, b) {
  return a + b;
}

// 箭头函数
const add = (a, b) => a + b;

3. 模板字符串

模板字符串是一种新的字符串声明方式，可以通过变量插值来方便地构建字符串。它还支持多行字符串和字符串插值功能。
示例代码：

const name = "张三";
const age = 18;
const intro = `我的名字是${name}，今年${age}岁`;
console.log(intro); // 输出 "我的名字是张三，今年18岁"

4. 解构赋值

解构赋值是一种新的变量赋值方式，它可以将数组或对象的属性解构为独立变量。这使得从数组或对象中获取数据变得更加容易。
示例代码：

// 数组解构赋值
const [x, y] = [1, 2];
console.log(x); // 输出1
console.log(y); // 输出2

// 对象解构赋值
const person = { name: "张三", age: 18 };
const { name, age } = person;
console.log(name); // 输出"张三"
console.log(age); // 输出18

5. 块级作用域

ES6引入了块级作用域，可以使用let和const关键字声明块级作用域变量。这使得代码更容易理解和维护，并且可以避免变量名冲突问题。
示例代码：

// 块级作用域变量
{
  let x = 10;
  const PI = 3.1415;
}
console.log(x); // 报错，x未定义
console.log(PI); // 报错，PI未定义

6. Promise对象

Promise是一种用于异步编程的新的原生JavaScript对象。它可以代表一个异步操作的最终完成或失败，并提供了处理异步操作结果的一些方法。
示例代码：

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    const random = Math.random();
    if (random > 0.5) {
      resolve("操作成功");
    } else {
      reject("操作失败");
    }
  }, 1000);
});

promise.then((result) => {
  console.log(result); // 输出 "操作成功"
}).catch((error) => {
  console.log(error); // 输出 "操作失败"
});

7. ES6引入了class和extends关键字，使得面向对象编程更加容易

类提供了一种更自然的声明对象的方式，并且支持继承和多态等面向对象编程的特性。
示例代码：

class Animal {
  constructor(name) {
    this.name = name;
  }

  say() {
    console.log(`我是${this.name}`);
  }
}

class Dog extends Animal {
  constructor(name, age) {
    super(name);
    this.age = age;
  }

  bark() {
    console.log("汪汪汪");
  }
}

const dog = new Dog("小黑", 2);
dog.say(); // 输出 "我是小黑"
dog.bark(); // 输出 "汪汪汪"

8. 模块化

ES6引入了新的模块化语法，可以使JavaScript代码更加模块化和易于维护。它提供了import和export关键字，用于导入和导出模块。示例代码：

// 导出模块
export const add = (a, b) => a + b;
export const PI = 3.1415;

// 导入模块
import { add, PI } from "./math.js";
console.log(add(1, 2)); // 输出 3
console.log(PI); // 输出 3.1415