JS에서의 역할 영역 및 변수 범위 분석

변수 작용역
js는 스크립트 언어로서 c,java와 다르다.
전역 변수
js에서 전역 변수를 설명하는 방법은 다음과 같습니다.
1. 함수 밖에서 var를 통해 설명한다.

var test ="hello";
console.log(test);
function a(){
  test="xx";
  console.log(test);
}
a();
console.log(test);
결과:
hello
xx
xx
이런 방식은 성명된 변수를 통해 어느 곳에서든 수정하고 사용할 수 있다.
2. 함수에서 은사의 성명 변수

function a(){
  test=22;
  console.log(test);
}
a();
console.log(test);
결과:
22
22
js는 약한 유형의 스크립트 언어이기 때문에 사용하기 전에 정의할 필요가 없기 때문에 이런 방식을 통해 전역 변수를 설명할 수 있습니다.
반례를 살펴보겠습니다.

var test="aa";
console.log(test);
function a(test){
  test=22;
  console.log(test);
}
a(test);
console.log(test);
결과:
aa
22
aa
함수에서test값을 수정한 것을 볼 수 있지만 두 번째로 함수 밖에서 출력한 값은 변하지 않았습니다.함수 과정에서 값 전달만 했기 때문이다.국부 변수는 전역 변수를 덮어쓰고 국부 변수만 수정합니다.
함수의 매개 변수에 정의된 변수는 전역 변수가 아니기 때문이다.
반례2:

function a(){
  var test="aa";
  console.log(test);
}
a();
console.log(test);
결과
aa
notdefine
함수 내에서 var를 통해 설명하는 변수는 국부 변수로 함수 외에는 접근할 수 없습니다.
변수 작용역
js의 작용역과 c와java 이런 언어의 작용역도 다르다. 꼬마들은 예전에 이것 때문에 머리가 아팠는데 나중에 열심히 공부한 후에 알게 되었다.
1.js에는 블록 범위가 없습니다.

if(1!=1){
  var y=c;
}
console.log(y)
 
if(1==1){
  var x=a;
}
console.log(x);
결과:
undefine
a
if 코드 블록에 정의된 두 변수를 볼 수 있습니다. if 블록 밖에서 출력하고 판단이 성공하면 안에 있는 성명문을 실행합니다. 성명문이 실행되면 코드 블록 밖에서 접근할 수 있습니다.
코드 블록에 설명된 변수도 전역 변수임을 알 수 있다.
2.js의 전역 변수는 윈도우의 속성이 됩니다

var x=0;
console.log(window.x);
결과:
0
3. 변수 증가

var c=0;
function a(){
  console.log(c);
}
a();
결과:
0

var c=0;
function a(){
  console.log(c);
  var c=11;
}
a();
결과:
undefine
함수에 성명문 한 줄을 넣으면 결과가 다르다는 것을 알 수 있는데 이런 이유가 무엇일까?
사실 두 번째 코드 블록의 실행 순서는 다음과 같다.

var c=0;
function a(){
  var c;
  console.log(c);
  c=11;
}
a();
함수에서 그는 먼저 성명문을 첫 줄로 올리지만 부치는 올리지 않는다.그리고 국부 변수는 전역 변수를 덮어씁니다. c를 인쇄할 때 국부 변수가 아직 오지 않았습니다.
그리고 부치는 그래서 undefine입니다.
변수 승급은 실행할 수 있는 변수뿐만 아니라 실행할 수 없는 변수도 승급합니다.

var c=10;
function a(){
  console.log(c);
  if(false) {
    var c = 10;
  }
}
a();
결과:
undefine
if판단에서 국부 변수 c를 정의했기 때문에if조건이 성립되지 않지만 변수를 향상시킬 수 있기 때문에 인쇄 c도undefine이다.
4.let 변수
위의 예를 통해 var로 변수의 폐단을 정의할 수 있습니다.
1.var가 정의한 변수는 블록 역할 영역이 없습니다.
2. var가 정의한 전역 변수는 전역 윈도우 대상의 속성을 자동으로 추가합니다.
3. var 변수는 미리 불러옵니다(변수 증가).
let은 이런 문제들을 해결하기 위해 탄생한 것이다.

for(let i=0;i<5;i++){
  
}
console.log(i);
결과:
잘못 보고하다
코드 블록에let 변수를 정의했습니다. 외부에서 인용할 때 존재하지 않습니다.블록 역할 영역이 존재합니다.

let i=10;
console.log(window.i);
결과:
undefine
let 성명의 변수는 윈도우의 속성이 되지 않습니다.

var c=10;
function a(){
  console.log(c);
  let c=1;
  console.log(c);
}
a();
함수에 변수가 전역 변수 이름과 같은 c가 존재하기 때문에 전역 변수 c를 덮어쓰지만let은 미리 불러오지 않기 때문에 첫 번째 인쇄 문장에서 c를 출력할 때 오류가 발생합니다.
JS의 작용역과 변수범위 분석에 관한 이 글은 여기에 소개되었습니다. 더 많은 JS 변수역과 관련된 내용은 저희 이전의 글을 검색하거나 아래의 관련 글을 계속 찾아보세요. 앞으로 많은 응원 부탁드립니다!

좋은 웹페이지 즐겨찾기