前端面试必备 | ES6 篇（P1-30）
文章目录
- 请解释箭头函数和普通函数的区别。
- 解释ES6模块和CommonJS模块的区别。
- 如何使用let和const声明变量，与使用var的区别是什么？
- 解释解构赋值及其用途。
- ES6中引入的Promise是什么？请解释它的作用和使用方法。
- 请解释async/await的用途和工作原理。
- 解释什么是生成器函数（Generator function）及其用途。
- 解释ES6中的模板字符串及其用法。
- 解释ES6中的类和原型的关系。
- 解释ES6中的继承及其用法。
- 解释ES6中的Set和Map数据结构的用途。
- 解释ES6中的迭代器和迭代协议。
- 解释ES6中的Symbol类型及其用途。
- 解释ES6中的Proxy和Reflect的用途。
- 解释ES6中的模块导入和导出的用法。
- 解释ES6中的默认参数和剩余参数的用法。
- ES6中的Array扩展方法中的find、findIndex、filter、map、reduce等方法有什么作用？
- 如何使用ES6中的模块加载器（如webpack）进行模块打包和构建？
- 如何使用ES6中新的迭代方法遍历数组和对象？
- 如何使用ES6中的Map数据结构实现缓存功能？
- 如何使用ES6中的Symbol类型和Reflect实现对象的私有属性和方法？
- 如何使用ES6中的模板字符串实现多行文本输出和变量插值？
- ES6中的尾调用优化是什么？请举例说明。
- 如何使用ES6中的Promise解决回调地狱问题？
- 如何使用ES6中的解构赋值简化对象和数组的操作？
- 解释ES6中的默认导出和命名导出的区别及其用法。
- 如何使用ES6中的迭代器和生成器迭代无限序列？
- ES6中的尾递归优化是什么？请举例说明。
- 如何使用ES6中的Proxy进行对象的拦截和代理操作？
- 如何使用ES6中的模块化开发规范编写可复用的前端代码？
1. 请解释箭头函数和普通函数的区别。
箭头函数（Arrow Function）和普通函数（Regular Function）是JavaScript中不同的函数语法形式，它们之间有一些区别。
下面是它们的几个主要区别：
-
语法形式：箭头函数使用箭头（=>）来定义函数，而普通函数使用关键字function定义函数。
示例：
// 箭头函数 const arrowFunction = () => { // 函数体 }; // 普通函数 function regularFunction() { // 函数体 } -
this 的绑定：箭头函数没有自己的 this 值，它会继承父级作用域中的 this 值。而普通函数的 this 值则是在运行时动态绑定的，取决于函数的调用方式。
示例：
// 箭头函数 const arrowFunction = () => { console.log(this); // 继承父级作用域中的 this 值 }; // 普通函数 function regularFunction() { console.log(this); // 在运行时动态绑定的 this 值 } const obj = { method() { arrowFunction(); // 输出 obj regularFunction(); // 输出 obj.method } }; obj.method(); -
arguments 对象：箭头函数没有自己的 arguments 对象，因此无法直接访问传入函数的参数列表。普通函数中可以使用 arguments 对象来获取函数的参数列表。
示例：
// 箭头函数 const arrowFunction = () => { // 箭头函数没有 arguments 对象 }; // 普通函数 function regularFunction() { console.log(arguments); // 可以使用 arguments 对象 } regularFunction(1, 2, 3); // 输出 [1, 2, 3] -
构造函数：箭头函数不能用作构造函数，不能使用 new 关键字调用，因为它们没有自己的 this 值。而普通函数可以用作构造函数创建新的对象实例。
示例：
// 箭头函数不能用作构造函数 const arrowFunction = () => { // 函数体 }; // 普通函数可以用作构造函数 function RegularFunction() { // 函数体 } const obj1 = new RegularFunction(); // 创建新的对象实例 const obj2 = new arrowFunction(); // TypeError: arrowFunction is not a constructor
需要注意的是，箭头函数和普通函数在一些用法上有所差异，因此根据具体的使用场景选择合适的函数形式。
2. 解释ES6模块和CommonJS模块的区别。
ES6模块（ES6 Modules）和CommonJS模块（CommonJS Modules）是在JavaScript中用于模块化开发的两种不同的模块系统，它们之间存在一些区别。
下面是它们的几个主要区别：
-
语法形式：ES6模块使用
import和export关键字来导入和导出模块，而CommonJS模块使用require()函数来导入模块，使用module.exports对象来导出模块。示例：
// ES6模块 // 导入模块 import { foo } from './moduleA'; // 导出模块 export function bar() { // 函数体 } // CommonJS模块 // 导入模块 const { foo } = require('./moduleA'); // 导出模块 function bar() { // 函数体 } module.exports = { bar }; -
加载方式：ES6模块是在编译时加载的，而CommonJS模块是在运行时加载的。
ES6模块的导入和导出是通过静态分析，在代码加载前进行解析和处理，在编译时确定模块依赖关系。而CommonJS模块的导入和导出是动态的，在运行时根据
require()函数进行加载和解析。 -
引入方式：ES6模块使用绝对路径或相对路径引入模块，可以使用文件扩展名，如
.js、.mjs。而CommonJS模块可以使用相对路径引入模块，会自动查找同名的.js、.json、.node扩展名的文件。示例：
// ES6模块 import { foo } from './moduleA.js'; // CommonJS模块 const { foo } = require('./moduleA'); -
导入和导出的方式：ES6模块可以按需要导入或导出多个成员，可以使用命名导出和默认导出。而CommonJS模块只支持默认导出和导入整个模块。
示例：
// ES6模块 // 命名导出 export const foo = 'foo'; export function bar() { // 函数体 } // 默认导出 export default function() { // 函数体 } // CommonJS模块 // 默认导出 module.exports = function() { // 函数体 };
需要注意的是，ES6模块和CommonJS模块的兼容性和使用方式在不同的环境中可能有所不同。ES6模块通常用于现代浏览器和支持ES6的JavaScript引擎中，而CommonJS模块通常用于Node.js环境中。如果你正在开发一个项目，建议根据目标环境和应用需求选择合适的模块系统。
3. 如何使用let和const声明变量，与使用var的区别是什么？
使用let和const关键字来声明变量是在ES6（ECMAScript 2015）中引入的新特性，与使用var关键字声明变量有一些区别。
下面是它们的主要区别：
-
变量作用域：使用
let和const声明的变量具有块级作用域（Block Scope），而使用var声明的变量则具有函数作用域（Function Scope）。let和const声明的变量仅在声明的块内有效，块是指被花括号（{ }）包围的代码块。在块外部无法访问和引用这些变量。var声明的变量在函数体内部有效，函数体是指整个函数内部的范围，包括if语句、循环等。
示例：
// 使用let声明变量 function example() { if (true) { let x = 10; // 块级作用域内的变量 console.log(x); // 可以访问和引用 } console.log(x); // 报错，x在此处不可访问 } // 使用var声明变量 function example() { if (true) { var x = 10; // 函数作用域内的变量 console.log(x); // 可以访问和引用 } console.log(x); // 输出10，var声明的变量在函数体内有效 } -
变量提升：使用
let和const声明的变量不存在变量提升，必须在声明之后才能访问和引用。而使用var声明的变量存在变量提升，即在变量声明之前就可以访问和引用。- 使用
let和const声明的变量，在声明之前访问或引用会报错（暂时性死区，TDZ）。 - 使用
var声明的变量，在声明之前可以访问到变量，值为undefined。
示例：
console.log(x); // undefined var x = 10; console.log(y); // ReferenceError: Cannot access 'y' before initialization let y = 20; console.log(z); // ReferenceError: Cannot access 'z' before initialization const z = 30; - 使用
-
变量值的可变性：使用
let声明的变量的值是可变的（Mutable），而使用const声明的变量的值是不可变的（Immutable）。- 使用
let声明的变量可以重新赋值和修改其值。 - 使用
const声明的变量一旦赋值后，其值不能再被修改。
示例：
let x = 10; x = 20; // 可以重新赋值 console.log(x); // 输出20 const y = 30; y = 40; // TypeError: Assignment to constant variable. - 使用
需要根据具体的需求和场景选择适合的变量声明方式。通常推荐使用let声明可变的变量，使用const声明不可变的常量或只读变量，避免使用var声明变量。这样可以提供更好的封装性、可读性，并减少由于变量提升和作用域问题导致的错误。
下面是使用表格总结let、const和var的区别：
| 作用域范围 | 块级作用域 | 块级作用域 | 函数作用域 |
| 变量提升（Hoisting） | 不存在 | 不存在 | 存在 |
| 变量值的可变性 | 可变 | 不可变 | 可变 |
使用let和const声明的变量具有块级作用域，只在声明的块内有效。它们不存在变量提升，必须在声明之后才能访问和引用。let声明的变量的值是可变的，而const声明的变量的值是不可变的。
而使用var声明的变量具有函数作用域，在函数体内有效。var声明的变量存在变量提升，即可以在变量声明之前访问和引用。var声明的变量的值是可变的。
这些区别使得let和const相比于var更安全、更灵活，并且更符合现代JavaScript的开发实践。
4. 解释解构赋值及其用途。
解构赋值是一种在 JavaScript 中方便地从数组或对象中提取值并赋给变量的语法。
它允许你通过一种简洁的语法来快速访问和使用复杂数据结构中的特定值。
在 JavaScript 中，有两种常见类型的解构赋值：数组解构赋值和对象解构赋值。
- 数组解构赋值：
const arr = [1, 2, 3];
const [a, b, c] = arr;
console.log(a); // 输出 1
console.log(b); // 输出 2
console.log(c); // 输出 3
数组解构赋值通过方括号[]将要解构的变量放在左边，并根据数组中相应的位置将值赋给这些变量。它按照顺序提取数组元素，并将它们赋给对应的变量。数组解构赋值还支持默认值，可以在变量名称后使用等号=来指定默认值。
- 对象解构赋值：
const obj = { name: 'John', age: 25 };
const { name, age } = obj;
console.log(name); // 输出 'John'
console.log(age); // 输出 25
对象解构赋值使用花括号{}将要解构的变量放在左边，并根据对象的属性名称将对应的值赋给这些变量。对象解构赋值的变量名称需要与对象属性名相对应。对象解构赋值也可以使用默认值。
解构赋值的一些常见用途包括：
- 快速获取和使用数组和对象的特定值。
- 函数返回多个值时，可以使用解构赋值将这些值赋给多个变量。
- 交换变量的值，可以通过解构赋值的方式更简洁地实现。
- 从函数参数中提取特定的属性值。
通过解构赋值，你可以更简洁地处理和操作复杂的数据结构，提高代码的可读性和可维护性。它是 JavaScript 中一个强大且常用的特性。
5. ES6中引入的Promise是什么？请解释它的作用和使用方法。
ES6引入的Promise是一种用于处理异步操作的对象。它解决了传统的回调函数方式带来的嵌套和回调地狱问题，使异步操作的处理更加直观和可读。
Promise对象表示一个异步操作的最终完成（或失败）及其结果的表示。它有三个状态：pending（进行中）、fulfilled（已完成）和rejected（已失败）。一旦Promise状态从pending转变为fulfilled或rejected，就称为settled（已定型）。
使用Promise的好处是它提供了一种链式调用的方式，以处理多个异步操作。下面是Promise的使用方法：
- 创建一个
Promise对象：
const promise = new Promise((resolve, reject) => {
// 异步操作，比如发送网络请求或读取文件
// 如果操作成功，调用 resolve(value)
// 如果操作失败，调用 reject(error)
});
Promise构造函数接受一个执行器函数作为参数，该函数又接受两个参数resolve和reject。在执行器函数中，我们进行异步操作，并根据操作的成功或失败来调用resolve和reject。
- 处理异步操作的结果：
promise.then((value) => {
// 成功处理，获取异步操作的结果
}).catch((error) => {
// 失败处理，处理错误情况
});
通过调用then方法，可以指定在异步操作成功时的处理逻辑，并获取异步操作返回的结果。通过调用catch方法，可以指定在异步操作失败时的处理逻辑，并处理错误情况。
- 处理多个异步操作的串行调用：
promise
.then((result1) => {
// 处理第一个异步操作的结果
return anotherPromise;
})
.then((result2) => {
// 处理第二个异步操作的结果
return yetAnotherPromise;
})
.then((result3) => {
// 处理第三个异步操作的结果
})
.catch((error) => {
// 错误处理
});
通过链式调用的方式，可以按顺序处理多个异步操作的结果。每个then方法都返回一个新的Promise对象，从而实现了串行调用。
Promise还提供了其他方法，如Promise.all、Promise.race等，用于处理多个异步操作的并行调用或竞争。
总结来说，Promise是一种处理异步操作的方式，通过链式调用和状态管理，使代码更加易读且避免了回调地狱的问题。它提供了一种结构化的方式来处理和组织异步操作，使代码更具可维护性和可扩展性。
6. 请解释async/await的用途和工作原理。
async/await 是 ES8（ES2017）引入的一种用于处理异步操作的语法，它建立在 Promise 上，并提供了更简洁的方式来处理异步代码流程。
async/await 的用途是简化异步操作的编写和阅读，使异步代码看起来更像是同步代码，提高可读性和可维护性。
async 关键字用于表示一个函数是异步的，并且函数内部可以使用 await 关键字来等待一个异步操作完成。带有 async 关键字的函数会返回一个 Promise 对象。
await 关键字用于等待一个返回 Promise 的表达式执行完毕，并暂停当前函数的执行，直到异步操作完成并返回结果。在等待期间，await 会暂时释放函数的执行上下文，允许其他代码在此期间执行。
下面是一个使用 async/await 的示例：
async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
} catch (error) {
console.error(error);
}
}
在上面的示例中，fetchData 函数使用 async 关键字声明为异步函数。在函数体内部，我们使用 await 关键字等待 fetch 函数执行并返回结果。然后，我们使用 await 关键字等待 response.json() 的执行结果。这样的代码结构让我们可以以同步的方式编写异步代码。
async/await的工作原理如下：
- 当遇到
await关键字时，函数的执行会暂停，并返回一个未完成（pending）状态的Promise对象。 await后面的表达式（通常是一个返回Promise的异步操作）开始执行，直到该Promise对象完成（settled），要么变为成功（fulfilled）状态并返回结果，要么变为失败（rejected）状态并抛出错误。- 如果
await后面的Promise成功，await表达式会返回该 Promise 的结果。 - 如果
await后面的Promise失败，抛出的错误会被catch代码块捕获处理。 - 当
await表达式的结果返回后，函数的执行会继续，并且await表达式的返回值可以被赋给一个变量。
使用 async/await 可以使异步代码的编写和阅读更加简洁和直观。它在处理异步操作时提供了流程控制和错误处理的优雅方式，避免了回调函数或链式调用的混乱。然而，需要注意的是在使用 await 关键字时要在异步函数内部，否则会导致语法错误。
7. 解释什么是生成器函数（Generator function）及其用途。
生成器函数（Generator function）是一种特殊的函数，它可以在函数执行过程中暂停和恢复。它使用一种特殊的语法来定义函数，即在函数名前加上一个星号 *。
生成器函数可以通过 yield 关键字来定义一个或多个可以被暂停和恢复执行的点。每次调用生成器函数时，它都会返回一个称为生成器（Generator）的对象。通过调用生成器对象的 next() 方法，可以逐步执行生成器函数中的代码，并在每个 yield 关键字处暂停执行，并返回一个具有当前状态的对象。
生成器函数的用途之一是实现可迭代对象和迭代器。可迭代对象是指具有可以迭代的特性，比如数组、字符串和 Set 等。通过在生成器函数中使用 yield 关键字，可以逐个产生可迭代对象的元素，而无须一次性生成所有元素，从而节省内存和提高效率。
另一个用途是处理异步操作。生成器函数与 yield 结合使用可以实现异步操作的顺序控制。通过将异步操作封装在生成器函数中，并在适当的地方使用 yield 暂停执行，就可以在异步操作完成后再恢复生成器函数的执行。这种方式可以避免回调函数或复杂的异步处理逻辑，使异步代码看起来更像同步代码。
下面是一个使用生成器函数的示例：
function* generateSequence() {
yield 1;
yield 2;
yield 3;
}
const generator = generateSequence();
console.log(generator.next().value); // 输出：1
console.log(generator.next().value); // 输出：2
console.log(generator.next().value); // 输出：3
在上面的示例中，generateSequence 是一个生成器函数，它通过 yield 关键字定义了三个可以被暂停和恢复执行的点。通过调用 generateSequence() 将生成器函数转换为生成器对象，并使用 next() 方法逐步执行生成器函数的代码。每次调用 next() 方法时，会返回一个包含属性 value 的对象，该属性表示 yield 关键字返回的值。
生成器函数提供了一种灵活和强大的机制来控制代码的执行流程，并且在处理可迭代对象和异步操作时非常有用。它们可以使代码更加简洁、可读和易于维护。
8. 解释ES6中的模板字符串及其用法。
在ES6（ECMAScript 2015）中，模板字符串（Template Strings），也称为模板字面量（Template literals），是一种用于创建多行字符串和嵌入表达式的语法。
模板字符串的语法使用反引号（）括起来，其中可以包含普通文本和嵌入表达式的占位符。嵌入的表达式使用 ${}` 包裹，并在其中放置任意有效的 JavaScript 表达式。
模板字符串的用法包括以下方面：
-
创建多行字符串：传统的字符串只能写在一行上，而通过模板字符串，可以在多行上创建字符串，而无需手动添加换行符或字符串连接符。
const message = `多行 字符串`; console.log(message); // 输出： // 多行 // 字符串 -
嵌入表达式：通过
${}占位符，可以在模板字符串中嵌入任意 JavaScript 表达式，并将其结果作为字符串的一部分。const name = 'Alice'; const greeting = `Hello, ${name}!`; console.log(greeting); // 输出：Hello, Alice! -
表达式可以是任意有效的 JavaScript 表达式，可以包括变量、函数调用、计算等。
const a = 5; const b = 10; const result = `The sum of ${a} and ${b} is ${a + b}.`; console.log(result); // 输出：The sum of 5 and 10 is 15. -
原样输出特殊字符：模板字符串允许通过使用反斜杠（\）来转义特殊字符，使其原样输出。
const message = `转义字符：\n\t\"\'\\`; console.log(message); // 输出： // 转义字符： // "'\
模板字符串使得字符串的创建和处理更加简便和直观，尤其在需要处理多行字符串或嵌入复杂表达式时特别有用。它提供了一种更优雅和可读性更高的方式来拼接字符串，并且减少了大量的字符串连接和转义字符的操作。
9. 解释ES6中的类和原型的关系。
在ES6（ECMAScript 2015）中，引入了类（Class）的概念，以便于 JavaScript 开发者使用面向对象的编程方式。类提供了一种用于创建对象的模板，具有属性和方法的定义。然而，类在底层仍然基于原型（Prototype）。
类和原型之间存在紧密的关系，可以说类是原型的语法糖。在JavaScript中，对象是基于原型继承的，每个对象都有一个原型，它指向另一个对象。当访问对象的属性或方法时，JavaScript 引擎会首先在对象自身查找，如果找不到，就会沿着原型链（由原型对象组成的链表）继续查找。
现在，让我们来详细介绍类和原型之间的关系：
-
类的定义：在类中可以使用
class关键字定义一个类，并使用大驼峰命名法给类命名。类可以具有构造函数、实例方法、静态方法以及属性。类的构造函数由constructor方法定义，通过new关键字创建类的实例。class Person { constructor(name) { this.name = name; } sayHello() { console.log(`Hello, my name is ${this.name}.`); } static greet() { console.log('Hello!'); } } -
实例和原型：通过使用类创建的对象实例会自动具有原型。类中定义的实例方法和属性会被添加到实例自身，并且它们可以通过
this关键字访问。类的原型包含了类中定义的原型方法和属性，实例可以通过原型链访问这些方法和属性。const person = new Person('Alice'); person.sayHello(); // 输出：Hello, my name is Alice. -
原型链：每个实例都有一个原型对象，可以通过
__proto__属性访问它。类的原型对象也有自己的原型，这样就形成了一个原型链。在原型链上，可以沿着链条查找方法或属性，这样就实现了继承的概念。// 原型链示例 person.__proto__ === Person.prototype; Person.prototype.__proto__ === Object.prototype; Object.prototype.__proto__ === null;
类提供了一种更简洁和直观的方式来定义对象和对象之间的关系，而原型链则提供了继承和共享属性的机制。使用类可以更方便地创建对象，并且更容易理解和维护代码。底层仍然是基于原型，类只是对原型的一种封装和语法糖。
10. 解释ES6中的继承及其用法。
在ES6（ECMAScript 2015）中，继承是面向对象编程的重要概念之一。继承允许一个类（子类）从另一个类（父类）中继承属性和方法，使子类能够重用父类的功能并添加自己的特定功能。
在ES6中，可以使用 extends 关键字来实现类之间的继承关系。子类可以继承父类的属性和方法，同时可以添加自己的属性和方法，还可以覆盖或扩展父类的方法。
下面是继承的用法和相关概念的解释：
-
子类和父类的定义：使用
class关键字来定义子类和父类。子类通过extends关键字扩展父类。子类可以使用super关键字调用父类的构造函数和方法。class Animal { constructor(name) { this.name = name; } sayName() { console.log(`My name is ${this.name}.`); } } class Dog extends Animal { constructor(name, breed) { super(name); // 调用父类的构造函数 this.breed = breed; } bark() { console.log('Woof!'); } } -
继承属性和方法：子类会继承父类的属性和方法。子类实例化后，即拥有父类和子类的属性和方法。
const dog = new Dog('Buddy', 'Labrador'); dog.sayName(); // 输出：My name is Buddy. dog.bark(); // 输出：Woof! -
方法的覆盖和扩展：子类可以覆盖父类的方法，即提供自己的实现。在子类方法中，可以使用
super关键字调用父类的同名方法。class Cat extends Animal { sayName() { super.sayName(); // 调用父类的同名方法 console.log('I am a cat.'); } } const cat = new Cat('Whiskers'); cat.sayName(); // 输出： // My name is Whiskers. // I am a cat. -
instanceof 运算符：可以使用
instanceof运算符来检查一个实例是否属于某个类或其父类。console.log(dog instanceof Dog); // 输出：true console.log(dog instanceof Animal); // 输出：true
继承使得代码更模块化、可重用和易于扩展。它提供了一种组织和管理对象之间关系的方法，并支持多态性。通过继承，可以通过调用基类的方法来实现代码的重用，并在子类中添加特定的行为。这样可以大大减少代码的冗余，并使代码更加灵活和易于维护。
11. 解释ES6中的Set和Map数据结构的用途。
在ES6（ECMAScript 2015）中，引入了 Set 和 Map 数据结构，它们是 JavaScript 中的两种新的数据类型。Set 和 Map 提供了更灵活和高效的数据存储和操作方式，适用于处理不重复的值集合和键值对集合。
下面是 Set 和 Map 数据结构的用途的解释：
1. Set（集合）数据结构：
- 不重复的值集合：Set 中的值都是唯一的，不会重复。可以用于去除数组中的重复元素，或者判断一个值是否出现过。
- 成员检查：可以使用 Set 的方法判断一个值是否存在于集合中，提供了更方便和高效的成员检查方式。
- 迭代和遍历：可以轻松地迭代和遍历 Set 中的值，支持使用 for...of 循环以及 forEach 方法遍历集合。
const set = new Set();
set.add(1);
set.add(2);
set.add(3);
set.add(2); // 重复元素不会被添加
console.log(set.size); // 输出：3
console.log(set.has(2)); // 输出：true
for (const value of set) {
console.log(value);
}
// 输出：
// 1
// 2
// 3
2. Map（映射）数据结构：
- 键值对集合：Map 中的元素是以键值对的形式存储的，可以用于存储和操作键值对集合。
- 快速查找和删除：可以通过键快速查找和删除对应的值，效率比对象更高。
- 成员迭代：可以迭代遍历 Map 中的键值对，支持使用 for...of 循环以及 forEach 方法遍历 Map。
const map = new Map();
map.set('name', 'Alice');
map.set('age', 30);
map.set('city', 'London');
console.log(map.size); // 输出：3
console.log(map.get('name')); // 输出：Alice
map.forEach((value, key) => {
console.log(`${key}: ${value}`);
});
// 输出：
// name: Alice
// age: 30
// city: London
Set 和 Map 提供了更高效和便捷的数据操作和存储方式，相对于传统的数组和对象来说，在特定的场景下可以提供更好的性能和开发体验。
它们可以用于数据去重、集合运算、存储关联数据、快速查找和删除等各种应用场景。如果你需要处理不重复的值集合或键值对集合，并且需要高效地对其进行操作，那么 Set 和 Map 是非常有用的数据结构选择。
12. 解释ES6中的迭代器和迭代协议。
在ES6（ECMAScript 2015）中，迭代器（Iterator）和迭代协议（Iteration Protocol）是用于定义和实现可迭代对象遍历的机制。
迭代器提供了一种统一的方式来访问集合中的元素，
剩余60%内容，订阅专栏后可继续查看/也可单篇购买
前端面试必备知识点：HTML和CSS、JS(变量/数据类型/操作符/条件语句/循环;面向对象编程/函数/闭包/异步编程/ES6)、DOM操作、HTTP和网络请求、前端框架、前端工具和构建流程、浏览器和性能优化、跨浏览器兼容性、前端安全、数据结构和算法、移动端开发技术、响应式设计、测试和调试技巧、性能监测等。准备面试时，建议阅读相关的技术书籍、参与项目实践、刷题和练习，以深化和巩固你的知识。
