유돈노 #part2#3) 함수 vs 블록 스코프

3.1 함수 기반 스코프

함수 스코프는 모든 변수가 함수에 속하고 함수 전체에 걸쳐 사용되며 재사용된다는 개념을 확고하게 한다.

함수에 대한 전통적인 개념

코드를 숨기는 테크닉은 어디에 유용?

function foo() {
 function bar(a) {
  i = 3;
  console.log(a + i);
 }

 for(var i =0;  i< 10 ;  i ++) {
  bar(i*2); 
 }
}

위의 코드는 루프 도중 i 값이 3으로 바뀌어서 무한 루프 돌게 된다.

해결 방법 1) var i = 3;으로 변경하면 됨 2) 아니면 변수명 똑바로 쓰던가 3) 가장 확실한 방법은 스코프를 이용해서 내부에 선언문을 숨기는 것이 가장 좋다.

라이브러리 충돌을 막기 위해 글로벌 스코프에 하나의 고유 이름을 가지는 객체 선언문을 생성 이후 객체는 해당 라이브러리의 네임스페이스로 이용됨

위의 문제(글로벌 네임스페이스)는 모듈 패턴으로 해결 가능한데 이는 뒷장에서~

var a = 2;

function foo() {
 var a = 3;
 console.log(a);
}
foo();
console.log(a);

함수를 선언해서 오염되기 쉽다

var a = 2;

(function foo() {
 var a = 3;
 console.log(a);
})();

console.log(a);

기명써 확실한게 최고얌

var a = 2;
(function IIFE(global) {
var a = 3;
console.log(a); //3
console.log(global.a);//2
})(window)

범용 모듈 정의시 자주 사용하는 패턴

var a = 2;
(function IIFE(def) {
  def(window);
})(function def(global){
var a = 3;
console.log(a);
console.log(global.a);
})

블록 스코프에 해당하는 것

let은 선언한 변수를 위해 자신을 둘러싼 블록 스코프 ( 일반적으로 {}) 이용한다. (Q.let을 이용해 변수를 현재 블록에 붙이는 것은 약간 비명시적? => 무슨 말이야)

let과 동일하게 블록스코프 이용하나 값이 변할 수 없다는 것이 포인트!