Rumah >hujung hadapan web >Soal Jawab bahagian hadapan >Adakah janji berdasarkan es6?

Adakah janji berdasarkan es6?

青灯夜游
青灯夜游asal
2022-11-03 19:20:551905semak imbas

Ya. Promise ialah jenis rujukan baharu dalam ECMAScript 6, yang mewakili penyiapan akhir atau kegagalan operasi tak segerak. Janji menyelesaikan masalah penulisan logik yang terlalu kompleks dalam kod panggilan pengaturcaraan tak segerak Apabila permintaan rangkaian sangat kompleks, neraka panggilan balik akan berlaku, jika kod ini ditulis bersama, ia akan kelihatan sangat rumit dan tidak kondusif untuk dibaca. Jika anda menggunakan Promises akan menjadikan kod tersebut kelihatan lebih cantik dan elegan.

Adakah janji berdasarkan es6?

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

ECMAScript 6 menambah sokongan lengkap untuk spesifikasi Promises/A, iaitu jenis Promise. Setelah dilancarkan, Promise menjadi sangat popular dan menjadi mekanisme pengaturcaraan tak segerak yang dominan. Semua penyemak imbas moden menyokong jangkaan ES6, dan banyak API penyemak imbas lain adalah berdasarkan jangkaan.

Promise ialah jenis rujukan baharu dalam ECMAScript 6, yang mewakili penyiapan akhir atau kegagalan operasi tak segerak.

1. Apakah fungsi janji itu? kompleks, ia akan Callback neraka muncul, jadi jika kod ini ditulis bersama, mereka akan kelihatan sangat rumit dan tidak sesuai untuk dibaca Jika anda menggunakan janji, kod akan kelihatan lebih cantik dan elegan

2. . Janji 3 Terdapat tiga keadaan

Pertama sekali, apabila terdapat operasi tak segerak dalam pembangunan kami, kami boleh membungkus Janji untuk operasi tak segerak, akan ada menjadi tiga keadaan


3 Laksanakan
pending:等待状态,比如正在进行网络请求,或者定时器没有到时间。
fulfill:满足状态,当我们主动回调了resolve时,就处于该状态,并且会回调.then()
reject:拒绝状态,当我们主动回调了reject时,就处于该状态,并且会回调.catch()

1, kemudian dan tangkap

1 dalam keadaan belum selesai adalah segerak dan akan dilaksanakan serta-merta

2 maka dan tangkapan adalah tidak segerak Walaupun tiada operasi tak segerak dalam objek janji dan kaedah atau tangkapan itu dilaksanakan serta-merta. dua kaedah di sini boleh ditambahkan pada baris gilir acara untuk menunggu pelaksanaan

2 Tentukan status
//参数 函数(resolve,reject)
    new Promise((resolve, reject) => {
        setTimeout(() => {
            //请求成功的时候调用resolve
            resolve('22222')
            //请求失败的时候调用reject
            reject('error message')
        }, 1000)
    }).then((data) => { //请求成功处理函数
        console.log(data)
    }).catch((err) => { //请求失败处理函数
        console.log(err)
    })

1 dalam fungsi pemprosesan status belum selesai, status akan belum selesai dan terus menjadi status yang ditolak Dan boleh ditangkap oleh tangkapan

3 >
var pro = new Promise((resolve, reject) => {
            throw new Error("123");

            // try{
            //     throw new Error("123"); 
            // } catch(e) {}

            resolve(12);
            reject(34);
        })

        // pro.then(data => {
        //     console.log(data);
        // }, err => {
        //     console.log(err);
        // })


        console.log(pro);
        

        pro.then(data => {
            console.log(data);
            
        })

        pro.catch(data => {
            console.log(data);
            
        })
1. Gunakan Janji:

2 Gunakan Async:

const makeRequest = () =>
        getJSON().then(data => {
            console.log(data)
            return "done"
        })

    makeRequest()
async dan tunggu dicadangkan oleh ES7

Fungsi Async: Memudahkan penciptaan objek janji dalam nilai pulangan fungsi

Secara amnya, async ditulis di hadapan fungsi dan nilai pulangan bagi fungsi yang diubah suai mestilah janji objek. Hanya dalam beberapa kes khas objek janji akan dikembalikan secara manual.

Fungsi: Menyelesaikan masalah tak segerak seperti janji, tetapi kelebihannya ialah untuk menjadikan kod tak segerak sama seperti segerak!!
Nota: Dalam kaedah segerak, kami mendapat hasil melalui pemulangan value , kaedah tak segerak mendapat hasil dengan bergantung pada fungsi panggil balik.

Sintaks asas yang digunakan oleh async dan menunggu

:

Ia adalah untuk menambah async di hadapan fungsi biasa dan panggilan ialah sama seperti fungsi biasa

Async biasanya digunakan bersama-sama dengan await
  • menunggu diikuti dengan objek janji menunggu mesti digunakan dalam fungsi tak segerak
  • 3 Perbezaan

  • 1. Terdapat kata kunci aync tambahan di hadapan fungsi. Kata kunci await hanya boleh digunakan dalam fungsi yang ditakrifkan oleh aync. Fungsi async secara tersirat akan mengembalikan janji, dan nilai penyelesaian janji ialah nilai pulangan fungsi. (Nilai penyelesaian semula dalam contoh ialah rentetan "selesai")
2. Kami tidak boleh menggunakan await dalam kod paling luar kerana ia bukan dalam fungsi async.
const makeRequest = async () => {
 // await getJSON()表示console.log会等到getJSON的promise成功reosolve之后再执行。
        console.log(await getJSON)
        return "done"
    }

    makeRequest()

Kaedah empat.janji


1.semua kaedah

Kadang-kadang kita perlu menunggu dua atau lebih permintaan untuk kembali dengan jayanya Untuk meneruskan ke langkah seterusnya, semua kaedah janji adalah menunggu semua permintaan tak segerak dilengkapkan sebelum membuat panggilan balik seterusnya

2.kaedah perlumbaan
var r1 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第一个请求");
            },1000)
        })
        var r2 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第二个请求");
            },3000)
        })
        var r3 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第三个请求");
            },4000)
        })
        var r4 = new Promise((resolve,reject) => {
            setTimeout(function(){
                resolve("我是第四个请求");
            },500)
        })

Permintaan dihantar di pada masa yang sama. Siapa yang kembali dahulu akan menjadi pemenang.

Promise.all([r1,r2,r3,r4]).then(data => {
            console.log(data);
            
        })
5. Janji enkapsulasi kes ajax

[Cadangan berkaitan:
Promise.race([r1,r2,r3,r4]).then(data => {
           console.log(data);
           
       })
tutorial video javascript

, depan web- tamat

Atas ialah kandungan terperinci Adakah janji berdasarkan es6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya:Adakah peta es6 dipesan?Artikel seterusnya:Adakah peta es6 dipesan?