Object.keys(), values, entries, assign

김선우·2022년 6월 11일
0

Posting

목록 보기
14/60

object.keys()

object.keys(obj) 메소드는 주어진 객체 속성들의 이름을 배열로써 반환한다.

ex)

const aaa = {name: '김선우' ,age: 27 ,country: '한국'}

console.log(Object.keys(aaa));
// expected : Array ['name', 'age', 'country']

object.keys(obj) 보다시피 매개변수로는 객체형태의 데이터가 들어간다.

다음은 MDN에 있는 예시들이다.

// 단순 배열
const arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']

// 배열형 객체
const obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']

// 키와 순서가 무작위인 배열형 객체
const anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.keys(anObj)); // console: ['2', '7', '100']

// getFoo 는 열거할 수 없는 속성입니다.
const myObj = Object.create({}, {
  getFoo: {
    value: function () { return this.foo; }
  }
});
myObj.foo = 1;
console.log(Object.keys(myObj)); // console: ['foo']

object.values()

object.values(obj) 매개변수로 들어간 객체 형태의 데이터의 key에 할당 된 값들을 배열 형태의 데이터로 변환 해준다.

const aaa = {name: '김선우' ,age: 27 ,country: '한국'}

console.log(Object.values(aaa));
// expected : Array ['김선우', 27, '한국']

object.keys() 와 마찬가지로 매개면수로는 객체 형태의 데이터가 들어간다. 위의 MDN 예시에서 결과 값이 key 들의 값으로 반환된다.

object.entries()

위의 두 메소드의 결과값들이 한쌍으로 나오는 메소드가

Object.entries() 이다.
차이점은

const aaa = {name: '김선우' ,age: 27 ,country: '한국'}

console.log(Object.entries(aaa));
// expected :
//[ 
//  [ 'name', '김선우' ],
//  [ 'age', 27 ],
//  [ 'country', '한국' ]
//]

object.assign()

배열 메소드 중 arr.concat 과 비슷한 느낌의 객체 메소드이다.

목표 객체의 속성 중 출처 객체와 동일한 키를 갖는 속성의 경우, 그 속성 값은 출처 객체의 속성 값으로 덮어쓴다. 출처 객체들의 속성 중에서도 키가 겹칠 경우 뒤쪽 객체의 속성 값이 앞쪽 객체의 속성 값보다 우선한다.

ex)

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 }
// 출처: MDN
profile
생각은 나중에..

0개의 댓글