단일 스레드 JS 실행 문제에 대한 자세한 설명-JS 튜토리얼-php.cn

단일 스레드 JS 실행 문제에 대한 자세한 설명

小云云

풀어 주다： 2018-01-16 09:23:09

원래의

1518명이 탐색했습니다.

Javascript를 배우다 보면 많은 친구들이 실행 문제에 대해 의구심을 품게 됩니다. 편집자는 여러분의 이해를 돕기 위해 이 글을 통해 JS의 실행 문제에 대한 자세한 분석과 소개를 제공할 것입니다. 이 글에서는 주로 싱글 스레드 자바스크립트의 실행 문제를 자세히 설명하고, 예제를 통해 사용법을 분석합니다.

1. 소개

js를 계속 배우다 보면, js를 너무 오랫동안 사용하다 보면 이 js가 브라우저에서 어떻게 실행되는지 알 수 없게 됩니다. 그래서 JS의 실행 과정을 요약하기 위해 많은 정보를 참고했고, 공유하여 모두와 함께 배울 수 있었습니다.

이 글에서는 주로 단일 스레드 JS에 대해 설명합니다.
관련 명사: JS 엔진, 단일 스레드, 실행 스택, 실행 컨텍스트

2 JS 엔진

JS 엔진은 브라우저의 중요한 부분이며 주로 읽기 및 읽기에 사용됩니다. js를 실행합니다. 이 사람은 js를 실행하는 사람이지만 js 실행 그 이상입니다.

주요 브라우저의 JS 엔진:

Browser

Js 엔진

Chrome V8 Firefox SpiderMonkey IE Chakra(Chakra) Safari Nitro/JavaScript Core Opera Carakan

각 브라우저의 JS 엔진은 다르지만 js 실행 메커니즘은 다릅니다. 대략 동일합니다.

3. JS 실행은 단일 스레드입니다

싱글 스레드는 JS 실행 시 JS 엔진이 실행을 위해 하나의 스레드만 할당한다는 의미입니다. 즉, JS 실행 시 단일 스레드입니다.

a. 먼저 스레드를 이해하세요. 어떤 사람들은 스레드가 무엇인지 궁금해할 수도 있습니다.

직접적인 예를 들어보겠습니다. 브라우저(애플리케이션)를 열면 브라우저가 프로세스입니다. 브라우저를 연 후에는 요청 보내기, 요청 수락, 페이지 렌더링, js 실행 등 많은 작업(다양한 작업 분할)을 수행해야 합니다. 이는 스레드입니다.

여기서는 간단하게 이야기만 하려고 합니다. 자세한 내용은 컴퓨터 운영체제에 대한 정보를 찾아보실 수 있습니다.

b. 왜 단일 스레드인가요? js 실행이 다중 스레드라면 더 빠르지 않을까요?

이것은 JS의 역사로 거슬러 올라갑니다. Brendan Eich 형제가 10일 만에 JS를 만들었습니다. 당시 JS의 용도는 간단한 브라우저 상호작용과 검증, DOM 운영이었죠. 그렇다면 왜 그렇게 복잡하게 설계되었는가? 게다가 스레드가 여러 개인 경우 DOM을 운영하는 것이 번거로울 것입니다. 한 스레드가 DOM 노드 데이터를 읽는 동안 다른 스레드가 DOM 노드를 삭제한다고 가정해 보겠습니다. 따라서 하나의 js 스레드로 충분합니다. 즉, 단계별로 실행됩니다.

c. 단일 스레드

는 단계별로만 실행될 수 있으므로 다음 코드를 실행하면 차단이 발생하고(무한 while 루프가 있음) hello가 팝업되지 않습니다

while(1){}
alert('hello');

로그인 후 복사

4. stack

js 실행 구현 단일 스레드일 때 js 엔진은 실행 스택을 유지합니다. (First in, last out)

예를 들어보겠습니다. 이 코드를 실행하면 실행 스택이 수행됩니다.

//运行代码
sayHello();
function sayHello(){
var message = getMessage();
console.log(message);
}
function getMessage(){
return 'hello';
}

로그인 후 복사

실행 스택 코드 시뮬레이션

//执行栈
var exeStack = [];
//先压如全局执行环境
exeStack.push('globalContext');
//遇到执行sayHello函数，ok，压进去
exeStack.push('sayHello');
//执行sayHello函数发现，还有个getMessage函数，ok，压进栈
exeStack.push('getMessage');
//执行完了getMessage函数，弹栈
exeStack.pop();
//继续执行sayHello函数，又发现有console.log这个家伙，ok，你进栈
exeStack.push('console.log');
//执行了console后，输出hello，console 弹栈
exeStack.pop();
//这时sayHello执行完，弹栈
exeStack.pop();
//最后整个代码执行完，全局环境弹栈
exeStack.pop();

로그인 후 복사

실행 스택 아이콘:

이것은 주로 js 실행의 전반적인 프로세스이지만 스택에 푸시된 (추상적인) 항목에 대해 혼란스러울 수 있습니다.
실행 컨텍스트, global은 전역 실행 컨텍스트, 나머지는 함수 실행 컨텍스트라고 말씀드릴 수 있는데, 이 컨텍스트들이 정확히 무엇을 담고 있는지는 다음 글에서 자세히 설명하겠습니다.

5. 요약

이 글에서는 주로 js 싱글 스레딩이 무엇인지, 어떻게 구현하는지 설명합니다. 먼저 js 실행 과정에 대한 전반적인 내용을 살펴보겠습니다. 그리고 실행 컨텍스트.