TIL (스코프)

6674 단어 TILjsTIL

스코프 란?

변수 접근 규칙에 따른 유효 범위
두가지 규칙이 있고 중괄호(블록)으로 스코프가 나뉘는 블록스코프, 함수를 기준으로 스코프를 나누는 함수 스코프가 있다

첫번째 규칙
안쪽 스코프에서 바깥쪽 스코프로는 접근할 수 있지만
반대(바깥쪽 스코프에서 안쪽스코프로 접근)는 불가능하다

두번째 규칙
스코프는 중첩이 가능하다
가장 바깥쪽에 위치한 소코프는 전역스코프 , 그 외의는 전부 지역스코프이다
지역스코프에서 선언한 변수는 지역 변수, 전역 스코프에서 선언한 변수는 전역 변수라고 한다
지역변수가 전역변수보다 더 높은 우선순위를 가진다

함수 스코프

함수 스코프

function getName(user) {
	return user.name;		//함수 선언식
}

let getAge = function (user) {
  return user.age; 			//함수 표현식
}

보기와 같은 함수 선언식 과 함수 표현식은 함수자체가 함수스코프를 만든다
function 키워드를 사용하는 일반함수는 함수스코프이다

but!

let getAge = user => {
  return user.age;
}

화살표 함수는 블록 스코프로 취급된다

var , let , const

  • var 키워드
    var 키워드로 정의한 변수는 블록 스코프를 무시하고 함수 스코프만 따른다
ex) 
for (var i = 0; i < 5; i++) {
	console.log(i);   // 다섯번 반복
}
console.log('final i:' , i);   // 5  , var를 쓰지않으면 참조오류가 발생

스코프 규칙으로 인해 바깥쪽스코프에서 안쪽 스코프로 접근할 수 없지만
var 키워드를 사용하면 블록스코프에서 스코프 규칙을 무시하고 스코프범위를 벗어나도 사용가능하다

  • let 키워드
    let 키워드는 재선언을 방지한다

  • const 키워드
    const 키워드는 재선언, 재할당을 방지한다

let,const 와 var 의 차이점은 유효범위에 있다

window 객체

브라우저에는 window 객체가 존재한다
브라우저의 화면에 보여지는 창(window)을 의미하는 객체이지만 별개로 전역 영역을 담는다
그래서
함수 선언식 함수를 선언하거나 var로 전역 변수를 만들면 , window객체에서 동일한 값을 찾을 수 있다

var myName = '김코딩'
console.log(window.myName);  // 김코딩   var로 선언한 변수가 window 객체안에 들어가있는것을 알 수 있다

function foo() {
	console.log('bar')
}

console.log(foo === window.foo); // true   함수선언식으로 선언한 함수 foo 가 window 객체 안에 들어가  
				//foo와 window.foo는 같은 함수를 의미한다

키워드 없이 선언한 변수

let, const 와 같은 키워드 없이 변수를 할당하면 var로 선언한 전역 변수처럼 취급된다
이런 문법적 실수를 방지하기 위해 Strict Mode를 사용하면
"선언 없는 변수 할당"의 경우도 Strict Mode는 에러로 판단합니다.

Strict Mode를 적용하려면, js 파일 상단에 'use strict' 라고 입력하면 된다

'use strict';

function showAge() {
  age = 90;  // 키워드 없는 변수 선언으로 에러 발생
  console.log(age); // age 변수가 정의되지않은 참조오류가 발생한다
}
showAge();

좋은 웹페이지 즐겨찾기