javascript.info - 객체 기본(2)

옵셔널 체이닝 '?.'

- '?.' 옵셔널 체이닝은 '?.' 앞의 평가 대상이 undefined나 null이면 평가를 멈추고, undefined를 반환한다.

let user = {}; // 주소 정보가 없는 사용자

alert( user?.address?.street ); // undefined, 에러가 발생하지 않습니다.

?.는 존재하지 않아도 괜찮은 대상에만 사용

만약 '?.'앞에 오는 값이 null이나 undefined가 아닌 경우, 반드시 해당 프로퍼티가 존재해야만 에러가 나지 않음.

 

단락평가

왼쪽 평가대상에 값이 없으면 즉시 평가를 멈춥니다. 

let user = null;
let x = 0;

user?.sayHi(x++); // 아무 일도 일어나지 않습니다.

alert(x); // 0, x는 증가하지 않습니다.

?.()와 ?.[]

존재 여부가 확실치 않은 함수를 호출할 때 ?.() 사용하여 안전하게 프로퍼티 읽기 가능.

- 함수 확인

let user1 = {
  admin() {
    alert("관리자 계정입니다.");
  }
}

let user2 = {};

user1.admin?.(); // 관리자 계정입니다.
user2.admin?.();

- 객체 프로퍼티 접근.

let user1 = {
  firstName: "Violet"
};

let user2 = null; // user2는 권한이 없는 사용자라고 가정해봅시다.

let key = "firstName";

alert( user1?.[key] ); // Violet
alert( user2?.[key] ); // undefined

alert( user1?.[key]?.something?.not?.existing); // undefined

?. delete와 조합.

delete user?.name; // user가 존재하면 user.name을 삭제합니다.

---

심볼형

 

자바스크립트 객체 프로터피 키는 문자형과 심볼형만 허용.

심볼 : 유일한 식별자. Symbol()를 사용해 심볼값 만들기 가능. 심볼 만들때, 괄호안에 심볼 이름 생성 가능.(디버깅 시 유용)

// 심볼 id에는 "id"라는 설명이 붙습니다.
let id = Symbol("id");

심볼은 자동 형변환이 되지 않아, alert로 출력불가. 꼭 출력 필요시 .toString()으로 출력가능. 또는, symbol.description 프로퍼티로 설명 보여주기 가능.

 

‘숨김’ 프로퍼티

숨김 프로퍼티는 외부 코드에서 접근이 불가능하고 값도 덮어쓸 수 없는 프로퍼티.

---

객체를 원시형으로 변환하기

객체끼리 더하거나 빼는 등의 연산 시 객체는 원시값으로 자동 형변환 후 연산이 수행된다.

hint : 목표로 하는 자료형. String, number, default(확실치 않을 때, 드문 경우)

사용 예)

let user = {
  name: "John",
  money: 1000,

  [Symbol.toPrimitive](hint) {
    alert(`hint: ${hint}`);
    return hint == "string" ? `{name: "${this.name}"}` : this.money;
    //삼항 연산자.
  }
};

// 데모:
alert(user); // hint: string -> {name: "John"}
alert(+user); // hint: number -> 1000
alert(user + 500); // hint: default -> 1500

toString과 valueOf

: toPrimitive를 사용하지 않는 구식 방법으로 형변환 직접 구현시

let user = {
  name: "John",
  money: 1000,

  // hint가 "string"인 경우
  toString() {
    return `{name: "${this.name}"}`;
  },

  // hint가 "number"나 "default"인 경우
  valueOf() {
    return this.money;
  }

};

alert(user); // toString -> {name: "John"}
alert(+user); // valueOf -> 1000
alert(user + 500); // valueOf -> 1500

반환 타입

toString이나 valueOf가 객체를 반환해도 에러가 발생하지 않음.

그러나, Symbol.toPrimitive는 무조건 원시자료를 반환하거나 에러 발생.

 

객체-원시형 변환에 적용되는 알고리즘

1. 객체에 obj[Symbol.toPrimitive](hint)메서드가 있는지 찾고, 있다면 호출
2. 1에 해당하지 않고 hint가 "string"이라면,
   • obj.toString()이나 obj.valueOf()를 호출합니다.
3. 1과 2에 해당하지 않고, hint가 "number"나 "default"라면
   • obj.valueOf()나 obj.toString()을 호출합니다.