메서드와 this

객체는 사용자(user), 주문(order) 등과 가이 실제 존재하는 개체를 표현하고자 할 때 생성
자바스크립트에선 객체의 프로퍼티에 함수를 할당해 객체에게 '행동' 할 수 있는 능력 부여

메서드 만들기

let user = {
	name: "John",
  	age: 30
};

user.sayHi = function() {
	alert("안녕하세요!");
}

user.sayHi(); // 안녕하셍!

객체 프로퍼티에 할당된 함수를 '메서드'라고 부름!

메서드 단축구문

user = {
	sayHi: function() {
    	alert('Hello');
    }
}
=
user = {
	sayHi() {
    	alert('Hello');
    }
}

function 을 생략해도 메서드를 정의할 수 있으

1.메서드와 this

메서드 내부에 this키워드를 사용하면 객체에 접근할 수 있음

let user = {
	name: "John",
	age: 30,
  
  	sayHi() {
    	alert(this.name); // this는 현재 객체를 나타냄
    }
}

user.sayHi() 가실행되는 동안 this는 user를 나타냄

• user를 null로 덮어쓰고 admin = user로 하면 에러발생
  user.name 대신 this.name을 했다면 에러 발생하지않음

2.자유로운 this

function sayHi() {
	alert(this.name;
}

이렇게 작성해도 자바스크립트는 에러 발생하지않음

---

let user = {name: "John"}
let admin = {name: "Admin"};

function sayHi() {
	alert(this.name);
}

user.f = sayHi;
admin.f = sayHi;
//별도의 객체에서 동일한 함수를 사용함

user.f(); // John (this == user)
admin.f(); // John (this == admin)

obj.f()를 호출했다면 this는 f를 호출하는 동안의 obj

---

<객체 없이 호출하기>
this == undefined

function sayHi() {
	alert(this);
}

sayHi(); //underfined

엄격 모드에서 실행하면 this엔 undefined가 할당
엄격 모드가 아닐 때는 this가 전역 객체를 참조, 이러한 동작 차이 때문에 "use strict" 도입

---

<자유로운 this가 만드는 결과>
자바스크립트에 this는 런타임에 결정, '점 앞에'객체ㅏ 무엇인가에 따라 자유롭게 결정

3.this가 없는 화살표 함수

화살표 함수는 일반 함수와 달리 '고유한'this를 가지지않음
화살표 함수에서 this를 참조하면, 화살표 함수가 아닌 '평범한' 외부 함수 this 값을 가져옴

let user = {
	firstName: "보라",
  	sayHi() {
    	let arrow = () => alert(this.firstName);
      	arrow();
    }
};
user.sayHi(); //보라

과제

1) 객체 리터럴에서 'this'사용하기

2) 계산기 만들기

let calculator = {
	let read = prompt(a, b)
    let sum = (a, b) => (a + b)
    let mul = (a, b) => (a * b)

}

3)체이닝