8-1. JavaScript Object 의 모든 것

I. Object 클래스

 

1. 이제까지 배운 자바스크립트 객체들의 원형

console.log(
  new String('ABC') instanceof Object,	// true
  new Number(123) instanceof Object,	// true
  [] instanceof Object,	// true
  (function () {}) instanceof Object,	// true
  globalThis instanceof Object	// true
);

 - 각각 따로 출력해서 [[Prototype]] 펼쳐보기

클릭해서 열어보면 [[Prototype]]: Object

 

2. 생성자 함수

// 빈 객체 생성
console.log(
  new Object(),	// {}
  new Object(null),	// {}
  new Object(undefined),	// {}
);

// 각 값에 적합한 래핑함수로 작용
console.log(
  new Object(1),	
  new Object('ABC'),
  new Object(true),
  new Object([1, 2, 3])		// Number {1} String {'ABC'} Boolean {true} (3) [1, 2, 3]
);

 

 

 

II. 주요 정적 메서드

 

1. assign - 인자로 주어진 객체(들)의 프로퍼티들을 대상 객체에 붙여넣음

 - 대상 객체를 변경

 - 결과 객체를 반환

 - 얕은 복사

 

인자들 :

 - 대상 객체

 - 원본 객체(들)

const intro1 = {
  name: '홍길동'
};
const intro2 = { ...intro1 };

console.log(intro1, intro2);	// {name: '홍길동'} {name: '홍길동'}

const personal = {
  age: 25,
  married: false
};
const career = {
  job: '개발자',
  position: '팀장'
}

Object.assign(intro1, personal);
console.log(intro1);	// {name: '홍길동', age: 25, married: false}

// 둘 이상의 원본에서 가져올 수도 있음
Object.assign(intro2, personal, career);
console.log(intro2);	// {name: '홍길동', age: 25, married: false, job: '개발자', position: '팀장'}

 

 

2. keys, values, entries - 객체의 키 / 값 / [키,값] 을 배열로 반환

const obj = {
  x: 1,
  y: 2,
  z: 3
};

console.log(
  Object.keys(obj),	// ['x', 'y', 'z']
);

console.log(
  Object.values(obj),	// [1, 2, 3]
);

console.log(
  Object.entries(obj),
);

- entries(obj)에 대한 값을 풀어보면,

 

 

3. preventExtensions - 프로퍼티 추가 금지

 - isExtensible : 해당 여부 확인 (추가 가능 여부)

const obj = { x: 1, y: 2 };
console.log(Object.isExtensible(obj));	// true

Object.preventExtensions(obj);
console.log(Object.isExtensible(obj));	// false

obj.x++; // 프로퍼티 수정 가능
delete obj.y // 프로퍼티 삭제 가능
obj.z = 3; // 💡 프로퍼티 추가 금지

console.log(obj);	// {x: 2}

 

 

4. seal - 프로퍼티 추가와 삭제 금지

 - isSealed : 해당 여부 확인 (추가, 삭제 가능 여부)

const obj = { x: 1, y: 2 };
console.log(Object.isSealed(obj));	// false

Object.seal(obj);
console.log(Object.isSealed(obj));	// true

obj.x++; // 프로퍼티 수정 가능
delete obj.y // 💡 프로퍼티 삭제 금지
obj.z = 3; // 💡 프로퍼티 추가 금지

console.log(obj);	// {x: 2, y: 2}

 

 

5. freeze - 객체 동결 (읽기만 가능)

 - isFrozen : 해당 여부 확인

// 객체에 사용
const obj = { x: 1, y: 2 };
console.log(Object.isFrozen(obj));	// false

Object.freeze(obj);
console.log(Object.isFrozen(obj));	// true

obj.x++; // 💡 프로퍼티 수정 불가
delete obj.y // 💡 프로퍼티 삭제 금지
obj.z = 3; // 💡 프로퍼티 추가 금지

console.log(obj);	// {x: 1, y: 2}

✨얕게만 적용!!