es6에서 작성하는 방법은 무엇입니까?

es6에서는 then의 작성 방법은 "then(Promise 인스턴스에 성공 상태 변경에 대한 콜백 함수 추가, 실패에 대한 콜백 함수 추가)"입니다. 상태가 변경되고 반환된 결과는 새로운 Promise 인스턴스이며 메서드를 연결할 수 있습니다.

이 튜토리얼의 운영 환경: Windows 10 시스템, ECMAScript 버전 6.0, Dell G3 컴퓨터.

es6에서 Then을 작성하는 방법은 무엇입니까

작성:

then(参数1,参数2)

Function: Promise 인스턴스로 상태가 변경될 때 콜백 함수를 추가합니다

Parameter 1은 성공을 위한 콜백 함수,

Parameter 2는 실패에 대한 콜백 함수

반환 값: then() 메소드는 새로운 promise 인스턴스를 반환하고 then() 메소드는 체인 작업을 사용할 수 있습니다.

Promise

1. Promise는 비동기 프로그래밍 솔루션입니다.

2. 비동기 작업을 구현하는 이전 방법: ① 콜백 함수 ② 이벤트 트리거

3. 기능: 위의 두 가지 방법과 다른 비동기 작업 문제를 해결합니다. 특징: ①: 객체의 상태는 외부 세계의 영향을 받지 않습니다. Promise 객체는 보류(진행 중), 이행(성공), 거부(실패)의 세 가지 상태를 갖는 비동기 작업을 나타냅니다. 비동기 작업의 현재 상태는 다른 작업으로 변경할 수 없습니다.

②: 개체의 상태는 한 번 변경되면 다시 변경되지 않으며 이 결과는 언제든지 얻을 수 있습니다. Promise 객체의 상태가 변경될 수 있는 가능성은 두 가지뿐입니다. 보류에서 이행으로, 보류에서 거부로).

5: 기본 사용법

(1) 새 Promise 객체를 통해 Promise 인스턴스를 생성할 수 있습니다

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

(2) 매개변수 설명: Promise 개체는 함수를 매개변수로 받습니다. 함수의 매개변수는 Javascript 엔진에서 제공하는 두 가지 함수입니다.

(3) 해결 함수의 역할: 호출됩니다. 비동기 작업이 성공하고 비동기 작업의 결과가 매개변수로 전달되는 경우

( 4) 거부 함수의 역할: 비동기 작업이 실패할 때 호출되며 비동기 작업에서 보고되는 오류는 다음과 같습니다. 매개변수로 전달됩니다.

참고: Promise 인스턴스가 생성된 후 then 메서드를 사용하여 성공한 콜백 함수와 실패한 콜백 함수를 각각 지정할 수 있습니다

.then()은 Promise 인스턴스의 메서드로 다음 작업을 나타냅니다. 예:

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 인스턴스

(1)then(매개변수 1, 매개변수 2)

함수: Promise 인스턴스는 상태가 변경될 때 콜백 함수를 추가합니다

매개변수 1은 성공 콜백 함수입니다. , 매개변수 2는 실패 콜백 함수

반환 값: then() 메서드는 새로운 Promise 인스턴스를 반환하며, then() 메서드를 사용할 수 있습니다. 연쇄 연산입니다.

(2)catch()

함수: 콜백을 지정합니다. then 메소드의 두 번째 매개변수에 해당하는 오류 발생 시 함수

예:

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. Promise

의 고급 메소드( 1) promise.all()

함수: 여러 Promise 인스턴스를 다음으로 압축합니다. 간단히 말해서, 성공적인 콜백은 여러 비동기 작업이 성공한 경우에만 실행되고, 그렇지 않으면 실패한 콜백이 실행됩니다.

매개변수 설명: 배열을 매개변수로 받습니다. 배열의 각 항목은 다음과 같습니다. Promise 인스턴스

(2)promise.race()

함수: 하나라도 있는 한 여러 Promise 인스턴스를 새 Promise 인스턴스로 묶습니다. 인스턴스가 먼저 상태를 변경하고 그에 따라 Promise 상태도 변경됩니다. 설명: 배열을 매개변수로 받습니다. 배열의 각 항목은 Promise 인스턴스입니다.

8. Promise 스타일 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);
                                }
                            }
                        }
                    })
            }

[관련 권장사항:

javascript video Tutorial

,

web front-end

]

위 내용은 es6에서 작성하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!