每一个 JavaScript 程序猿都务必了解闭包是什么。在 JavaScript 招聘面试中，你很可能会被问起闭包的定义。
下列是 7 个相关 JavaScript 闭包的面试问题，较为有趣味性。
不必查看答案或运行代码，看一下自身的水准究竟怎样。做了这种题大概必须三十分钟上下。
1. 热身运动
有下列涵数 clickHandler，immediate和delayedReload：
- let countClicks = 0;
- button.addEventListener('click', function clickHandler() {
- countClicks ;
- });
- const result = (function immediate(number) {
- const message = `number is: ${number}`;
- return message;
- })(100);
- setTimeout(function delayedReload() {
- location.reload();
- }, 1000);
这3个涵数中哪一个可以浏览外界范畴自变量?
回答：
2. 遗失的主要参数
下述编码輸出哪些：
- (function immediateA(a) {
- return (function immediateB(b) {
- console.log(a); // => ?
- })(1);
- })(0);
回答：
3. 谁是谁
下边的编码可能輸出哪些內容?
- let count = 0;
- (function immediate() {
- if (count === 0) {
- let count = 1;
- console.log(count); // 輸出哪些？
- }
- console.log(count); // 輸出哪些？
- })();
回答：
可是，在标准内，另一个 let count = 1 申明了局部变量 count，该自变量遮盖了作用域以外的 count。第一个 console.log(count) 輸出 1。
第二个 console.log(count) 輸出为 0 ，由于这儿的 count 自变量是以外界作用域浏览的。
4. 繁杂的闭包
下述编码輸出哪些：
- for (var i = 0; i < 3; i ) {
- setTimeout(function log() {
- console.log(i); // => ?
- }, 1000);
- }
回答輸出：
环节1：
环节2：
第二阶段产生在 100ms 以后：
5. 不正确的信息内容
下边的编码可能輸出哪些：
- function createIncrement() {
- let count = 0;
- function increment() {
- count ;
- }
- let message = `Count is ${count}`;
- function log() {
- console.log(message);
- }
- return [increment, log];
- }
- const [increment, log] = createIncrement();
- increment();
- increment();
- increment();
- log(); // => ?
回答：
輸出：'Count is 0'
6. 再次封裝
下边的涵数 createStack() 用以建立栈构造：
- function createStack() {
- return {
- items: [],
- push(item) {
- this.items.push(item);
- },
- pop() {
- return this.items.pop();
- }
- };
- }
- const stack = createStack();
- stack.push(10);
- stack.push(5);
- stack.pop(); // => 5
- stack.items; // => [10]
- stack.items = [10, 100, 1000]; // 栈构造的封裝被毁坏了
它能一切正常工作中，但有一个小问题，由于曝露了 stack.items 特性，因此所有人都能够立即改动 items 二维数组。
这是一个问题，因为它毁坏了栈的封裝：应当仅有 push() 和 pop() 方式 是公布的，而 stack.items 或别的一切关键点都不可以被浏览。
应用闭包的定义重新构建上边的栈完成，那样就没法在 createStack() 涵数作用域以外浏览 items 二维数组：
- function createStack() {
- // 将你的编码写在这儿
- }
- const stack = createStack();
- stack.push(10);
- stack.push(5);
- stack.pop(); // => 5
- stack.items; // => undefined
回答：
下列是对 createStack() 的重新构建：
- function createStack() {
- const items = [];
- return {
- push(item) {
- items.push(item);
- },
- pop() {
- return items.pop();
- }
- };
- }
- const stack = createStack();
- stack.push(10);
- stack.push(5);
- stack.pop(); // => 5
- stack.items; // => undefined
items 已被挪到 createStack() 作用域内。
那样改动后，从 createStack() 作用域的外界无法打开或改动 items 二维数组。如今 items 是一个独享自变量，而且栈被封裝：仅有 push() 和 pop() 方式 是公共性的。
push() 和 pop() 方式 是闭包，他们从 createStack() 涵数作用域中获得 items自变量。
7. 智能化加法
撰写一个涵数 multiply() ，将2个数据乘积：
- function multiply(num1, num2) {
- // 将你的编码写在这儿...
- }
规定：
假如用 2 个主要参数启用 multiply(num1，numb2)，则应回到这 2 个主要参数的相乘。
可是假如用 一个主要参数启用，则该涵数应回到另一个涵数：const anotherFunc = multiply(num1) 。回到的涵数在启用 anotherFunc(num2) 时实行加法 num1 * num2。
- multiply(4, 5); // => 20
- multiply(3, 3); // => 9
- const double = multiply(2);
- double(5); // => 10
- double(11); // => 22
回答：
下列是 multiply() 涵数的一种完成方法：
- function multiply(number1, number2) {
- if (number2 !== undefined) {
- return number1 * number2;
- }
- return function doMultiply(number2) {
- return number1 * number2;
- };
- }
- multiply(4, 5); // => 20
- multiply(3, 3); // => 9
- const double = multiply(2);
- double(5); // => 10
- double(11); // => 22
假如 number2 主要参数并不是 undefined，则该涵数仅回到 number1 * number2。
可是，假如 number2 是 undefined，则代表着早已应用一个主要参数启用了 multiply() 涵数。这时候就需要回到一个涵数 doMultiply()，该涵数稍候被启用时将实行具体的乘法运算。
doMultiply() 是闭包，因为它从 multiply() 作用域中获得了number1 自变量。
【责编：赵宁宁 TEL：（010）68476606】
