宏任务与微任务面试题

宏任务与微任务面试题

• 对于宏任务与微任务的执行顺序问题一直都是前端面试一到过不去的坎，这东西多看是没用的，多做就是了，刷了10来到面试题，立马顿悟。
  1

async  function  async1 ()  {
			    console.log('async1 start');
			    await  async2();
			    console.log('async1 end')
				console.log('async1 end  2')
			}
			async  function  async2 ()  {
			    console.log('async2')
			}
			console.log('script start');
			setTimeout(function ()  {
			    console.log('setTimeout')
			},  0);
			async1();
			new  Promise(function (resolve)  {
			    console.log('promise1');
			    resolve()
			}).then(function ()  {
			    console.log('promise2')
			});
			console.log('script end') 

2

 console.log('1')			
			setTimeout(function () {
			    console.log('2')
			    setTimeout(function () {
			        console.log('3')
			    },0)			
			    new Promise(function (resolve) {
			        console.log('4')			
			        for (let i = 0; i < 666; i++) {
			            i == 5 && resolve()
			        }			        
			    }).then(function () {
			        console.log('5')
			    })			
			}, 0)			
			console.log('6')			
			new Promise(function (resolve) {
			    console.log('7')			
			    for (let i = 0; i < 666; i++) {
			        i == 5 && resolve()
			    }			    
			}).then(function () {
			    console.log('8')
			})

3

setTimeout(() => {
				console.log(4);
			}, 0);

			new Promise(resolve => {
				console.log(1);
				for (let i = 0; i < 10000; i++) {
					i == 9999 && resolve();
				}
				console.log(2)
			}).then(() => {
				console.log(5)
			})

			console.log(3) 

4

setTimeout(function(){
		
			console.log('1')
		
			});	
				
			new  Promise(function(resolve){
			  console.log('2');		
			  resolve();		
			}).then(function(){
			console.log('3')		
			});	
				
			console.log('4'); 

setTimeout(() => {
				Promise.resolve().then(() => {
					console.log('1')
				})
			},0);
		
			Promise.resolve().then(() => {
				setTimeout(() => {
					console.log('2')
				},0)
			});
		
			console.log('3') 

6

setTimeout(() => {
				console.log('1')	
			},0);
		
			Promise.resolve().then(() => {
				console.log('2');
					Promise.resolve().then(() => {
						console.log('3');
				})
			})
		
			console.log('4');

7

 async function async1() {
	        console.log(1);
	        const result = await async2();
	        console.log(3);
	    }
	
	    async function async2() {
	        console.log(2);
	    }
	
	    Promise.resolve().then(() => {
	        console.log(4);
	    });
	
	    setTimeout(() => {
	        console.log(5);
	    });
	
	    async1();
	    console.log(6); 

8

console.log('1');	
			setTimeout(function() {
			    console.log('2');
			    Promise.resolve().then(function() {
			        console.log('3');
			    })
			    new Promise(function(resolve) {
			        console.log('4');
			        resolve();
			    }).then(function() {
			        console.log('5')
			    })
			})
			Promise.resolve().then(function() {
			    console.log('6');
			})
			new Promise(function(resolve) {
			    console.log('7');
			    resolve();
			}).then(function() {
			    console.log('8')
			})
	
			setTimeout(function() {
			    console.log('9');
			    Promise.resolve().then(function() {
			        console.log('10');
			    })
			    new Promise(function(resolve) {
			        console.log('11');
			        resolve();
			    }).then(function() {
			        console.log('12')
			    })
			})

9

new Promise(function(res) {
				console.log(1);
				res();
				Promise.resolve().then(function() {
					console.log(2);
				});    
				new Promise(function(res) {
					res();
				}).then(function() {
					console.log(-1);
				});
				console.log(0);
			}).then(function() {
				console.log(3);
				Promise.resolve().then(function() {
					console.log(4);
				});
			}).then(function() {
				console.log(5);
			});       
			Promise.resolve().then(function() {
				console.log(6);
				Promise.resolve().then(function() {
					console.log(7);
				});
			});   
			setTimeout(function() {
				setTimeout(function() {
					console.log(8);
				}, 0);
				Promise.resolve().then(function() {
					console.log(9);
				});
			}, 0);
			setTimeout(function() {
				console.log(10);
			}, 0);

10

console.log(1); //
			console.log(18); //
			new Promise(function(res, rej) {
				console.log(2); //
				res();
			}).then(function() {
				console.log(3); //
				Promise.resolve().then(function() {
					console.log(5);
					setTimeout(function() {
						console.log(6); //
						Promise.resolve().then(function() {
							console.log(7);
						});
						setTimeout(function() {
							console.log(8);
						}, 0);
					}, 0);
				});
			}).then(function() {
				console.log(4);
			});
			new Promise(function(res) {
				console.log(19); //
				setTimeout(function() {
					console.log(20); //
				}, 0);
			});
			Promise.resolve().then(function() {
				setTimeout(function() {
					Promise.resolve().then(function() {
						console.log(12);
					});
					console.log(13); //
				}, 0);
			});
			setTimeout(function() {
				console.log(9); //
				new Promise(function(res) {
					res();
					console.log(10);
				}).then(function() {
					console.log(11);
				});
			});
			setTimeout(function() {
				setTimeout(function() {
					setTimeout(function() {
						Promise.resolve().then(function() {
							console.log(14);
						});
						console.log(15);
					}, 0);
					console.log(16);
				}, 0);
				console.log(17); //
			}, 0);

11

console.log(1);//
      document.addEventListener("14", function () {
        console.log(14);//
      });
      new Promise(function (resolve) {
        resolve();
        console.log(2);//
        setTimeout(function () {
          console.log(3);//
        }, 0);
        Promise.resolve().then(function () {
          console.log(4);//
          setTimeout(function () {
            console.log(5);
          }, 0);
          setTimeout(function () {
            (async function () {
              console.log(6);
              return function () {
                console.log(7);
              };
            })().then(function (fn) {
              console.log(8);
              fn();
            });
          }, 0);
        });
        new Promise(function (resolve) {
          console.log(9);//
          resolve();
        }).then(function () {
          new Promise(function (resolve, reject) {
            console.log(10);
            reject();
          }).then(function () {
              setTimeout(function () {
                console.log(11);
              }, 0);
              console.log(12);
            }).catch(function () {
              console.log(13);
              var evt = new Event("14");
              document.dispatchEvent(evt);
            });
        });
      });	  
      setTimeout(function () {
        console.log(15);
        Promise.resolve().then(function () {
          console.log(16);
        });
      }, 0);