js进阶

js进阶
1丶event loop执行过程:

• 同步代码，一行一行的放在Call Stack执行
• 遇到异步代码，会先记录下,等待时机(定时器，网络请求)
• 时机到了，就会自动移入Callback Queue中
• 如果Call Stack为空(即同步代码执行完),event loop开始工作
• 轮流查找Callback Queue，如果有移动到Call Stack中执行
• 最后继续轮询查找(永动机一样)
  2丶什么是promise？
  解决地狱回调
  你对promise的理解？
  一共有三种状态:
  1）pending 初始状态
  2）fulfilled 成功状态
  3）rejected 失败状态
  可以链式调用，封装API
  应用场景：
  封装ajax。axios的get,post封装。微信小程序中封装wx.request()，封装方法。
  promise的两个回调函数
  resolve函数的作用：在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；
  reject函数的作用：在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。

例子：
setTimeout(function() { 
    console.log(1) 
}, 0); 
new Promise(function executor(resolve) { 
    console.log(2); 
    for( var i=0 ; i<10000 ; i++ ) { 
        i == 9999 && resolve(); 
    } 
    console.log(3); 
}).then(function() { 
    console.log(4); 
}); 
console.log(5);  //2  3  5  4  1
// Promise的回调函数不是正常的异步任务，而是微任务（microtask）。区别在于，正常异步任务追加到
//下一轮事件循环，微任务追加到本轮事件循环。这意味着，微任务的执行时间一定早于正常异步任务。then的
//回调函数的执行时间，早于setTimeout(fn, 0)。因为then是本轮事件循环执行，setTimeout(fn, 0)在
//下一轮事件循环开始时执行

下面代码演示的是解决了回调地狱的问题,是代码看起来更加简洁，清晰。

3丶async和await
async和await是解决了复杂的.then链，使代码更加简洁。
async 是“异步”的简写， async 用于申明一个异步的 function。
await 可以认为是 async wait 的简写，await 用于等待一个异步方法执行完成。
特点：

1. asayc的用法，它作为一个关键字放到函数前面，这样普通函数就变为了异步函数。
2. 异步async函数调用，跟普通函数的使用方式一样。
3. 异步async函数返回一个promise对象。
4. async函数配合await关键字使用(阻塞代码往下执行)
   是异步方法，但是阻塞式的。
   使用:

//使用场景
//摇色子方法
function dice(){
    return new Promise((resolve,reject)=>{
        let sino = parseInt(Math.random()*6+1)  //生成一个1~6之间的随机小数
        setTimeout(()=>{
            resolve(sino)
        },2000)
    })
}
//异步方法
 async function text(){
     let n= await dice()
      //await 关键字后面调用摇色子方法执行完毕之后，才进行变量赋值
     console.log("摇出来"+n)  //最后打印出摇出来的数
 }
text()

4丶js的五种for循环的区别:

<script>
      //第一种for
      let arr = [3, 6, 9];
      //  for(let i=0;i<arr.length;i++){
      //遍历的是下标
      //     console.log(i)
      //  }
      //  第二种for in
      //   for (let item in arr) {
      //     遍历的item是下表
      //     console.log(item);
      //   }
      //第三种for of
      //   for(let item of arr) {
      //       console.log(item)
      //   }
      //第四种forEach
      //  arr.forEach((item,index,arr) => {
      //第一项是arr里面的元素，第二项是下表,第三项是当前数组

      //     console.log(item)
      //     console.log(index);
      //     console.log(arr);
      //  });
      //第五种map循环
      arr.map((item, index, arr) => {
        //   跟forEach一样，第一项是arr里面的元素，第二项是下表,第三项是当前数组、
        //唯一不一样的是map循环有返回值
        //   console.log(item)
        //   console.log(index)
        //   console.log(arr)
        return console.log(item * 3);
      })
    </script>

什么是宏任务和微任务？
宏任务包括：setTimeout setInterval Ajax DOM事件
微任务：Promise async/await
微任务比宏任务的执行时间要早。
异步和单线程：
异步和单线程是相辅相成的，js是一门单线程脚本语言，所以需要异步来辅助。
异步和同步的区别:
异步不会阻塞程序的执行，
同步会阻塞程序的执行。
前端使用异步的场景:

1. 定时任务：setTimeout，setInverval
2. 网络请求：ajax请求，动态加载
3. 事件绑定
   事件循环：
   1.所有的同步任务都在主线程上执行，行成一个执行栈。
   2.除了主线程之外，还存在一个任务列队，只要异步任务有了运行结果，就在任务列队中植入一个时间标记。
   3.主线程完成所有任务(执行栈清空），就会读取任务列队，先执行微任务队列在执行宏任务队列。
   执行顺序：
   一般情况下先执行同步代码，然后在执行微任务，最后执行宏任务。