[FE] 04. 객체 리터럴과 this

<4. 객체 리터럴과 this>

* 자바스크립트 객체의 활용

자바스크립트에서는 객체 리터럴이라는 표현식을 이용해 객체를 쉽게 만들 수 있다.

. notation 표기법은 자바스트립트에서 객체를 뜻한다 (객체.메서드)

var healthObj = {
  name : "달리기",
  lastTime : "PM10:12",
  showHealth : function() {
    console.log(this.name + "님, 오늘은 " + this.lastTime + "에 운동을 하셨네요");
  }
}

healthObj.showHealth();

이와 같은 식으로 비슷한 기능을 묶어서 객체 리터럴로 코드를 만들고, 각 메서드를 실행해기

여기에서 this는 healthObj를 가르킨다. (healthObj로 써도 되지만 this 키워드를 쓰는 것을 추천, 좀 더 유연해진다.)

this는 실행 타이밍에서 결정되는 것

healthObj 안에서 쓰이는 것들에 다 접근할 수 있다는 뜻

자바스크립트의 객체는 하나의 객체를 반환하게 되어있으므로 싱글턴이다.

---

 

* this

객체 안에서의 this는 그 객체 자신을 가리킨다.

const obj = {
   getName() {
     return this.name;
     },
  setName(name) {
      this.name = name;
    }
}
obj.setName("crong");
const result = obj.getName();

- this 좀 더 알아보기

JavaScript에는 전역스크립트나 함수가 실행될 때 실행문맥(Execution context)이 생성된다.

(참고로 실제 실행은 브라우저내에 stack 이라는 메모리 공간에 올라가서 실행 됨)

모든 context에는 참조하고 있는 객체(thisBinding이라 함)가 존재하는데, 현재 context가 참조하고 있는 객체를 알기 위해서는 this를 사용할 수 있다.

함수가 실행될때 함수에서 가리키는 this 키워드를 출력해보면 context가 참조하고 있는 객체를 알 수 있다.

function get() {
    return this;
}

get(); //window. 함수가 실행될때의 컨텍스트는 window를 참조한다.
new get(); //object. new키워드를 쓰면 새로운 object context가 생성된다.