자바스크립트 차단 문제

hzc앞으로: 2020-06-13 09:23:155383검색

javascript가 프로그램 실행을 차단합니다

javascript의 스레딩 문제

JavaScript는 단일 스레드이므로 JS 프로그램 실행이 전체 프로그램 프로세스를 차지합니다. 우리는 일반적으로 차단을 줄이기 위해 최선을 다합니다. 그러나 일부 특수한 시나리오에서는 프로그램 실행을 차단해야 하므로 오늘은 그 반대로 Js 실행을 일반적인 방식으로 차단하는 방법을 살펴보겠습니다.

방법 1: 무한 루프

단일 스레드 JavaScript는 프로그램이 계속 계산하는 한 프로그램 프로세스를 차단할 수 있습니다.

function sleep(d){  
    let t = Date.now();
    while(Date.now() - t <= d);  
}

function test() {
    console.log(&#39;sleep&#39;);
    sleep(10000);
    console.log(&#39;run&#39;);
}

test();

하지만 이 방법은 실제로 무한히 점유하는 컴퓨터 리소스를 사용하여 애니메이션이 정지된 상태를 생성하므로 실제로 프로그램 프로세스를 중지하지 않고도 많은 양의 CPU를 소비하므로 권장되지 않습니다.

방법 2: setTimeout

우리는 setTimeout 콜백을 직접 사용하여 프로그램의 프로세스를 차단합니다. 물론 프로그램을 계속해서 CPU를 유휴 상태로 만드는 것은 허용하지 않습니다. writing is not 동기 프로그래밍 방법:

function test() {
    console.log(&#39;sleep&#39;);
    setTimeout(function() {
        console.log(&#39;run&#39;);
    }, 10000)
}

await

ES의 고급 버전에는 Promise 및 Wait와 같은 비동기 프로그래밍이 있는데, 이는 프로그램 작성을 더욱 우아하고 단순하게 만들어 줍니다. 또한 setTimeout의 도움으로 해결해야 합니다. 다음 방법을 사용하는 것이 좋습니다:

function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

async function test() {
    console.log(&#39;sleep&#39;);
    await sleep(10000);
    console.log(&#39;run&#39;);
}

test();

방법 3: 생성기 및 산출량

ES6 반복자에도 비동기 프로그래밍 기능이 있지만 이 작성 방법은 상당히 모호하고 이해하기 어렵습니다. 더 적게 사용하는 것이 좋습니다:

function sleep(time) {
    setTimeout(function () {
        test.next();
    }, time);
}

function* gen() {
    console.log(&#39;sleep&#39;);
    yield sleep(10000);
    console.log(&#39;10 second later&#39;);
}

let test = gen();
test.next();

요약

위의 방법은 두 가지 유형으로 요약될 수 있습니다. 하나는 Js의 단일 스레드 메커니즘을 강제 차단 방식으로 사용하는 것이고, 다른 하나는 다음과 같은 비동기 이벤트 메커니즘을 사용하는 것입니다. Js + 고급 비동기 프로그래밍 구문. 물론 실제 비즈니스 상황에서는 사용자가 UI를 통해 작업을 계속하는 것을 금지하는 경우가 거의 없습니다. 이러한 탐색은 단지 JS의 몇 가지 기본 원칙을 이해하는 데 도움이 됩니다.

자바스크립트 차단 문제

관련 기사