Maison  >  Article  >  interface Web  >  Quelle est la façon d’écrire alors en es6 ?

Quelle est la façon d’écrire alors en es6 ?

WBOY
WBOYoriginal
2022-05-06 16:40:283471parcourir

Dans es6, la méthode d'écriture de then est "then (ajouter une fonction de rappel pour les changements d'état réussis à l'instance de promesse, une fonction de rappel en cas d'échec)" ; cette méthode est utilisée pour ajouter une fonction de rappel pour l'instance de promesse lorsque le l'état change et le résultat renvoyé est Une nouvelle instance de promesse et la méthode peut être chaînée.

Quelle est la façon d’écrire alors en es6 ?

L'environnement d'exploitation de ce tutoriel : système Windows 10, ECMAScript version 6.0, ordinateur Dell G3.

Quelle est la façon d'écrire alors dans es6

Écriture :

then(参数1,参数2)

Fonction : ajouter une fonction de rappel lorsque l'état change dans l'instance de promesse

Le paramètre 1 est la fonction de rappel pour le succès,

Paramètre 2 est le rappel en cas d'échec Fonction

Valeur de retour : La méthode then() renvoie une nouvelle instance de promesse, et la méthode then() peut utiliser des opérations en chaîne

Connaissances étendues :

Promesse

1. La promesse est la programmation asynchrone Une solution.

2. Asynchrone : La façon précédente d'implémenter le fonctionnement asynchrone : ① fonction de rappel ② déclencheur d'événement

3. Fonction : résoudre le problème du fonctionnement asynchrone, différent des deux méthodes ci-dessus

4. . Caractéristiques : ① : L'état de l'objet n'est pas affecté par le monde extérieur. L'objet de promesse représente une opération asynchrone, qui a trois états : En attente (en cours). de l'opération asynchrone peut déterminer l'état actuel. Quel état ne peut être modifié par aucune autre opération

② : Une fois que l'état de l'objet change, il ne changera plus, et ce résultat peut être obtenu à tout moment (Là. il n'y a que deux possibilités pour que l'état de l'objet Promise change. : De penging à rempli et en attente à rejeté).

5 : Utilisation de base

(1) Vous pouvez créer une instance de promesse via le nouvel objet de promesse

const promise=new Promise(function(resolve,reject){})

(2) Description du paramètre : L'objet de promesse reçoit une fonction en paramètre, ce Les paramètres de la fonction sont résoudre et rejeter. Ce sont deux fonctions fournies par le moteur Javascript

(3) Le rôle de la fonction de résolution : appelée. lorsque l'opération asynchrone réussit, et que le résultat de l'opération asynchrone est passé en paramètre.

( 4) Le rôle de la fonction de rejet : Elle est appelée lorsqu'une opération asynchrone échoue, et l'erreur signalée par l'opération asynchrone est. passé en paramètre.

Remarque : une fois l'instance de promesse générée, vous pouvez utiliser la méthode then pour spécifier respectivement les fonctions de rappel réussies et échouées

.then() est une méthode d'instance de promesse, indiquant la prochaine opération à être effectué. Par exemple :

function ajax(){
            console.log("hello");
            return new Promise(function(resolve,reject){
                    setTimeout(function(){
                        resolve();
                    },1000)
                })
                ajax.then(function(){
                    console.log("world");
                })
            }

6.Method of Promise instance

(1)then(paramètre 1, paramètre 2)

Fonction : l'instance Promise ajoute une fonction de rappel lorsque l'état change

Le paramètre 1 est la fonction de rappel de réussite. , le paramètre 2 est la fonction de rappel d'échec

Valeur de retour : la méthode then() renvoie une nouvelle instance de promesse, la méthode then() peut être utilisée en opération en chaîne.

(2)catch()

Fonction : Spécifiez le rappel fonction lorsqu'une erreur se produit, ce qui équivaut au deuxième paramètre de la méthode then

Par exemple :

let ajax=function(num){
                return new Promise((resolve,reject){
                    if(num>5){
                        resolve(num);
                    }else{
                           throw new Error("出错了");
                        }
                })
            }
               ajax(2).then(function(num){
                console.log(num);
            }).catch(function(error){
                console.log(error);
            })

7 Méthode avancée de Promise

( 1) promise.all() ​

​ Fonction : Pack de plusieurs promesses. instances dans une nouvelle instance de promesse. Pour faire simple, un rappel réussi ne sera exécuté que si plusieurs opérations asynchrones réussissent, sinon un rappel échoué sera exécuté

Description du paramètre : Recevez un tableau en paramètre, chaque élément du. array est une instance de promesse

(2)promise.race()

Fonction : regroupez plusieurs instances de promesse dans une nouvelle instance de promesse, tant qu'il y en a une. L'instance change d'état en premier et l'état de la promesse change en conséquence

.

Description du paramètre : recevez un tableau en tant que paramètre, chaque élément du tableau est une instance de promesse

8 Style de promesse AjAx

                function promiseAjax(json){
                    let url=json.url;
                    let type=json.type||"get";
                    let data=json.data||{};
                    let str="";
                    for(let k in data){
                        str+=k+"="+data[k]+"&";
                    }
                    return new Promise((resolve,reject)=>{
                    let ajax=new XMLHttpRequest();
                    if(type.toLowerCase()==="get"){
                        ajax.open("get",`${url}?${str}time=${Date.now()}`,true);
                        ajax.send();
                    }else if(type.toLowerCase()==="post"){
                        ajax.open("post",url,true);
                        ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");
                        ajax.send(str.substring(0,str.laseIndexOf("&")));
                    }
                        ajax.onreadystatechange=function(){
                            if(ajax.readyState===4){
                                if(ajax.status>=200&&ajax.status<300){
                                    resolve(JSON.parse(ajax.responseText));
                                }else{
                                    let error=new Error();
                                    error.status=ajax.status;
                                    reject(error);
                                }
                            }
                        }
                    })
            }

[Recommandations associées :

Tutoriel vidéo javascript

, front-end web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent:Es6 a-t-il un mode usine ?Article suivant:Es6 a-t-il un mode usine ?