ホームページ > ウェブフロントエンド > jsチュートリアル > 約束とは何ですか?使い方?

約束とは何ですか?使い方?

不言
リリース: 2019-03-23 16:02:51
転載
3995 人が閲覧しました

この記事では、Laravel ポリモーフィック アソシエーション (コード付き) について紹介します。これには一定の参考価値があります。必要な友人は参照できます。お役に立てば幸いです。

promiseとは

公式サイトの説明 Promiseは非同期操作の最終結果を表します。

翻訳 ==Promise はステート マシン == として理解できます。ステート マシンには 3 つの異なる状態があり、特定の時点では 1 つの状態しか持てません。

pending は、解決された状態でまだ実行中であることを意味します。実行成功、拒否、実行失敗

Promise は非同期操作のカプセル化です。非同期操作には、Promise の 3 つの状態に対応して、完了待ち、成功、失敗の 3 つの可能な結果があります。

Promise 状態では、保留中の変換ビットが解決されるか、保留中から拒否への変換のみが可能です。状態変換が完了すると、変更することはできません。

Promise を使用して非同期操作をシールすると、その操作は作成時に保留状態になります。非同期操作が正常に完了すると、
状態が解決済みに変換されます。実行中にエラーが発生した場合は、ステータスを拒否に変換します。

var promise=new Promise(function(resolve,reject){
  // code
  if(){
    /*异步操作成功 */
    resolve(value)
  }else{
    reject(error)
  }
})
ログイン後にコピー

then メソッドを使用して結果を取得します

var fs=require('fs')
function readFile_promise(path){
  return new Promise(function(resolve,reject){
    fs.readFile(path, 'utf-8',function(err,data){
      if(data){
        resolve(data)
      }else{
        reject(err)
      }
    })
  })
}

var result=readFile_promise('./1.txt')
result.then(function(value){
  //success
  console.log('success', value)
},function(error){
  //failure
  console.log('failure',error)
})
// 将一个异步函数封装成promise,只要在回调函数中针对不同的返回结果调用resolve或者reject方法。

// resolve函数会在异步操作成功完成时被调用,并将异步操作的返回值作为参数传递到外部。
// reject是在异步操作出现异常时被调用,会将错误信息作为参数传递出去。
ログイン後にコピー

then メソッドの戻り値

then メソッドは常に新しい Promise オブジェクトを返します。複数回呼び出された場合、デフォルトで 1 つが返されます。空の Promise オブジェクト
戻るには return を使用します。

var promise=readFile_promise('./foo.txt')
promise.then(function(value){
  //success
  console.log('success', value) // foo
  return readFile_promise('./bar.txt')
},function(error){
  //failure
  console.log('failure',error)
}).then(function(value){
  console.log('then', value) // bar
})
ログイン後にコピー
promiseの実行
  • promiseの結果はthenメソッドで取得していますが、promiseはthenメソッドを呼び出した後に実行されるのでしょうか?
var promise=new Promise((resolve, reject)=>{
  console.log('begin')
  resolve()
})

setTimeout(()=>{
  promise.then(()=>{
    console.log('end')
  })
},5000)
// 开始begin 5s后end
// 运行顺序是,当promise从被创建的那一刻起就开始执行了,then方法只是提供了访问promise状态的接口,与promise的执行无关。
ログイン後にコピー
promise 一般的に使用される API
  • resolved
  • rejected
  • all
  • race メソッドは Promise 配列を受け取りますパラメータとして新しい Promise を返すと、配列内の Promise は同時に実行を開始します。race によって返される Promise のステータスは、配列内で最初に実行される Promise のステータスによって決まります。
  • catch 実行エラーが発生した場合は、 throw キーワードを使用してスローできます。 エラーが発生した場合は、catch メソッドを使用してそれをキャプチャします。
 // 如果有多个promise需要执行,可以使用promise.all()
// 方法统一声明,改方法可以将多个promise对象包装成一个promise
// 该方法接收一个数组作为参数,数据的元素如果不是promise对象,则回先调用resolve方法转换。
//  如果中间有一个promise状态是reject,那么转换后的promise也会变成reject,并且将错误信息传给catch方法
var promises=['foo.txt','bar.txt','baz.txt']
promises.map(function(path){
  // console.log(path)
  return readFile_promise(path)
})

Promise.all(promises).then(function(results){
  console.log(results) // [ 'foo.txt', 'bar.txt', 'baz.txt' ] 顺序排列的
}).catch(function(err){
  // 
})
ログイン後にコピー
Promise を使用して非同期コードを整理します
// 例子; 有三个文本文件需要顺序读取
var lists=['foo.txt','bar.txt','baz.txt']
var count=0;
readFile_promise('foo.txt').then(readCB).then(readCB).then(readCB);

function readCB(data){
  console.log(data) // foo bar baz
  if(++count>2){
    return
  }
  return readFile_promise(lists[count])
}
ログイン後にコピー

async/await

await キーワードの後に​​は、暗黙的に Promise.resolve を呼び出して Promise に変換するのではなく、Promise が続くことがよくあります。
await は、次のステップに進む前に、後続の Promise が実行されるのを待ちます。

var asyncReadFile=async function(){
  var result1=await readFile_promise('./foo.txt')
  console.log(result1.toString()) // foo
}
asyncReadFile()
ログイン後にコピー
async 戻り値

async 関数は常に Promise オブジェクトを返します。return キーワードの後に​​ Promise が続かない場合、デフォルトの
は Promise を呼び出します。変換のためのメソッドを解決します。

async function asyncFunc(){
  return 'hello Node'
}
asyncFunc().then(function(data){
  console.log(data) // hello Node
})
ログイン後にコピー
async 関数の実行プロセス
  1. async 関数の実行が開始されると、Promise オブジェクトが自動的に生成されます。
  2. メソッド本体の実行開始時に、return キーワードまたは throw キーワードが検出された場合、実行は直ちに終了します。

await キーワードが検出された場合、実行はその後一時停止されます。 await。非同期操作の終了後に実行が再開されます。

  1. 実行が完了すると、promise
async function asyncFunc(){
  console.log('begin')
  return 'hello Node'
}
asyncFunc().then(function(data){
  console.log(data) // hello Node
  console.log('end')
})
// begin 
// hello 
// end
ログイン後にコピー
await

await 演算子の結果は次のようになります。後続のプロミスによって決定されます。オブジェクトの操作結果によって決定されます。プロミス オブジェクトが後で解決される場合、
await 演算子によって返される値は解決された値です。プロミス オブジェクトの状態が次の場合、その値は解決された値です。拒否された場合、 await も拒否値をスローします。

async function readFile(){
  var result=await readFile_promise('./foo.txt')
  console.log(result) // foo
}
readFile()

// 等价于
readFile_promise('foo.txt').then(function(data){
  console.log(data) // foo
})
ログイン後にコピー
await inParallel

await は、次のアクションを実行する前に、後続の Promise が完了するまで待機します。これは、複数の await 操作が発生すると、プログラムが完全な
になることを意味します。文字列 操作を実行します。

非同期操作間に依存関係がない場合は、promise.all を使用して並列処理を実現できます。

async function readFile(){
  const [result1, result2]=await Promise.all([
    readFile_promise('./foo.txt'),
    readFile_promise('./bar.txt')
  ])
  console.log(result1, result2) // foo bar
}
readFile()

// 等价于
function readFile(){
  return Promise.all([
    readFile_promise('./foo.txt'),
    readFile_promise('./baz.txt')
  ]).then((result)=>{
    console.log(result) // [ 'foo', 'baz' ]
  })
}
readFile()
ログイン後にコピー

await の概要

await キーワードを使用する際のいくつかの重要なポイント
  • await キーワードは async 関数内に配置する必要があります
  • await キーワード これは、Promise オブジェクトである必要があります (そうでない場合は、解決変換が呼び出されます)
  • await キーワードの戻り結果は、その背後での Promise 実行の結果であり、resolved またはrequested
  • Cannot 通常のアロー関数で await キーワードを使用するには、アロー関数の前に async キーワードを追加する必要があります。
  • await は、非同期操作をシリアルに実行するために使用されます。promise.all を並列で使用したい場合は、

非同期関数の欠点

多くのメソッド呼び出し層があるとします。最下層 非同期操作は async メソッドにカプセル化されているため、関数の上位層メソッドはすべて async メソッドになる必要がある場合があります。

この記事はここで終了しています。さらに興味深いコンテンツについては、PHP 中国語 Web サイトの JavaScript ビデオ チュートリアル 列に注目してください。

以上が約束とは何ですか?使い方?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート