>  기사  >  웹 프론트엔드  >  자바스크립트의 범위란 무엇인가요?

자바스크립트의 범위란 무엇인가요?

青灯夜游
青灯夜游원래의
2022-01-18 17:50:353413검색

JavaScript에서 범위는 변수(객체, 함수)의 접근 가능한 범위이며, 스크립트 코드에서 읽고 쓸 수 있는 변수의 유효 범위는 변수의 가시성과 수명주기를 제어할 수 있습니다.

자바스크립트의 범위란 무엇인가요?

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

거의 모든 언어에는 범위라는 개념이 있습니다. 간단히 말해서 Scope는 변수의 접근 가능한 범위입니다. 즉, 범위는 변수의 가시성과 수명 주기를 제어합니다.

JavaScript에서는 객체와 함수도 변수입니다.

ECMAScript6 이전에는 변수 범위가 주로 전역 범위와 로컬 범위(함수 범위라고도 함)로 나누어졌습니다. ECMAScript6 이후에는 변수 범위가 주로 전역 범위와 로컬 범위로 나누어졌습니다. 도메인 및 블록 수준 범위.

해당 범위의 변수를 각각 전역 변수, 지역 변수, 블록 수준 변수라고 합니다.

  • 전역 변수는 모든 함수 외부에서 선언됩니다.

  • 로컬 변수는 함수 본문 또는 함수의 명명된 매개변수에 선언된 변수입니다.

  • 블록 수준 변수는 블록에서 선언된 변수입니다. 블록에서.

변수의 범위는 선언 방법과 밀접한 관련이 있습니다. var를 사용하여 선언된 변수에는 전역 범위와 함수 범위가 있으며, let 및 const를 사용하여 선언된 변수에는 전역 범위, 로컬 범위 및 블록 수준 범위가 있습니다.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<script>
			var v1 = "JavaScript"; //全局变量
			let v2 = "JScript"; //全局变量
			let v3 = "Script"; //全局变量
			scopeTest(); //调用函数
			function scopeTest() {
				var lv = "aaa"; //局部变量
				var v1 = "bbb"; //局部变量
				let v2 = "ccc"; //局部变量
				if (true) {
					let lv = "123"; //块级变量
					console.log("块内输出的lv = " + lv); //123
				}
				console.log("函数体内输出的lv = " + lv); //aaa
				console.log("函数体内输出的v1 = " + v1); //bbb
				console.log("函数体内输出的v2 = " + v2); //ccc
				console.log("函数体内输出的v3 = " + v3); //Script
				//v4为全局变量,赋值在后面,因而值为undefined
				console.log("函数体内输出的v4 = " + v4);
			}
			var v4 = "VBScript"; //全局变量
			console.log("函数体外输出的lv = " + lv); //① 报ReferenceError错误
			console.log("函数体外输出的v1 = " + v1); //JavaScript
			console.log("函数体外输出的v2 = " + v2); //JScript
			console.log("函数体外输出的v3 = " + v3); //Script
			console.log("函数体外输出的v3 = " + v4); //VBScript
		</script>
	</body>
</html>

위 스크립트 코드는 각각 전역 변수 4개, 지역 변수 3개, 블록 수준 변수 1개를 선언합니다. scopeTest 함수 외부에서 변수 v1, v2, v3 및 v4는 전역 변수이고,scopeTest 함수 본문 내에서는 lv 및 v2가 if 판단 블록의 전역 변수이고, lv는 블록 수준 변수입니다.

지역 변수 v1 및 v2가 전역 변수 v1 및 v2와 동일한 이름을 갖는 것을 볼 수 있습니다.scopeTest 함수 본문에서 지역 변수 v1 및 v2는 유효하므로 함수 본문에서 이 두 변수의 출력 결과는 "bbb"입니다. " 및 "ccc" 각각. "; 함수 본문 외부에서는 전역 변수 v1 및 v2가 유효하므로 함수 본문 외부에서는 이 두 변수의 출력 결과가 각각 "JavaScript" 및 "JScript"입니다.

또한 블록 수준 변수 lv와 로컬 변수 lv는 이름이 동일합니다. if 판단 블록에서는 블록 수준 변수 lv가 유효하므로 블록의 출력 결과는 "123"입니다. 블록, 지역 변수 lv는 유효하고 lv 변수는 출력 결과가 "aaa"입니다.

또한 전역 변수 v3, v4는 함수 본문에 덮어쓰이지 않아 전역 변수의 값이 출력되므로 v3의 함수 본문 내부와 외부의 출력 결과는 "Script"인 반면, v4 변수의 할당은 함수 호출에 있으므로 함수 본문에서 v4의 출력 결과는 "정의되지 않음"이고, 함수 본문 외부의 출력은 선언 이후이므로 결과는 "VBScript"입니다. lv는 지역 변수이므로 함수 외부에서 이 변수에 액세스하면 "ReferenceError" 오류가 보고됩니다.

크롬 브라우저에서 위의 코드를 실행한 후, 브라우저의 콘솔을 열면 아래 그림과 같이 출력되는 것을 확인할 수 있습니다.

자바스크립트의 범위란 무엇인가요?

28번째 줄의 오류 이유:

lv 변수는 지역 변수이며 함수를 떠난 후에는 유효하지 않습니다. 이 코드 줄을 주석 처리한 후 실행하면 브라우저 콘솔을 열면 다음이 표시됩니다.

자바스크립트의 범위란 무엇인가요?

[관련 권장 사항: javascript 학습 튜토리얼]

위 내용은 자바스크립트의 범위란 무엇인가요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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