형님의 Js 화살표함수와 구조분해할당, 얕은복사 깊은복사 개인과외 - 3

Object.entries() 에다가 배열내장 메소드인 reduce를 사용하는 방법

const a = {a:'123', b:'456'};
const b = Object.entries(a).reduce(
(acc, [key, value])=>{ acc[key]=value; return acc }, {}
);
// 이걸 구조분해 할당을 사용하지 않았다면

const origB = Object.entries(a).reduce((acc, curr)=>{ 
const key = curr[0];
const value =curr[1];
acc[key]=value;
return acc;
});
//이걸 화살표 함수를 안쓴다면?

const realOrigB = Object.entries(a).reduce( function(acc,curr){
const key = curr[0];
const value = curr[1];
acc[key]=value;
return acc;
});

//이걸 익명 함수를 안쓴다면?

function some(acc, curr) {
const key = curr[0];
const value = curr[1];
acc[key]=value;
return acc;
};

const GaeRealOrigB = Object.entries(a).reduce(some, {});

화살표 함수의 근본

TMI : 화살표 함수는, 함수 선언에서 바로 넘어가려고하면 이해 안된다. 

함수 선언 : function something(a,b){...};
함수 표현 : const something = function (a,b){...};
익명함수 : function(a,b){...}
화살표함수 : (a,b) => {...}
더간단한 화살표함수 a => ...

구조 분해 할당 - 배열과 객체

//배열 구조분해할당의 예시 1
const testA = [1,2,3,4,5,6];
const [a] = testA;
const [testB, testC, testD, ...testE]=testA;

console.log(a);
console.log(testC, testE);
// 1
// 2, [4,5,6]


//객체 구조분해 할당의 에시
const a ={test:'1', wow :'2', good:'3'};

const test = 123;
const {test: aTest, good:aGood}=a;

console.log(test)
console.log(a.test)
console.log(a["test"]);
console.log(aTest)
// 123 1 1 1

얕은복사 깊은복사

const deepA ={
    a:123,
    b : {c:123, d: {e:"asd"} }
    };
    
    //아래의 얕은 복사는 b에 대응 불가. 
    const copyB = {...deepA};
    
    //아래는 깊은 복사. 몇뎁스건 다 된다. 근데 엄청 오래걸린다
    const copy1 = JSON.stringify(deepA);
    const copy2 = JSON.parse(copy1);
    
    const finallCopy = JSON.parse(JSON.stringify(deepA));
    
    deepA.a = 12222;
    deepA.b.c = 11111;
 

console.log(typeof copyB);
console.log(copyB.b.c); //스프레드 문법은 원본값 deepA에 영향 받아버림
console.log(deepA);
console.log(copyB); // 원시타입인 a는 영향 안받았음. 12222로 안바뀜.
console.log(copy1); //JSON 자료형

console.log(copy2); // 아래와 같음
console.log(finallCopy);

// object
// 11111
// { a: 12222, b: { c: 11111, d: { e: 'asd' } } }
// { a: 123, b: { c: 11111, d: { e: 'asd' } } }
// {"a":123,"b":{"c":123,"d":{"e":"asd"}}}
// { a: 123, b: { c: 123, d: { e: 'asd' } } }
// { a: 123, b: { c: 123, d: { e: 'asd' } } }