# 💬 问题描述

写一个count函数,第一次调用该函数返回1,之后每次调用count,返回的值自动加1

# 示例

count(); // 第一次调用 输出 1
count(); // 第二次调用 输出 2
count(); // 第三次调用 输出 3
1
2
3

# 思路

  1. 通过函数实现局部变量的存储
  2. 需要返回一个函数
  3. 返回的函数赋予count —— 所以可以执行count()
  4. 即执行count绑定的立即执行函数

# 代码实现

var count = (function () {
  var a = 0;
  // console.log(++a);
  // 注意这里不能直接输出结果
  // 应该返回一个函数 —— test才是函数
  return () => {
    console.log(++a);
  };
})();

count(); // 1
count(); // 2
count(); // 3

1
2
3
4
5
6
7
8
9
10
11
12
13
14

# 分析

var count = (function () {
  var a = 0;
  console.log(++a);
})();

console.log("count: ", count);
// count:  undefined
1
2
3
4
5
6
7
  • 如果不写return, 那么test就不是一个函数,此时是undefined
  • 它的值为这个立即执行函数的返回值, 也就是()前边function中的返回值

为什么要写成立即执行函数?

我们来看一下,如果不写成立即执行函数,此时的count是什么状态

var count = function () {
  var a = 0;
  return () => {
    console.log(++a);
  };
};

console.log("type: ", typeof count);
// type:  function

console.log("count: ", count);
/*
count:  ƒ () {
  var a = 0;
  return () => {
    console.log(++a);
  };
}
*/

console.log("count(): ", count());
/*
count():  () => {
    console.log(++a);
  }
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

可以发现,count是一个函数,count()是count中返回的一个函数,所以我们执行count()是没有结果的,因为相当于写上了一个函数,而没有调用,所以想要结果的话需要调用该函数,才可以得到结果

count();
count();
count();
// 没有输出

count()();  // 1
count()();  // 1
count()();  // 1
1
2
3
4
5
6
7
8

为什么这里是1呢?是因为count每次调用时,都会执行count函数,也就是会重新走var a = 0, 所以每次调用count()()时,a都是0,所以结果都是1,所以这样也是实现不了上述需求的

所以设置立即执行函数,原因就是为了让a变量受到保护,只有在第一次调用时会执行var a = 0, 之后的调用不会重新走var a = 0这行代码,直接就到了return,所以a的值没有被重新赋值,只会被每次执行count()后进行+1 —— 类似于闭包

var test = (function () {
  var a = 0;
  console.log("执行了一次a = 0");
  return () => {
    console.log("a: ", a);
    console.log(++a);
  };
})();

test();
test();
test();

/*
  执行了一次a = 0
  a: 0
  1
  a: 1
  2
  a: 2
  3
  a: 3
*/

var count = function () {
  var a = 0;
  console.log("执行了一次a = 0");
  return () => {
    console.log("a: ", a);
    console.log(++a);
  };
};

/*
  执行了一次a = 0
  a: 0
  1
  执行了一次a = 0
  a: 0
  1
  执行了一次a = 0
  a: 0
  1
*/
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44