Js同步与异步

Js的同步与异步问题

Js知识

前言

如果有人问你Js的同步异步问题，你该怎么回答？理解一个问题无非是what-why-how，js同步和异步问题是什么–>为什么会产生异步问题–>如何解决。

首先，我们要知道Js是单线程的，同一时间只处理一个任务，这已经成这门语言的核心特征。

同步与异步（重点）

同步就是任务放入到队列中后按照顺序执行；
异步就是同时进行多个任务。
举个例子：比方说你要烧水做菜，如果你先烧水，等着水烧开，再去做菜，这就是同步操作；但如果你边烧着水，同时准备做菜材料，同时进行，这就是异步操作；
 
js单线程是执行同步操作的，但有时也需要异步操作，防止某一块解析时间过长，造成“卡死”情况。
那么，js单线程又是如何实现异步的呢? ——是通过事件循环实现“异步”
js中，最基础的异步是setTimeout和setInterval函数，还有onclick, ajax等异步操作。

 console.log('1')
setTimeout(function(){
 console.log('2')
},0)
console.log('3')  
//输出       1，3，2

promise解决异步问题

promise解决嵌套回调的问题，将嵌套的回调函数改成.then()的连缀使用。
Promise有这些特征：只能决议一次，决议值只能有一个，决议之后无法改变。任何then中的回调也只会被调用一次。Promise的特征保证了Promise可以解决信任问题。

promise 的使用

首先通过new Promise（function）创建一个promise对象，接收一个函数参数，并且在函数中传入resolve以及reject两个参数；

var p = new Promise(function(resolve, reject){      
            //做一些异步操作
            setTimeout(function(){
                console.log('这是一个异步操作');
                resolve('异步操作成功并且结束');
            }, 1000);
        });

then() 接收两个函数，分别是对promise的resolve及reject状态处理的函数，并且处理结束之后返回promise对象

function fn1() {
       console.log("第一个函数开始执行");
       var p = new Promise(function (resolve, reject) {
           setTimeout(function () {
               console.log('第一个函数执行完毕');
               resolve('接下来进入第二个函数');
           }, 1000);
       });
       return p;
   }

   function fn2(data) {
       console.log(data);
       console.log('第二个函数开始执行');
       var p = new Promise(function (resolve, reject) {
           setTimeout(function () {
               var num = Math.ceil(Math.random() * 10); // 生成随机数
              console.log(num);
               //num = 0；设置num=0
               if (num === 0) {
                   console.log('第二个函数执行完毕');
                   resolve('所有函数执行完毕');
               }
               else{
                   reject("执行函数2失败");
               }
           }, 2000);
       });
       return p;
   }

   fn1()
       .then(function (data) {
           return fn2(data);
       })
       .then(function (data) {
           console.log(data);
       })

• 第一个函数开始执行
• 第一个函数执行完毕
• 接下来进入第二个函数
• 第二个函数开始执行
• 第二个函数执行完毕
• 所有函数执行完毕
    调用reslove

.all() 接收一个函数数组，进行并发操作，并将每个函数的结果以数组的形式返回。
.race()接收函数数组，函数先执行完成之后先进入下一个回调函数中。
.catch() 当then中出现错误时不会中止整个函数，catch能够获取到错误并进行提示。

这几种方法不做详述啦！会用即可，好了！今天先到这里，我们下期见!