자바스크립트의 비동기 프로그래밍 방법은 무엇입니까?

비동기 프로그래밍을 구현하는 JavaScript 메서드에는 이해 및 구현이 쉽지만 코드 유지 관리가 어려운 콜백 메서드, 게시/구독 메서드, 이해하기 쉽고 여러 이벤트를 바인딩할 수 있지만 작업 흐름이 혼란스러운 이벤트 수신 메서드, 및 약속 방법

비동기 모드는 매우 중요합니다. 브라우저 측에서 장기 실행 작업은 응답하지 않는 것을 방지하기 위해 비동기식으로 실행되어야 합니다. 다음으로 기사에서 JavaScript의 비동기 프로그래밍 방법 구현에 대해 자세히 소개하겠습니다. 이는 특정 참조 효과가 있으며 모든 사람에게 도움이 되기를 바랍니다.

[추천 과정: JavaScript 튜토리얼 ]

자바스크립트의 실행 환경은 싱글스레드(Single-threaded)라는 것은 누구나 알고 있으며, 싱글스레딩이란 언제든지 하나의 작업만 실행할 수 있다는 것을 의미합니다. 여러 작업이 발생하면 이전 작업이 완료될 때까지 대기열에서 기다려야 합니다. 따라서 시간이 많이 걸립니다. 동기 모드는 이 단일 스레드 모드와 완전히 다릅니다. 각 작업에는 콜백 함수가 실행되고 후속 작업이 수행됩니다. 작업은 이전 작업이 동시에 실행될 수 있습니다. 작업의 실행 순서는 대기열의 작업 순서와 다릅니다.

방법 1: 콜백 방법

이 방법은 비동기 프로그래밍의 기본 방법으로 f1과 f2라는 두 가지 함수가 있다고 가정합니다. 첫 번째 함수의 결과를 기다립니다.

F1（）; 
F2（）;

f1이 장기 실행 작업인 경우 f1을 재정의하고 f2를 f1의 콜백 함수로 사용할 수 있습니다.

function f1(callback){
setTimeout(function () {
 callback();
    }, 1000);
}

이 모드를 사용하면 동기 작업을 비동기 작업으로 변환할 수 있습니다. f1은 프로그램 실행을 차단하지 않고 기본 논리를 먼저 실행한 다음 시간이 많이 걸리는 작업을 수행합니다

#🎜🎜 #콜백 함수의 장점은 이해하고 구현하기 쉽다는 것입니다. 단점은 코드를 읽을 수 없고 유지 관리가 불가능하고, 서로 다른 구성 요소가 고도로 결합되어 있으며, 작업 흐름이 매우 혼란스럽고, 각 작업에 콜백 함수가 하나만 있을 수 있다는 것입니다.

방법 2: 게시/구독

이 이벤트는 작업이 다음과 같은 경우 신호 센터가 있다고 가정하면 이해할 수 있습니다. 완료되면 신호 센터에 보고됩니다. 신호를 게시하고 다른 작업은 신호 센터에 가입하여 지정된 신호를 수신할 수 있습니다. 이 접근 방식을 게시/구독 패턴 또는 관찰자 패턴이라고 합니다.

예: f2는 신호를 완료하기 위해 신호 센터를 구독합니다

jQuery.subscribe（“done”，f2）;

그런 다음 f1을

function f1(){
    setTimeout(function () {
     jQuery.publish("done");
    }, 1000);
}

jQuery.publish(" done") 은 f1이 실행을 완료하면 신호 센터에 완료 신호를 보낸 다음 f2가 실행을 시작함을 의미합니다.

jQuery.publish（“done”）表示当f1完成执行时它将向信号中心发送一个完成信号，然后f2将开始执行。

当f2完成执行时，它可以取消订阅。

jQuery.unsubscribe（“done”，f2）;

方法三：事件监听

另一种方法是事件驱动模式，一个任务的执行不依赖于代码顺序，它们等待一个事件发生。在本例中仍然使用f1和f2，首先将一个事件绑定到f1。

f1.on（'done'，f2）;

上述代码的含义是如果f1完成事件发生，则执行f2。

function f1(){
    setTimeout(function () {
      f1.trigger('done');
    }, 1000);
}

f1.trigger（'done'）f2 실행이 완료되면 구독을 취소할 수 있습니다.

F1（）.then（F2）

방법 3: 이벤트 청취

또 다른 방법은 작업 실행이 코드에 의존하지 않는 것입니다. 시퀀스는 이벤트가 발생할 때까지 기다립니다. 이 예에서는 여전히 f1과 f2를 사용하여 먼저 이벤트를 f1에 바인딩합니다.

function f1(){
    var dfd = $.Deferred();
    setTimeout(function () {
        dfd.resolve();
    }, 500);
    return dfd.promise;
}

위 코드의 의미는 f1 완료 이벤트가 발생하면 f2가 실행된다는 의미입니다.

f1().then(f2).then(f3);

f1.trigger('done')은 done 이벤트를 트리거한 다음 실행이 완료되면 f2를 실행한다는 의미입니다.

이해하기 쉽고 여러 이벤트를 묶을 수 있다는 장점이 있고, 각 이벤트에 많은 콜백 함수가 있을 수 있으며 분리가 가능해 모듈화에 유리합니다. 단점은 전체 프로그램이 이벤트 중심이고 작업 흐름이 그다지 명확하지 않다는 것입니다.

Method 4: Promises 메서드

Promises 개체는 비동기 프로그래밍을 위한 공통 인터페이스를 제공하기 위해 CommonJS에서 제안한 표준입니다. 각 비동기 작업은 콜백 함수를 설정할 수 있는 then 메서드가 있는 Promises 객체를 반환합니다. 예를 들어 f1의 콜백 함수 f2:

f1().then(f2).fail(f3);

f1은 다음과 같이 작성해야 합니다.

rrreee

#🎜🎜#장점은 콜백 함수가 다음과 같다는 것입니다. 연결되어 있으며 프로그램의 작업 흐름은 매우 명확하며 강력한 기능을 달성하는 데 사용할 수 있는 완전한 연결 방법 세트를 갖추고 있습니다. #🎜🎜##🎜🎜#예를 들어 여러 콜백 함수를 설정합니다. #🎜🎜#rrreee#🎜🎜#오류가 있는 경우의 예도 있습니다. #🎜🎜#rrreee#🎜🎜#다른 세 가지 방법 한 가지 장점은 작업이 완료되면 콜백 함수를 더 추가하면 즉시 실행된다는 것입니다. 단점은 이해하기가 쉽지 않다는 점이다. #🎜🎜##🎜🎜#요약: 위 내용은 이 글의 전체 내용입니다. 모든 분들께 도움이 되었으면 좋겠습니다. #🎜🎜#

위 내용은 자바스크립트의 비동기 프로그래밍 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!