列举一下 ES6 中常用的新特性

以下是ES6中一些常用的新特性：

变量声明与解构赋值

• let和const：let声明的变量具有块级作用域，不存在变量提升，有效避免了变量覆盖等问题；const用于声明常量，一旦赋值后就不能再被修改，增强了代码的可维护性。

  {
       
  let x = 10;
  const PI = 3.14;
  x = 20;
  // PI = 3.1415; // 报错，常量不能重新赋值
  }
  

• 解构赋值：可以从数组或对象中提取值并赋值给多个变量，使代码更加简洁直观，提高了开发效率。

  // 数组解构
  const [a, b, c] = [1, 2, 3];
  // 对象解构
  const {
        name, age } = {
        name: 'Alice', age: 25 };
  

箭头函数

• 箭头函数提供了更简洁的函数表达式语法，并且它会继承外层作用域的this值，解决了传统函数中this指向容易出错的问题。

  const numbers = [1, 2, 3];
  const doubled = numbers.map(num => num * 2);
  

模板字符串

• 模板字符串使用反引号 (`) 来定义，支持在字符串中嵌入变量和表达式，使字符串拼接更加方便和易读。

const name = 'Bob';
const greeting = `Hello, ${
     name}!`;

类和继承

• ES6引入了更接近传统面向对象编程语言的类语法，使用class关键字定义类，通过extends关键字实现继承，让代码的组织结构更清晰，更易于理解和维护。

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

  speak() {
   
    console.log(`${
     this.name} makes a sound.`);
  }
}

class Dog extends Animal {
   
  speak() {
   
    console.log(`${
     this.name} barks.`);
  }
}

模块

• ES6的模块系统使用import和export关键字，方便地实现了代码的模块化组织和复用，提高了代码的可维护性和可扩展性。

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

// 导入模块
import {
    add } from './math.js';

Promise

• Promise用于处理异步操作，它将异步操作的结果状态和处理逻辑进行了统一的封装，避免了回调地狱，让异步代码的可读性和可维护性大大提高。

const promise = new Promise((resolve, reject) => {
   
  setTimeout(() => {
   
    const randomNum = Math.random();
    if (randomNum > 0.5) {
   
      resolve(randomNum);
    } else {
   
      reject(new Error('随机数小于0.5'));
    }
  }, 1000);
});

promise
 .then(result => console.log('成功:', result))
 .catch(error => console.log('失败:', error.message));

Set和Map数据结构

• Set：是一种无序且不包含重复元素的集合，可用于数组去重等操作。

  const set = new Set([1, 2, 3, 3, 4]);
  console.log([...set]); // [1, 2, 3, 4]
  

• Map：是键值对的集合，键可以是任意类型的值，与普通对象相比，在处理复杂的键值对数据时更加灵活方便。

  const map = new Map();
  map.set('name', 'Alice');
  map.set(1, 'one');
  console.log(map.get('name')); // Alice
  

迭代器和生成器

• 迭代器：为各种数据结构提供了统一的遍历方式，通过Symbol.iterator属性获取迭代器对象，然后使用next()方法逐个获取元素。

  const arr = [1, 2, 3];
  const iterator = arr[Symbol.iterator]();
  console.log(iterator.next()); // { value: 1, done: false }
  

• 生成器：是一种特殊的函数，通过yield关键字暂停和恢复执行，可按需生成一系列的值，常用于处理异步操作、迭代器生成等场景。

function* generateNumbers() {
   
  let n = 1;
  while (true) {
   
    yield n++;
  }
}

const generator = generateNumbers();
console.log(generator.next().value); // 1

这些ES6的常用新特性在现代JavaScript开发中被广泛应用，极大地提升了开发效率和代码质量。