[JavaScript] Object Methods

Narcoker·2022년 8월 24일
0

JavaScript

목록 보기
8/55
post-custom-banner

Object.assign()

객체를 깊은 복사하여 대상 객체에 덮어쓴다. 2개 이상 병합가능하다.
이때 상속받은 프로퍼티는 복사되지 않는다.
열거가능한 타입만 복사된다. enumerable: true

첫번째 파라미터에 null, Number, String, Boolean 등 을 넣으면 에러가 발생하지 않는다.
이 경우 첫번째 파라미터 기준으로 type이 결정되며 두번째 파라미터에 객체가 들어간다면
일시적으로 객체 타입으로 암묵적 타입변환이 일어나고 두번째 파라미터의 프로퍼티가 할당된다.

Primitive Type에서 메서드를 사용할때 일어나는 동작과 유사하다.

const user = {
  name : "Mike",
  age : 30
};
const cloneUser1 = Object.assign({},user);
// {} + { name : "Mike", age : 30} 
const cloneUser2 = Object.assign({gender: "female"}, user);
// {gender: "female"} + { name : "Mike", age : 30} 
const cloneUser3 = Object.assign({name:'Tom'}, user);
// {name:'Tom'} + { name : "Mike", age : 30} 
// = {name:'Tom', age : 30} 덮어쓰기
const info0 = {name : 'Mike'};
const info1 = {age : 30};
const info2 = {gender : 'male'};
const cloneUser4 = Object.assign(info0,info1, info2);
// 2개이상 덮어쓰기

Object.keys()

객체 내부의 키 배열을 반환한다.

const user = {
  name : 'Mike',
  age : 30,
  gender : 'female'
};
Object.keys(user); // ["name", "age", "gender"]

Object.values()

객체 내부의 값 배열을 반환한다.

const user = {
  name : 'Mike',
  age : 30,
  gender : 'female'
};
Object.values(user); // ["Mike", 30, "male"]

Object.entries()

객체 내부의 키/값 배열을 반환한다.

const user = {
  name : 'Mike',
  age : 30,
  gender : 'female'
};
Object.entries(user); 
// [
// 	  ["name", "Mike"],
//    ["age", 30],
//    ["gender", "female"]
// ]

코드 작성 순서와 바뀌는 경우가 있다.
key가 영문자일경우 key 값을 분류하지 않고 작성한 대로 반환한다.

key가 숫자와 숫자가 섞여있으면 숫자, 문자 순서로 분류한다.

const obj = {10: "십", book:"책", 7:"칠"};
const list = Object.entries(obj);
for (let keyValue of list){
  console.log(keyValue);
};
/*
[7, 칠]
[10, 십]
[book, 책]
*/

문자열을 분리할 때도 사용한다.

문자열을 문자 하나씩 분리하며 인덱스를 key 값으로 사용한다.

const list = Object.entries("ABC");
for (let keyValue of list){
  console.log(keyValue);
};

/*
[0, A]
[1, B]
[2, C]
*/

Object.fromEntries()

키/값 배열을 객체로 만들어 반환한다.

const arr =
[
 	  ["name", "Mike"],
  	  ["age", 30],
      ["gender", "female"]
];
Object.fromEntries(arr); 
// {
// 	  name : "Mike",
//    age : 30,
//    gender : "female"
// }

만약 프로퍼티 키 값이 같으면 뒤에 나온 값으로 대체된다.

const list = [["one", 10],["one", 20]];
const obj = Object.fromEntries(list); 
console.log(obj); // {one: 20}

Object.is()

두개의 파라미터 값과 값 타입을 비교한다.

=== 연산자와 같다.

오브젝트 비교목적으로 사용하는 것이 아니다.

NaN 비교 시 true를 반환한다.
0과 -0비교시 false를 반환한다.

Object.is(10, "10"); // false

const one = {}, two = {};
Object.is(one, two); // false, 주소 값이 다르기 때문
Object.is(NaN, NaN); // true
Object.is(NaN, 0/0); // true
Object.is(0, -0); // false, IEEE 754 비트 비교 시 부호비트가 다르기 때문

Object.getOwnPropertyDescriptors()

Object의 프로퍼티 디스크립터를 반환한다.

이때 상속받은 프로퍼티는 대상이 아니다.

const obj = {music: "음악"};
const des = Object.getOwnPropertyDescriptors(obj);

for (let name in des.music){
	console.log(name + ": " + des.music[name]);
};

/*
value: 음악
writeable: true
enumerable: true
configurable: true
*/
const obj = {
	get music(){}
};
const des = Object.getOwnPropertyDescriptors(obj);

for (let name in des.music){
	console.log(name + ": " + des.music[name]);
}

/*
get: get music(){}
set: undefined
enumerable: true
configurable: true
*/

Object.setPrototypeOf()

부모 객체를 지정하는 메서드

일반적으로 생성자 함수의 prototype과 연결한다.

let obj = {0: 10, length: 1};
Object.setPrototypeOf(obj, Array.prototype)
profile
열정, 끈기, 집념의 Frontend Developer
post-custom-banner

0개의 댓글