프로그래머스[13기]

1. New를 붙이면 return문을 따로 넣지않아도 실행이 된다.

function Cat(name, age) {
	this.name = name;
    this.age = age;
}
let robo = Cat('nana',12)
console.log(robo.name)
===> 오류가 뜬다.

2. 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression)이라고 하며, 함수를 정의함과 동시에 실행한다.

var logger = (function(){
  // logCount는 밖에서 접근할 수 없다. 일종의 private 효과
  var logCount = 0;
  function log(message) {
    console.log(message);
    logCount = logCount + 1;
  }
  function getLogCount() {
    return logCount;
  }
  return {
    log: log,
    getLogCount: getLogCount
  }
})() 

3. function 키워드와 Arrow function의 차이

var idiots = {
  name: 'idiots',
  genre: 'punk rock',
  members: {
    roto: {
      memberName: 'roto',
      play: function() {
        console.log(`band ${idiots.name} ${this.memberName} play start.`
      } 
    }
  }
}

this가 무엇을 가르키고 있는지 찾아야한다.
만약 this.name으로 하면 undefined로 뜬다.

4. 화살표 함수를 쓰면 자동으로 전역변수를 찾으러 간다.

function RockBand(members) {
    var that = this;
    this.members = members;
    this.perform = function() {
      setTimeout(function(){
        that.members.forEach(function(member){ member.perform() })
      }, 1000)
    }
  }

  var theOralCigarettes = new RockBand([
    {
      name: 'takuya',
      perform: function() { console.log('a e u i a e u i')}
    }
  ])

  theOralCigarettes.perform()

클로저를 통해서 that으로 전역변수로 사용 할 수 있다.

5. let대신 var를 사용하면 그 안에서만 진행이 된다
   (호이스팅) block scope vs window

const numbers = [1, 2, 3, 4, 5];
for(var i = 0; i < numbers.length; i++){ 
(function(count){
  setTimeout(function(){
    console.log(`number index ${count}`);
  }, 1000);
})(i)
}

요즘은 forEach(), map등으로 대체된다.
그리고 use strick 을 쓰면 이런일을 거의 없다!

var, let, const 차이

function level scope 재할당, 재선언 가능=> var
block level scope, 재할당 가능, 재선언 불가능 => let
block level scope, 재할당, 재선언 불가능 => const

요즘 트렌트는 const 를 쓴다.

클로저는 정말 중요하다! 모든 오류는 클로저로 부터 ~

클로저에 대한 좀 더 자세한 설명은 아래 문서를 참고하자.

https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Closures
https://hyunseob.github.io/2016/08/30/javascript-closure/

함수안에 함수가 선언된 어휘적 환경조합니다. (lexical scope)

• 함수안에 함수를 선언가는 것

    function init() {
      var name = "Mozilla"; // name은 init에 의해 생성된 지역 변수이다.
      function displayName() { // displayName() 은 내부 함수이며, 클로저다.
        alert(name); // 부모 함수에서 선언된 변수를 사용한다.
      }
      displayName();
    }
    init();

책 추천

• 모던 자바스크립트(니콜라스 자카스)
• 자바스크립트 완벽 가이드(굉장히 두꺼움)
  중급자 용
• 자바스크립트 패턴과 테스트
• you don't know JS
• http 완벽가이드 ***