해당 함수의 결과는 ?

function func(n) { this.number = n; } myFunc = new func(4); document.write(myFunc + 5); // ① : [object Object]5 func.prototype.valueOf = function() { // valueOf() 메소드를 정의함. return this.number; } document.write(myFunc + 5); // ② : 9

내가 생각했던 수정 방향

function func(n) { this.number = n; } 에서 return this.number
 하면 1번 문제가 발생안하고 9를 리턴할줄 알았다. 

내 예상 ) 

function func(n) { this.number = n return this.number ; } myFunc = new func(4); document.write(myFunc + 5); // 9

하지만 아니였다.
func 안에서 return this.number 해도
①번은 여전히 [object Object]5 가 나온다.
왜냐면 new func()에서 return은 무시되기 때문이다.

1️⃣ new 연산자의 동작 방식

1.빈 객체 {} 생성
2.그 객체를 this로 바인딩
3.함수 본문 실행
4.return 값이 객체면 → 그 객체를 반환
5.return 값이 원시값이면 → 무시하고 this 반환

즉 return this.number 가 무시되고 결과는 myFunc === { number: 4 } 가 된다.

그렇다면 왜 1번 결과가 [object Object]5 일까

document.write(myFunc + 5);

JS는 + 연산에서 이렇게 판단함
1. 객체 + 숫자 → 객체를 원시값으로 변환
2. 순서:
valueOf()
없으면 toString()

즉
func.prototype.valueOf ❌ 없음
myFunc.toString() → "[object Object]"

"[object Object]" + 5

객체 안에 prototype 으로 toString이 있어서 이것을 실행했다 .

그래서 이코드를 넣어서 valueOf를 설정해주는 것이다

func.prototype.valueOf = function() {
  return this.number;
}

그래서 2번 결과가 제대로 나올수 있었다.

단순한 결과지만 이를 모르고 있었다.

function func(n) { this.number = n; } myFunc = new func(4); document.write(myFunc + 5);

해당 함수의 결과가 무엇인지 나타내시오 라는 문제가 나왔을때
문제를 제대로 못풀었을것 같다.

오늘 공부 이후로 new 객체 에 대해서 알수 있었고 또한 JS +연산에서는 원시값으로 변환하고 valueOf 를 찾고 없으면 toString을 찾는다는 것을 알게 되었다.