# fed-e-task-01-01

**Repository Path**: ren_wei_1/fed-e-task-01-01

## Basic Information

- **Project Name**: fed-e-task-01-01
- **Description**: No description available
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-07-18
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# fed-e-task-01-01

### javascript异步编程

#### 1.如何理解javscript异步编程 
> 当一些操作不需要立即执行或者执行事件是不确定的时候，我们不可能把他们放在主线程中，这样会导致堵塞主线程。所以，我们会把这些事件或者操作放到异步线程中去执行调用，当异步线程执行完成之后会放到消息队列中，当执行栈中为空的时候，会去调用消息队列里面的方法，从而执行异步方法的回调。（注:JavaScript是单线程语言，我们实现异步编程靠的是浏览器创建多个js线程）
  
#### 2.Event Loop和消息队列

##### 1.Event Loop
下面这张图是我理解的event loop的流程
![event loop流程图](https://images.gitee.com/uploads/images/2020/0719/093713_7ca66eff_5593237.png "未命名文件 (1).png")

执行流程是这样的:
1. 首先执行全局代码，这些代码里面的同步代码会立即执行，异步代码会放到异步线程中执行,异步代码执行完成后会放到任务队列中,微任务会放入微任务队列中
2. 当第一步执行完成之后，调用栈会清空
3. 当调用栈清空之后，会首先去调用微任务队列，执行微任务队列队首的任务
4. 如果在微任务的执行过程又产生了新的微任务，该微任务会放入到微任务队列的队尾，直到微任务队列清空
5. 当微任务队列和调用栈都清空的时候,此时会调用任务队列（也就是宏任务队列）,执行宏任务队列队首的任务
6. 当任务执行完毕的时候，此时调用栈为空（注:此时并不是任务队列清空了，只是执行完了任务队列的队首的任务）
7. 重复3~7的步骤

##### 2.消息队列
> 其实消息队列就是上面所说的任务队列，js中分为同步和异步，同步都在主线程上面执行，会形成一个调用栈。然后异步任务就在异步线程上面执行，当异步任务执行完成有了结果之后，就会把回调函数放到消息队列中，当调用栈为空的时候，就会开始调用消息队列里面的回调函数。通俗点来说:消息队列就是负责将完成的异步任务存储起来，等来调用栈来调用；

#### 3.宏任务
> 宏任务就是每执行完一个宏任务，浏览器都会渲染一次，然后才会调用下一个宏任务（即:宏任务的执行是:  一个宏任务 ===> 浏览器渲染 ===> 下一个宏任务），其实代码的执行也算是一个宏任务；

宏任务包括:
1. script(代码)
2. setTimeout();
3. setInterval();
4. IO;
5. UI事件;
6. 等等...

#### 4.微任务
> 微任务就是在宏任务执行之后，浏览器渲染之前执行的任务(即:微任务的执行是: 宏任务 ===> 微任务 ===> 浏览器渲染  ===> 下一个宏任务)。微任务有自己的微任务队列，每次调用栈为空的时候，会先访问微任务队列，当微任务队列为空的时候，才会访问宏任务队列。

微任务包括
1. promise;
2. observe;
3. MutaionObserver(浏览器);
4. process.nextTick(nodejs);