>웹 프론트엔드 >JS 튜토리얼 >자바스크립트에서 멀티스레딩을 구현하는 방법

자바스크립트에서 멀티스레딩을 구현하는 방법

醉折花枝作酒筹
醉折花枝作酒筹원래의
2021-07-19 15:10:414167검색

js에서는 Worker 클래스를 사용하여 멀티스레딩을 구현할 수 있습니다. 구문 형식은 "var Worker = new Worker(js 파일 경로);"입니다. 이 클래스를 사용하면 브라우저에서 js 파일을 단독으로 실행하는 데 사용되는 새 스레드가 적용됩니다.

자바스크립트에서 멀티스레딩을 구현하는 방법

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

우리 모두는 JS가 단일 스레드 언어라는 것을 알고 있습니다. 일부 비동기 이벤트도 JS의 메인 스레드에서 실행됩니다(실행 방법에 대한 자세한 내용은 JS 코드 실행 메커니즘에 대한 다른 블로그를 참조하세요). setTimeout, ajax 또는 dom 요소의 일부 이벤트와 같은 비동기 요청은 모두 JS 메인 스레드에서 실행됩니다. 이러한 작업은 실행을 위해 브라우저에서 새 스레드를 열지 않지만 이러한 비동기 작업이 수행될 때 또는 이벤트 큐에 들어갈 때만 실행됩니다. 트리거된 다음 JS 메인 스레드에서 실행을 시작합니다.

먼저 브라우저 스레드에 대해 이야기해 보겠습니다. 브라우저의 기본 스레드에는 UI 렌더링 스레드, JS 기본 스레드, GUI 이벤트 트리거 스레드 및 http 요청 스레드가 포함됩니다.

스크립트 언어로서 JS의 주요 목적은 사용자와 상호 작용하고 DOM을 운영하는 것입니다. 이는 단일 스레드만 가능하다는 것을 결정합니다. 그렇지 않으면 매우 복잡한 동기화 문제가 발생합니다. (여기에서는 이러한 문제를 연구하지 않습니다.)

그러나 단일 스레드 언어에는 매우 치명적인 확실성이 있습니다. 스크립트 언어가 실행되고 특정 기능 블록이 실행되는 데 많은 시간이 걸리면 차단이 발생합니다. 이러한 프로젝트의 경우 사용자 경험이 매우 열악하므로 프로젝트 개발 과정에서 이러한 현상이 허용되지 않습니다.

사실 JS는 이러한 차단 현상을 해결하는 데 사용되는 Worker 클래스를 제공합니다. 이 클래스를 사용하면 브라우저에서 새 스레드가 적용됩니다. 이 스레드는 js 파일을 단독으로 실행하는 데 사용됩니다.

var worker = new Worker(js文件路径);

그러면 이 명령문은 js 파일을 실행하기 위한 스레드에 적용됩니다.

물론 메인 스레드에는 새 스레드를 제어하고 데이터를 수신하는 몇 가지 메서드가 있습니다. 여기서는 일반적으로 사용되는 몇 가지 방법에 대해서만 설명합니다.

//postMessage(msg);
//postMessage方法把在新线程执行的结果发送到浏览器的js引擎线程里
worker.onmessage = function(){
    //获取在新线程中执行的js文件发送的数据 用event.data接收数据
    console.log( event.data )
};
setTimeout( function(){
    worker.terminate();
    //terminate方法用于关闭worker线程
},2000)

setTimeout( function(){
    worker = new Worker("js/test22.js");
    //再次开启worker线程
},3000)

새 스레드에서 postMessage() 메서드를 사용하여 일부 데이터를 메인 스레드로 보냅니다. 메인 스레드는 작업자의 onmessage 이벤트를 사용하여 데이터를 수신하므로 js의 멀티스레드 실행과 여러 간의 데이터 교환이 실현됩니다. 스레드.

【추천 학습: javascript 고급 튜토리얼

위 내용은 자바스크립트에서 멀티스레딩을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.