<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <script> // 事件驱动型语言 // console.log("a"); // document.addEventListener("nihao",nihaoHandler);//侦听事件 // var evt=new Event("nihao"); //新建事件 // document.dispatchEvent(evt); // console.log("b"); // function nihaoHandler(e){ //执行事件 // console.log("c"); // } //事件是及时性的,打印结果是a c b //下面代码运行结果是a b c ,这个事件不是及时执行的 // console.log("a"); // setTimeout(timeHandler,0); // console.log("b"); // function timeHandler(){ // console.log("c"); // } // console.log("a"); // Promise.resolve().then(function(){ // console.log("b"); // })//异步 // console.log("c"); //01是打印顺序,是微任务和宏任务 console.log("a"); //01 setTimeout(timeHandler,0); Promise.resolve().then(function(){ console.log("c");//03 }); console.log("d");//02 function timeHandler(){ console.log("b");//04 }//运行结果:a,d,c,b // 微任务和宏任务 // 宏任务 setTimeOut,setInterval 当触发时放在下一个任务列的最前面执行 // 微任务 Promise 当触发时,放在当前任务列的最后面执行 // a i n j m b e d c k l f g h // console.log("a"); // document.addEventListener("ab",abHandler); // //1 // setTimeout(function(){ // console.log("b"); // document.dispatchEvent(new Event("ab")); // Promise.resolve().then(function(){ // console.log("c"); // //4 // setTimeout(timeHanlder,0) // }); // console.log("d"); // },0); // new Promise(function(res,rej){ // console.log("i");//这个是同步执行的 // //2 // setTimeout(function(){ // console.log("k"); // },0) // res(); // }).then(function(){ // console.log("j"); // //3 // setTimeout(function(){ // console.log("l") // },0); // Promise.resolve().then(function(){ // console.log("m"); // }) // }); // console.log("n"); // function abHandler(e){ // console.log("e"); // } // function timeHanlder(){ // console.log("f"); // new Promise(function(reslove,reject){ // console.log("g");//同样同步执行 // reslove() // }).then(function(){ // console.log("h"); // }) // } // var a=3; // Promise.resolve().then(function(){ // console.log(a+b); // // 当前script标签任务列完成 // var div=document.querySelector("div"); // console.log(div); // }); // var b=4; // var div=document.createElement("div"); // document.body.appendChild(div); </script> <!-- <div></div> --> </body> </html>