Object.keys(), values(), entries(), assign()

Kingmo·2022년 4월 9일
0

1. Object.keys()

Object.keys()

Object.keys()메서드는 인자로 받은 객체에서 속성 이름(Key)들을 뽑아 배열로 만드는 함수이다.
배열로 바뀌었기 때문에 반복문을 이용하기 쉽다.

const classmate = {
  name: '킹모',
  age: 18,
  school: '청설모고등학교'
};

const result = Object.keys(classmate);

for (let i = 0; i < result.length; i++) {
  console.log(result[i]);
}

// "name"
// "age"
// "school"

2. Object.values()

Object.values()

Object.values()메서드는 인자로 받은 객체의 속성 값(value)들을 뽑아 배열로 만드는 함수이다.
배열로 바뀌었기 때문에 반복문을 이용하기 쉽다.

const classmate = {
  name: '킹모',
  age: 6,
  school: '종달새유치원'
};

const result = Object.values(classmate);

for (let i = 0; i < result.length; i++) {
  console.log(result[i]);
}

// "킹모"
// 6
// "종달새유치원"

3. Object.entries()

Object.entries()

Object.entries()메서드는 인자로 받은 객체의 key와 value속성들을 모두뽑아 [[key, value]] 쌍의 배열로 만드는 함수이다.

const obj = { age: 8, name: '킹모' };
const result = Object.entries(obj);

console.log(result); // [["age", 8], ["name", "킹모"]]

또한 객체가 배열의 형태로 바뀌었기 때문에 반복문을 사용하여 각 데이터에 편하게 접근할 수 있다.
그리고 다음과 같이 구조분해할당도 적용할 수 있다.

const obj = { age: 8, name: '후니' };
const result = Object.entries(obj);

for (let i = 0; i < result.length; i++) {
  let [key, val] = result[i]; // 구조분해할당
  console.log(key + '은(는) ' + val);
}

// "age은(는) 8"
// "name은(는) 후니"

4. Object.assign()

Object.assign()

Object.assign()메서드는 먼저 예시를 보고 설명을 듣는 것이 이해가 쉽다.

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

Object.assign(target, source)
에서 target : 목표 객체로 출처 객체의 속성을 복사해 반영한 후 반활할 객체이다.
여기서 출처 객체는 source로 목표 객체에 반영하고자 하는 속성들을 갖고 있는 객체들로
,쉼표로 구분하여 여러 객체들을 넣을 수 있다.
이 때 이 메서드는 깊은 복사를 수행한다.

또한 source를 복사해서 target에 반영할 때
중복된 key에 대해서는 덮어 쓰기가 진행 된다.

그래서 뒤의 인자로 앞 인자의 중복된 key에 대해서는 덮어쓰면서 동시에
객체를 합하여 새로운 변수에 깊은 복사로 할당하고자 할 때 사용하기 적합한 메서드이다.

profile
Developer

0개의 댓글