Object 관련 유용한 함수

1.객체의 키를 배열로 가져오는 함수

Object.key(obj);

const obj = {
    "key0": "value0",
    "key1": "value1",
    "key2": "value2"
}
const keys = Object.keys(obj)
console.log(keys) // ["key0", "key1", "key2"]

2.객체의 값을 배열로 가져오는 함수

Object.value(obj);

const obj = {
    "key0": "value0",
    "key1": "value1",
    "key2": "value2"
}
const values = Object.values(obj)
console.log(values) // ["value0", "value1", "value2"]

3.객체를 키와 값형태의 함수

Object.entries(obj);

const obj = {
    "key0": "value0",
    "key1": "value1",
    "key2": "value2"
}
const entries = Object.entries(obj)
console.log(entries)
/*
[
    ["key0", "value0"],
    ["key1", "value1"],
    ["key2", "value2"]
]
*/

4.키와 값형태의 배열을 객체로 되돌리는 함수

Object.fromEntries(arr);

Object.entries()를 사용해서 객체를 배열형태로 받았을때, 그걸 다시 객체 형태로 되돌리는 함수

const arr = [
    ["K1", "V1"], 
    ["K2", "V2"]
];
const obj = Object.fromEntries(arr);
console.log(obj); // {K1: "V1", K2: "V2"}

5.객체를 추가하거나 복사하는 함수

Object.assign(target,source);

아래의 예제는 추가하는 경우이다. 동일한 값이 있는 경우 덮어쓴다

const target = { a: 1, b: 2 }
const source = { b: 3, d: 4}

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

console.log(target) // { a: 1, b: 3, d: 4 }
console.log(source) // { b: 3, d: 4 }
console.log(returnecTarget) // { a: 1, b: 3, d: 4 }

아래의 예제는 복사하는 경우이다. 그러나 얕은 복사이기때문에 복사한 객체 내부의 객체의 값은 연동되어있는것이 확인가능하다

그리고 추가적으로 Spread 연산자 사용해도 마찬가지로 얕은 복사 이다 const copy = {...object}

-

그렇기 때문에 깊은 복사를 하는 경우는 JSON.parse(JSON.stringify(obj)) 등을 사용하는것이 바람직하다

const object = {
  a: "a",
  number: {
    one: 1,
    two: 2,
  },
};
 
const copy = Object.assign({}, object);
 
copy.number.one = 3;
 
console.log(object === copy); // false
console.log(object.number.one  === copy.number.one); // true 
                                                     // 얼핏 복사가 된것처럼 보이지만 Object의 number.one도 3으로 바뀌어 버린것이 확인가능하다


참조

http://www.gisdeveloper.co.kr/?p=11433

https://engineer-mole.tistory.com/151

https://bbangson.tistory.com/78

Feb 25, 2023 Views 91