1.了解ES6吗？ES6有哪些特性？

书诚小驿2025/02/25前端面经Javascript

ES6，也称为 ECMAScript 2015，是 JavaScript 语言的第六版，带来了许多新特性和改进。,这些 ES6 特性大大增强了 JavaScript 的功能和可读性，使得开发者可以更高效地编写代码。

提示

DETAILS

块级作用域声明 (let 和 const)
箭头函数 (=>)
模板字符串
解构赋值和展开运算符(...)
类 (Class)
模块化 (Modules)
Symbol
Promise

答案

DETAILS

一、块级作用域声明 (let 和 const)

let: 声明一个块级作用域的变量，避免了使用 var 声明变量时的作用域问题。
const: 声明一个块级作用域的常量，声明后不能重新赋值。在使用 var 声明变量时，变量的作用域是函数级或全局级的，而不是块级的。这意味着在代码块（如 if 语句或 for 循环）内声明的变量，在块外依然可以访问。这可能会导致意想不到的行为。

二、箭头函数 (=>)

箭头函数 (=>),提供了一种更简洁的函数定义方式，箭头函数继承外层作用域的 this，而非动态绑定。

箭头函数简化

// 传统函数
var add = function (a, b) {
  return a + b;
};
// 箭头函数简化
const add = (a, b) => a + b;

没有自己的 this

箭头函数继承外层作用域的 this，而非动态绑定。适合用于需要固定 this 的场景（如回调函数）

const obj = {
  name: "Alice",
  sayName: function () {
    // 传统函数中的 this 指向 obj
    console.log(this.name); // 输出 "Alice" ✅
    setTimeout(() => {
      // 箭头函数继承外层 sayName 的 this
      console.log(this.name); // 输出 "Alice" ✅
    }, 100);
    // 若改用传统函数作为回调：
    setTimeout(function () {
      console.log(this.name); // 输出 undefined ❌
    }, 100);
  },
};

obj.sayName();

没有 arguments 对象

箭头函数没有自己的 arguments 对象，而是继承外层函数的 arguments 对象。

// 功能：在函数定义时，用 ...参数名 表示“收集所有剩余参数为一个数组”。
// 位置限制：必须是函数参数列表的 最后一个参数。
const showArgs = (...args) => console.log(args);
showArgs(1, 2); // 输出 [1, 2]

不能作为构造函数

箭头函数没有 prototype 属性，无法用 new 调用

const Person = () => {};
new Person(); // 报错：Person is not a constructor

避免在对象方法中使用箭头函数

const obj = {
  value: 42,
  getValue: () => this.value, // 错误！此时 this 指向全局对象（如 window）
};

无法通过 call/apply/bind 修改 this

const func = () => console.log(this); //Window
func.call({ a: 1 }); // this 仍然指向外层作用域

三、模板字符串

模板字符串,使用反引号(`)定义，可以嵌入变量和表达式，支持多行字符串。

四、解构赋值和展开运算符(...)

允许从数组或对象中提取数据，赋值给变量。可以在数组和对象中使用，用于拷贝或合并。

五、类 (Class)

引入了类的语法糖，使得定义类和继承更加直观。

六、模块化 (Modules)

使用 import 和 export 关键字，实现模块化开发。

七、Symbol

一种新的原始数据类型，用来创建唯一的标识符。

八、Promise

提供了一种更好的方式来处理异步操作。

1.了解ES6吗？ES6有哪些特性？

目录