JavaScript的异步(async/await/promise)

我们知道，JavaScript是单线程，为什么还要讲它的异步，以及异步是怎么实现的，本文不做细讲，可以参阅JavaScript异步机制详解。本文主要讲JavaScript的异步的使用方法,使用ReactNative语言进行举例，主要讲async/await以及promise使用。
一、async/await使用
1.async/await，有await的地方一定有async。一个async对应一个或者多个await。
2.await用来等待接受一个耗时的，异步的信号。await之后的代码，一定是在await接收到异步信号才会执行的。await使异步变得像同步。

举例1
testZeroMethod= async()=>{
    try {
        // 注意这里的await语句，其所在的函数必须有async关键字声明
        let response = await fetch(
          'https://facebook.github.io/react-native/movies.json',
        );
       //await 等到结果后才会走到这里
        console.log(response)
      } catch (error) {
        console.error(error);
      }
  }

3.不使用async/await的异步调用。比如有些是系统底层方法，是没法在方法前加async的，这个时候就可以使用.then() .catch()

举例2
 testOneMethod= ()=>{
        fetch('https://facebook.github.io/react-native/movies.json')
       .then((response)=>{
           console.log(response)
       })
       .catch((error)=>{
        console.error(error)
       })
  }

二.Promise。 Promise的含义，以及基本语法，本文不再细讲，可以参考阮一峰老师Promise 对象,讲的很细。
Promise是干嘛的，就是来实现异步的，是异步的核心。上面的举例1、举例2中的fetch和promise作用就很像。Promise想容器一样，把耗时的操作放在自己里面，不管过程是怎样，最终只通知结果给外部。
1.定义一个Promise

举例3
testTwoMethod = (data)=>{
   let promise = new Promise ((resolve,reject)=>{
       let person = data||{name:"Jesse",age:30};
    //假如这是一个耗时操作JSON.stringify
       let  jsonStr =JSON.stringify(person);
          if(jsonStr){
              resolve(jsonStr)
          }else{
             reject()
          }
      
   })
   return promise;
}

2.async/await和promise的结合使用

举例4
testThreeMethod = async()=>{
  let data = {name:'Jim',age:18};
 //调用举例3的方法
  let result = await this.testTwoMethod(data);
  console.log(result); 
}

3.then()和.catch()与promise的结合

举例5
testFourMethod = ()=>{
  let data = {name:'Kin',age:50};
  this.testTwoMethod(data).then((result)=>{
      console.log(result); 
  }).catch((error)=>{
      console.log(error); 
  })
  
}

JavaScript中的异步很常见，新手很容易迷惑。我提供下本文的代码地址,有兴趣的可以下载代码，通过log值更清晰的理解。