JavaScript ES6的关键特性

1. let 和 const

• let 允许你声明一个块作用域的局部变量，只在let声明所在的代码块内有效。

  for (let i = 0; i < 5; i++) {
    // i 只在循环内部有效
  }

• const 用于声明一个常量，其值在声明后不能被重新赋值。它也具有块级作用域。

• const PI = 3.14;
  // PI 值不能被重新赋值

  2. 箭头函数

• 箭头函数提供了一种更简洁的函数写法，并且它们不绑定自己的this值。

• const square = x => x * x;
  const sum = (a, b) => a + b;

  3. 模板字符串

  模板字符串允许你创建字符串，其中可以嵌入变量和表达式。

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

  4. 默认参数

  你可以为函数参数指定默认值，如果调用时没有提供该参数，则使用默认值。

• function greet(name, message = 'Hello') {
    console.log(`${message}, ${name}!`);
  }
  greet('Hello'); // 输出 "Hello Hello"

• 5. 解构赋值

  解构赋值允许你从数组或对象中提取数据并赋值给新的变量。

• const person = { name: 'Hello', age: 30 };
  const { name, age } = person;

  6. 展开运算符

  展开运算符允许一个数组表达式或字符串在需要多个参数（函数调用）或多个元素（数组字面量）或多个键值对（对象字面量）的地方展开。

• const numbers = [1, 2, 3];
  const moreNumbers = [...numbers, 4, 5];

  7. 模块

  ES6 引入了模块的概念，使得代码的组织和复用更加方便。

• // mathUtils.js
  export function add(x, y) {
    return x + y;
  }
  
  // app.js
  import { add } from './mathUtils.js';
  console.log(add(1, 2));

  8. 类

  ES6 引入了类的概念，使得面向对象编程更加直观。

• class Person {
    constructor(name, age) {
      this.name = name;
      this.age = age;
    }
  
    greet() {
      console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
    }
  }
  
  const kimi = new Person('Hello', 30);
  kimi.greet();

  9. 生成器和迭代器

  生成器允许你创建可以暂停和恢复的函数，而迭代器允许你遍历数据结构。

• function* idMaker() {
    let index = 0;
    while (true)
      yield index++;
  }
  
  const gen = idMaker();
  console.log(gen.next().value); // 0
  console.log(gen.next().value); // 1

  10. Promises

  Promises 提供了一种更好的异步编程模型，允许你处理异步操作的成功和失败。

• const promise = new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('Resolved!');
    }, 1000);
  });
  
  promise.then((value) => {
    console.log(value); // "Resolved!"
  });

  11. Symbol

  Symbol 是一种新的原始数据类型，用于创建唯一的属性名。

• const mySymbol = Symbol('mySymbol');
  const obj = {
    [mySymbol]: 'This is a unique property'
  };

  12. Map 和 Set

  Map 和 Set 是两种新的数据结构，提供了更高效的查找、添加和删除操作。

• const map = new Map();
  map.set('key', 'value');
  console.log(map.get('key')); // "value"
  
  const set = new Set();
  set.add('value');
  console.log(set.has('value')); // true

  13. Proxy 和 Reflect

  Proxy 允许你创建一个对象的代理，可以拦截并重新定义基本操作（如属性访问、赋值、枚举、函数调用等）。

• const handler = {
    get(target, property, receiver) {
      return property in target ? target[property] : 42;
    }
  };
  
  const proxy = new Proxy({}, handler);
  console.log(proxy.a); // 42

  14. 新的数组方法

  ES6 引入了许多新的数组方法，如Array.from(), Array.of(), find(), findIndex(), fill()等。

• const arrayFrom = Array.from({ length: 5 }, (v, k) => k + 1);
  console.log(arrayFrom); // [1, 2, 3, 4, 5]
  
  const arrayOf = Array.of(1, 2, 3);
  console.log(arrayOf); // [1, 2, 3]
  
  const array = [1, 2, 3, 4];
  const found = array.find(x => x > 2);
  console.log(found); // 3

  15. 新的数学方法

  ES6 引入了一些新的数学方法，如Math.trunc(), Math.sign(), Math.cbrt()等。

• console.log(Math.trunc(4.1)); // 4
  console.log(Math.sign(-5)); // -1
  console.log(Math.cbrt(8)); // 2

  16. 二进制和八进制字面量

  ES6 允许你使用前缀0b表示二进制数，使用前缀0o表示八进制数。

• const binary = 0b1010;
  const octal = 0o12;
  console.log(binary); // 10
  console.log(octal); // 10