최근 내 작업은 조금 쉬웠습니다. 나는 항상 전에 본 약속의 단어를 기억했기 때문에 참을성있게 공부하기 위해 내려 갔다.
1 : 약속이란 무엇입니까? 이게 왜 거기에 있습니까?
우선, JavaScript의 비동기식 프로그래밍 중에 코드 작성 문제를 해결하기 위해 약속이 만들어졌습니다.
JavaScript가 개발되면 점점 더 많은 비동기 시나리오가 있습니다. 프론트 엔드에는 ajax, settimeout 등이 있으며 백엔드 노드는 비동기입니다. 전통적인 관행에 따르면, 다양한 콜백에 콜백을 포함시키는 것입니다. 코드는 사람들을 어지럽게 만들 수 있습니다.
현재 CommonJS 커뮤니티는 Promise/A+라는 사양을 제안했는데, 이는 비동기 코드를 구성하기 위해시기/다음을 포함하여 비동기 코드를 작성하는 방법을 정의했습니다.
이 사양은 매우 우아하기 때문에 많은 사람들이 브라우저 네이티브 지원 Promise (), jQuery, 언제 .js 등을 연기하는 브라우저 기본 지원 Promise ()를 포함 하여이 사양을 구현했습니다.
이 라이브러리는이 사양을 충족하기 때문에 배우십시오. 나는 주로 jQuery를 연기 한 것을 배웠 으므로이 기사는 주로이 구현에 대해 이야기합니다.
둘 : jQuery는 연기되었습니다
우선, 연기 된 대상에 대해 Ruan Yifeng 씨는 기사를 자세히 썼습니다. 여기를 클릭하십시오. 그의 기사를 먼저 읽은 다음 계속 읽는 것이 좋습니다.
위에서 언급했듯이 약속은 비동기식 (예 : Ajax)을 해결하도록 설계되었으므로 차이점을 비교해 봅시다.
클래식 jQuery ajax는 다음과 같이 작성되었습니다
코드 사본은 다음과 같습니다.
$ .ajax ({
유형 : "get",
URL : "",
성공 : function () {},
오류; 기능 () {}
});
성공 및 오류 매개 변수는 성공/실패시 콜백 함수입니다.
이제 JQuery의 Ajax 쓰기 방법이되었습니다
코드 사본은 다음과 같습니다.
$ .ajax ({
유형; "얻다",
URL : "" "
}). done (function () {}). 실패 (function () {});
성공 후, 완료 된 함수가 호출되고 실패 함수가 호출되면 실패 함수가 호출됩니다.
이것을 본 후, 당신은 질문이있을 수 있습니다.이 방법은 어떤 대상이 완료/실패입니까? $ .ajax ()는 어떤 개체를 반환하고 왜이 두 가지 방법이 있습니까?
답은 아래에 소개 된 이연된 대상에 있습니다.
JQuery는 새로운 유형의 연기를 제공합니다. $ .deferred ()로 생성하십시오. 예를 들어
코드 사본은 다음과 같습니다.
var def = $ .deferred ();
이 DEF는 완료/실패/해결/거부 등을 포함한 많은 방법을 상속합니다.
따라서 여기서 우리는 위 $ .ajax ()가 실제로이 개체를 반환한다는 것을 알고 있습니다.
연기 된 물체에는 많은 방법이 있습니다. 다음은 일반적으로 사용되는 몇 가지가 있습니다. 자세한 내용은 API를 참조하십시오.
첫 번째는 자연스럽게 DEF 객체를 생성하는 것입니다. 여기에는 다음과 같은 여러 가지 방법이 있습니다.
코드 사본은 다음과 같습니다.
var def = $ .deferred (); // 직접 생성하십시오
$ .ajax ({}); // ajax 메소드도 DEF 객체도 반환합니다
$. (); // 메소드가 DEF 객체를 반환 할 때
여기에서 $. ()에 대해 별도로 이야기 할 수 있습니다. 이 방법은 일반적으로 하나 이상의 연기 된 객체를 수신 한 다음이 연기 된 객체의 상태에 따라 $. ()에 의해 반환 된 객체의 상태를 결정합니다. 사용 시나리오 중 하나는 여러 AJAX 요청입니다. 그들 중 하나가 실패하면 실패로 간주됩니다. 그런 다음 $. ($. ajax (), $ .ajax ())와 같은 여러 ajax 메소드를 $. 그런 다음 $. DEF 객체를 반환 할 때 (이 두 요청의 결과에 따라 판단됨).
그런 다음 DEF 객체를 얻으면이 객체의 상태를 변경하는 일련의 방법이 있습니다.
코드 사본은 다음과 같습니다.
def.resolve (); // DEF 객체를 완료하도록 설정하면 DEF.DONE ()에 바인딩 된 함수가 즉시 실행됩니다.
def.reject (); // def 객체를 실패한 것으로 설정하면 def.fail ()에 바인딩 된 함수가 즉시 실행됩니다.
def.notify (); // DEF 객체를 실행하는 동안 해당 콜백은 def.progress ()입니다.
다음은 콜백을 설정하는 방법입니다. 순서는 위의 것, 즉 콜백에 어떤 주를 호출 할 것인지에 해당합니다.
코드 사본은 다음과 같습니다.
def.done (); // def.Resolve ()에 해당합니다.
def.fail (); // def.Reject ()에 해당합니다.
def.progress (); // def.Notify ()에 해당합니다.
// 특별한
def.always (); // 성공했거나 실패한 경우 호출
def.then (); // 순서, 성공, 실패 및 진행에서 여러 기능을 수락합니다.
실제로,이 시점에서, 연기 된 물체의 사용은 거의 동일합니다. 그러나 jQuery는 또한 몇 가지 API를 제공합니다
코드 사본은 다음과 같습니다.
// 현재 상태 클래스를 확인합니다
def.isrejected ();
def.isresolved ();
def.state ();
이름에서 알 수 있듯이 이러한 API는 자세히 논의되지 않습니다. 자세한 내용은 위에 주어진 jQuery API 문서를 확인할 수 있습니다.
다른 방법이 있는데, 이는 때때로 외부 DEF 객체를 제공하기를 원하는 다음이 객체는 다양한 상태에 대한 콜백을 설정할 수 있지만 상태를 변경할 수 없으므로 사용할 수 있습니다.
코드 사본은 다음과 같습니다.
def.promise ();
연기 된 물체의 하위 집합 인 Promisee 대상을 반환하십시오. 해결/거부 및 기타 방법없이 완료/실패 및 기타 방법을 사용할 수 있습니다. 주로 DEF 객체의 상태가 외부에서 수정되는 것을 방지하는 것입니다.
이 시점에서 모든 약속이 논의되었습니다. 이제 프로젝트에서 사용할 수 있습니다. 또한, 나는 당신이 초기에 미리 행복하기를 바랍니다. 양의 행복한 해를 기원합니다 ^^.