내일 배움 캠프 23_05_23 TIL

오늘은 어제에 이어서 JS문법 3주차 강의를 들으며 공부를 하였다

var a = 1;

var outer = function () {

  var inner = function () {

    console.log(a);

    var a = 3;

  };

  inner();

  console.log(a);

};

outer();

console.log(a);

이 코드에서 실행을 예상했을 때 나는 단순히 맨위에서 전역변수로 a = 1 을 할당했으니까
첫 console.log(a)에서 1이 나오고

두번째 세번째 모두 1이 나올 줄 알았는데

 

실행값은 

undefined
1
1 이였다

 

알아보니 이는 JS의 호이스팅 개념때문에 이렇게 된 것이였다.

다행히 공부를 하는 지금 틀려보면서 개념을 잡을 수 있었기에 다행인 것 같았고

 

this 바인딩에 대해서도 배우게 됐는데 브라우저에서 실행했을 경우 this는 window 객체이고

 

브라우저 콘솔 창에서 실행한 화면

 

node에서는 this가 global 객체인것을 볼 수 있었다.

node에서 실행한 화면

또한

call을 사용하여 명시적으로 binding

this가 전역객체를 바라보는 문제를 해결하기 위해서는 call이나 apply를 이용해서 명시적으로 바인딩을 해줘서 전역객체를 참조하는 현상을 방지할 수 있었고 더 좋은 해결책으로는 바로

화살표 함수를 사용하면 실행 컨택스트를 생성할 때 this 바인딩 과정 자체가 없어서 화살표 함수를 사용하게되면

this가 전역객체를 바라보는 것이 아닌 기존의 값을 바라본다는 사실을 새롭게 알게 되었다.

 

1강을 보면서 원래 언어는 다르지만 코딩을 할 때 쓰는 제어문이나 조건문,반복문은 알고 있었기에 

JS도 쉽겠거니 생각을 했었는데 3강을 들어오면서 역시 하나의 프로그래밍 언어를 습득한다는것은 결코 쉽지않으며

더욱 집중해서 JS 문법을 공부한 후 내가 코드로 작성해 보면서 내것으로 만들어야 겠다는 생각을 하게 되었고

항상 겸손하라는 말이 떠오르면서 더 열심히 JS 문법을 알아가야겠다고 생각했다.

 

내일부터 4강을 듣게될텐데 집중하면서 지치지않고 이어가야겠다.