조아마시

쓸모 있는 상세페이지 만들기

웹개발/javascript

[자바스크립트] 객체 메서드 심층 분석

joamashi 2024. 8. 8. 22:00

프로토타입(prototype) 프로퍼티

  • 정의: 모든 자바스크립트 객체는 __proto__라는 숨겨진 프로퍼티를 가지고 있으며, 이 프로퍼티는 해당 객체의 프로토타입을 가리킵니다. 프로토타입은 객체가 상속받는 속성과 메서드를 정의하는 역할을 합니다.
  • 상속: 객체는 자신의 프로토타입에 정의된 속성과 메서드를 상속받아 사용할 수 있습니다. 즉, 객체가 직접 가지고 있지 않은 속성이나 메서드에 접근하려고 하면 프로토타입 체인을 따라 상위 프로토타입에서 해당 속성이나 메서드를 찾습니다.
  • 프로토타입 체인: 객체, 객체의 프로토타입, 프로토타입의 프로토타입 등으로 이어지는 연결을 프로토타입 체인이라고 합니다.

Object.is(value1, value2) 메서드

  • 정의: 두 값이 완전히 일치하는지 비교합니다. === 연산자와 비슷하지만, NaN과 -0을 구분하고, +0과 -0을 같다고 판단하는 등 더 엄격한 비교를 수행합니다.
  • 용도:
    • NaN 값 비교
    • +0과 -0 구분
    • 객체의 동일성 비교 (같은 객체인지 확인)
console.log(Object.is(NaN, NaN)); // true
console.log(Object.is(+0, -0)); // false

Object.setPrototypeOf(object, prototype) 메소드

  • 정의: 객체의 프로토타입을 직접 설정합니다.
  • 용도:
    • 객체의 프로토타입을 동적으로 변경
    • 상속 관계를 만들거나 변경
const person = { name: 'Alice' };
const student = { grade: 'A' };
Object.setPrototypeOf(student, person); // student의 프로토타입을 person으로 설정
console.log(student.name); // Alice

Object.assign(targetObj, sourceObjs...) 메소드

  • 정의: 하나 이상의 소스 객체의 열거 가능한 자체 속성을 대상 객체에 복사합니다.
  • 용도:
    • 객체 병합
    • 객체 복사 (얕은 복사)
    • 기본 객체 생성
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
console.log(target); // { a: 1, b: 2, c: 3 }

실제 활용 예시

  • 객체 생성: 함수의 prototype 프로퍼티를 이용하여 생성자 함수를 만들고, new 연산자로 객체를 생성합니다.
  • 상속: Object.setPrototypeOf를 사용하여 프로토타입 체인을 구성하고 객체 간 상속 관계를 만듭니다.
  • 객체 복사: Object.assign을 사용하여 객체를 복사하거나 여러 객체를 병합합니다.
  • 객체 확장: Object.assign을 사용하여 기존 객체에 새로운 속성을 추가합니다.
728x90