初步了解js异步线程
开篇先简单看一个例子：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
| console.log(1);
console.log(2);
console.log(3);
console.log(4);
console.log(5);
console.log(6);
console.log(7);
console.log(8);
console.log(9);
console.log(10);
|
原因就是js是单线程的，执行队列先进先出。
那么，如果在中间插入一句settimeout呢？
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
| console.log(1);
console.log(2);
console.log(3);
console.log(4);
setTimeout(() => {
console.log(5);
},0);
console.log(6);
console.log(7);
console.log(8);
console.log(9);
console.log(10);
|
虽然输出‘5’的等待时间设为0，但是它还是最后输出的。原因是settimeout属于js的异步线程，要等主线程执行完毕后才会执行。
而settimeout的代码会根据设置的时间输出。表现如下：
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
| console.log(1);
console.log(2);
console.log(3);
for(var i = 0; i <1000000; i++){}
setTimeout(() => {
console.log(4);
},20);
(function(n){setTimeout(() => {
console.log(n);
},0);})(5);
setTimeout(() => {
console.log(6);
},0);
console.log(7);
console.log(8);
console.log(9);
console.log(10);
|
我们在代码上多加了for(var i = 0; i <1000000; i++){}以及IIFE，性能不好的电脑在输出了3以后会停顿若干时间，即使是这样，settimeout也不会在‘7’输出之前调用，因为他们还在排队中。而IIFE的加入也并没有起什么作用。