JS의 변수 범위에 대한 심층 분석

변수에는 전역 변수와 지역 변수라는 두 가지 범위가 있습니다. 이 글은 주로 JS의 변수 범위에 대한 심층 분석을 공유하여 모든 사람에게 도움이 되기를 바랍니다.

전역 변수

最外层函数定义的变量拥有全局作用域，即对任何内部函数来说，都是可以访问的：
    var n=10;
　　function f1(){
　　　　console.log(n);
　　}
　　f1(); // 输出10,说明全局变量n在函数内部被读取

로컬 변수

局部变量：在函数内部声明的变量。函数内部的变量，外部无法读取。
　function f1(){
　　　　var n=10;
　　}
　　console.log(n); // 没有定义，说明函数内部的变量，外部无法读取。

ES5

for(var i =0;i<10;i++){

}
console.log(i)

js의 범위, 이 코드에서는 어떤 결과가 나올 것이라고 생각하시나요? 답은 10입니다. ES5에는 전역 범위와 함수 범위만 있고 블록 범위는 없습니다. 물론 블록 범위의 기능을 구현할 수 있습니다. 아래 코드를 보십시오.

(function(){
for(var i =0;i<10;i++){

}
})()
console.log(i)

답은 1입니다. 이 작성 방식을 IIFE(즉시 호출 함수 표현식)라고 합니다. 이는 실제로 이 범위에 선언된 변수가 블록 내에서만 유효하며 그럴 수 없습니다. 외부에서 액세스할 수 있습니다. 이 작성 방법의 장점은 전역 변수를 오염시키지 않는다는 것입니다.
여기서 한 가지 더 언급하고 싶은 점은 ES5에서는 변수 선언이 엄격하지 않다는 것입니다. a=10을 사용하여 전역 변수를 직접 선언할 수 있습니다. 다음과 같습니다: r

a=10;console.log(a)

출력 10, 여기서는 변수를 사용하여 사용할 수 있습니다. 실제로 JS가 한 가지 작업을 도와주었습니다. 다음 코드를 실행합니다:

var a=undefined;a=10;console.log(a)

그런 다음 변수 승격이라는 좀 더 고급 작업을 수행해 보겠습니다. (ES5의 개념, ES6의 새로운 사용법은 변수 승격을 유발하지 않습니다.) 코드를 살펴보세요.

a=10;
(function(){console.log(a)var a=1;
})();

위 코드는 무엇을 출력합니까? 분석해 보겠습니다.

var a=undefined;
a=10;
(function(){var a=undefined;
console.log(a)
a=1;
})();

이제 변수 승격이 무엇을 의미하는지 이해하셨습니다. 사실 이는 선언을 앞으로 가져오는 것을 의미하므로 출력이 정의되지 않습니다.

ES6의 범위

for(let i=0;i<10;i++){
}console.log(a)

출력 a는 여기에 정의되어 있지 않습니다. , let을 사용하여 선언된 변수는 선언 중에 사용할 수 없습니다.

a=3let a =10;alert(a)

는 정의되지 않은 것을 출력합니다. 이유는 무엇입니까? Ruan Yifeng의 ES6에서는 let 명령이 블록 수준 범위에 존재하는 한 이 명령이 선언하는 변수는 이 영역에 "바인딩"되며 더 이상 외부 영향의 영향을 받지 않을 것이라고 말합니다. ES6에서는 블록에 let 및 const 명령이 있는 경우 이 블록에서 이러한 명령으로 선언된 변수가 처음부터 닫힌 범위를 형성한다고 명확하게 규정합니다. 선언 전에 이러한 변수를 사용하면 오류가 발생합니다.

var a, b;

(function () {
    console.log(a);// undefined
    console.log(b);// undefined

    var a = b = 0;// (1)

    console.log(a);// 0
    console.log(b);// 0
})();

console.log('window', a);// window undefined
console.log('window', b);// window 0

관련 권장사항:

php

php

JavaScript 변수 범위, 메모리, DOM 누수 및 기타 문제의 예에 대한 자세한 설명

🎜JavaScript 변수 범위 예 소개🎜 🎜

위 내용은 JS의 변수 범위에 대한 심층 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!