[ JavaScript ] 변수의 scope 와 Shadowing

변수의 scope

• 선언한 변수가 유효한 영역

function scope

• 선언된 변수는 선언된 함수 안에서 접근이 가능
• 선언된 함수 안에서 선언된 함수 ( nested function )에서 접근 가능

변수의 shadowing

• 함수 안에서 밖에서도 선언되었던 같은 이름의 변수를 사용하는 경우
  • 함수 밖의 변수는 잠시 가려짐 (Shadowing)
  • 함수 안에서 해당 함수에서의 변수를 사용 ( 함수 밖 변수의 값은 변하지 않음 )
  • 함수에서 빠져나오면 다시 해당 변수에 접근할 수 있음
• 함수 안에서만 값이 유지되어야 하는 경우
  • 함수 안에서 let 키워드를 사용해 선언하고 사용
• 여러 함수에서 값이 유지되면서 사용되는 변수의 경우
  • 함수를 포괄하는 곳에서 선언하고 사용

    function shadowing_example(){
    let val = 0;
    console.log("F",val);
    val++
    }
    let val = 0;
    shadowing_example();
    console.log("0",val)

코드 해석
shadowing_example()의 val가 0일때
콘솔로 0이 출력이 되고
val++을하면 함수안에 val이 1로 바뀜

하지만 함수가 종료되고 다시 돌아오면 함수안에 있었던 val은 가려지고 다시 바깥에 있는 val이 나타남
밑에 코드에서는 val를 출력했을때 0이된다