스코프
스코프란?
변수의 유효범위 ( 변수에 접근할 수 있는 범위가 존재함)
코드블록 :함수를 선언시 사용하는 중괄호{} 를 블록이라 한다.
코드블록 내부에서는 외부의 변수를 가져와 사용할 수 있고.
코드블록 외부에서는 코드블록 내부에서 선언한 변수를 가져와 사용할 수 없다.
스코프의 다른 규칙으로는
- 전역 스코프에서 선언한 변수 =>
전역 변수- 지역 스코프에서 선언한 변수 =>
지역 변수- 추가 적으로 지역 변수는 전역 변수 보다 더 높은 우선순위를 가진다.
스코프의 종류
스코프의 종류를 알아보자
블록 스코프(block scope): 중괄호를 기준으로 범위가 구분 됨.
블록 스코프는 중괄호 안에서만 사용이 가능하고 밖에서는 사용할 수 없음
함수 스코프(function scope): function 키워드가 등장하는 함수 선언식 , 함수 표현식은 함수 스코프를 만든다.
스코프 체인
스코프 체인이란?
위의 사진과 같이 계층적으로 중첩으로 되어 있는 스코프들을 하나의 고리로 연결해 놓는것이스코프 체인이다.
let a에 변수let x =10이 선언되어 있고let d에서
console.log(x)를 시도한다고 가정해보자그럼 일단
let d에let x =10이 존재하는지 참조하고 없으면
상위 스코프인let c를 참조하고 없으면 그 다음 상위 스코프로
올라가면서 참조를 계속한다.여기서 중요한 점은 한방향으로만
하위 스코프 ---> 상위 스코프참조를 진행하는 것이다!!
예시를 위해 사진을 첨부한다.
스코프 체인은 하위 스코프에서 상위스코프를 참조할 수 있는 것을 말한다.
그럼 상위 하위 스코프는 언제 결정나는 것일까?
렉시컬 스코프(lexical scope)
렉시컬 스코프란?
프로그래밍 언어가 상위 스코프를 결정하는 방법은 크게 2가지임
동적 스코프(dynamic scope)
함수를 어디서 호출했는지에 따라 함수의 상위 스코프를 결정
함수가 호출되는 시점에 동적으로 상위 스코프를 결정
렉시컬 스코프(lexical scope) / 정적 스코프(static scope)
함수를 어디서정의했는지에 따라함수의 상위 스코프를 결정
함수 정의가 평가되는 시점에 상위 스코프를 결정자바스크립트는
렉시컬 스코프를따른다.
함수가 어디서정의했는지에 따라 상위 스코프가 결정되는 것이다!함수가
호출된 위치는 상위 스코프 결정에 어떠한 영향도 주지 않는다.
즉, 함수의 상위 스코프는 언제나 자신이 정의된 스코프를 기준으로 정해진다.
주의할 점
화살표 함수의 경우에는 블록 스코프를 따른다. (function 키워드가 사용되지 않았기 때문)
변수 키워드에 따른 유효범위 가 다르다.
- 변수 키워드
var는 블록 스코프를 무시하고 함수 스코프만 따른다.
var 키워드보다let 키워드가 더 안전한 이유
let 키워드는 재선언을 방지함. (재할당이 아님!)변수는 재선언할 필요가 없기 때문에 var 같이 재선언이 되어지는건 대부분 버그 이다!
let , const랑var키워드에 따라 유효범위가 다 다른걸 기억해두자!
- 전역 변수를 최소화 하자!!
전역 변수를 사용하는 것이 편리 하긴 하나
다른 함수나 로직에 의해 의도되지 않은 변경이 발생할 수 있음.
side effect가 발생할 수 있다.
side effect란?전역 변수를 많이 선언함에 따라 의도치 않게 생기는 문제들
var키워드 보단let, const키워드 사용하기!
선언 없이변수를 할당하면var키워드를 사용한 것과 같음!
- 실수를 방지하기 위해
Strict Mode사용하기!
Strict Mode를 사용하게 되면 문법적 오류를 에러로 판단해준다.
사용방법은 js 파일 상단에 'use strict'; 라고 입력하면 됨.
< 사진 참조 : 코드스테이츠>
