>  기사  >  웹 프론트엔드  >  JS 코드가 실행되는 순서는 무엇입니까?

JS 코드가 실행되는 순서는 무엇입니까?

php中世界最好的语言
php中世界最好的语言원래의
2017-12-31 11:35:142225검색

이번에 알려드리는 것은 JS 코드가 실행되는 순서입니다. 엄밀히 말하면 javascript는 다중 스레드라는 개념이 없습니다. 당신은 신중하게 분석해 봅시다.

1. 싱글 쓰레드란?

 간단히 말하면 코드가 실행되는 동안 다른 코드가 실행되려면 현재 코드가 실행될 때까지 기다려야 합니다. 코드로 설명하자면

for(var i=1;i<=3;i++){
  setTimeout(function(){
    console.log(i); //输出:4,4,4
  },0)
}

위의 코드를 살펴보겠습니다. 지연 시간이 0으로 설정되어 있으므로 루프가 한 번 실행되고 i가 즉시 인쇄되어야 하지만 최종 인쇄 결과는 다음과 같습니다. 는 4, 4, 4입니다. 위와 같은 결과가 나타나는 이유는 바로 js 코드가 단일 스레드 애플리케이션이기 때문입니다.

 실행 과정에서 for 루프가 먼저 발생하고 for 루프가 스레드에 먼저 들어갑니다. i=1일 때 루프가 setTimeOut에 도달한 후 for 루프는 아직 실행이 완료되지 않았으며 setTimeOut은 실행을 기다리는 장소(스레드 풀)에 배치됩니다. 이때 for 루프는 계속 실행됩니다. i=2일 때 for 루프는 아직 실행을 완료하지 않은 것입니다. 이 때 setTimeOut은 여전히 ​​실행을 기다리는 스레드 풀에 배치됩니다. for 루프가 3번 완료되면 for 루프 실행이 완료된 후 이 시점에서 스레드는 유휴 상태입니다. 스레드 풀에서 실행을 기다리고 있는 setTimeOut이 실행되어 for 루프 실행이 완료된 후 i가 4가 됩니다. 이므로 3개의 4가 인쇄됩니다.


2 위 상황을 변경하려면 다음 코드

//将var变为let
for(let i=1; i<=3; i++){
  setTimeOut(function(){
    console.log(i); //输出的结果为1,2,3
  },0);
}
//用自执行函数进行包裹
for(var i=1; i<=3; i++){
  !function(i){
    setTimeOut(function(){
      console.log(i); //输出的结果为1,2,3
    },0);
  }(i)
}


2를 사용하면 됩니다. 함수 범위 및 js

  >>>함수 범위

먼저 다음 개념을 이해해 봅시다:

 1. js 언어에는 c 언어와 유사한 블록 수준 범위가 없습니다.

  2. js 언어의 최상위 범위는 전역 범위라고 하는 window 개체의 범위 내에 있습니다. 전역 범위에 선언된 변수는 전역 변수입니다.

  3. js 함수 범위 내의 변수는 함수 내부에서만 사용할 수 있으며 함수 외부에서는 사용할 수 없습니다.

  4. JS 함수는 중첩될 수 있습니다. 여러 함수의 중첩은 범위의 레이어별 중첩을 구성합니다. 이를 JS에서는 범위 체인이라고 합니다.

 5. JS 스코프 체인 변수 접근 규칙:

   (1) 접근하려는 변수가 현재 스코프에 존재하는 경우 현재 스코프의 변수를 사용한다.

   (2) 접근하려는 변수가 현재 스코프에 존재하지 않는 경우, 글로벌 스코프까지 상위 스코프에서 검색됩니다.

  > 변수의 기본값은 정의되지 않습니다.

 2. 코드의 실행 단계 이 단계에서는 변수에 값이 할당되고 함수가 선언됩니다.

위의 몇 가지 특정 개념을 살펴본 후 코드를 예로 들어보겠습니다.

var a=1; //声明了一个全局变量
function func(){
  console.log(a); //输出:undefined。打印a,而在func这个作用域中已经声明了a变量,按照js的执行顺序,此时的a并未被赋值。
  var a=1;
  console.log(a); //输出:1。
}
func();

위의 코드를 살펴보세요. 첫 번째 a는 정의되지 않은 결과를 출력합니다. 이유: js 스코프 체인의 접근 규칙에 따라 접근하려는 변수 a가 현재 스코프에 존재하므로 현재 스코프의 변수를 사용합니다. js 코드의 실행 순서에 따라 이때 a 는 선언만 되고 할당되지는 않습니다. 기본값은 undefine 으로 출력됩니다.

두 번째 a는 1을 출력합니다. 이는 바로 이때 a가 선언되고 값이 할당되었기 때문에 a가 1을 출력하는 것입니다.


위의 소개를 읽으신 후 방법을 마스터하셨다고 믿습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!


관련 읽기:

require.js 사용 세부 정보

위 내용은 JS 코드가 실행되는 순서는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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