- 자바스크립트 개체  Array deep clone , 복사, 복제

//----------------
< 얕은 복사 >
let arr = [1,2,3], arr2;

arrs1 = [...arr]; //spread 연산자
arrs2 = arr.slice(); // Array.slice
arrs3 = []; Object.assign(arr3, arr); //Object.assign
arrs4 = Array.from(arr); // Array.from


//-------------
< 깊은 복사 >
arrd1 = JSON.parse(JSON.stringify(arr)); // JSON
    - 복사 불가 : Dates, functions, undefined, Infinity, RegExps, Maps, Sets, Blobs, FileLists, ImageDatas, sparse Arrays, Typed Arrays 

 

arrd2 = structuredClone(arr); // 주의! function 복사시 에러


arrd2 =  _.cloneDeep(arr);// lodash
arrd3 = $.extend(true, [], arr); // jQuery ,   undefined -> empty로 잘못 변환


//----------------
사용자 함수

https://stackoverflow.com/questions/4459928/how-to-deep-clone-in-javascript/34624648
function copy(aObject) {
  if (!aObject) {
    return aObject;
  }

  let v;
  let bObject = Array.isArray(aObject) ? [] : {};
  for (const k in aObject) {
    v = aObject[k];
    bObject[k] = (typeof v === "object") ? copy(v) : v;
//bObject[k] = (v === null) ? null : (typeof v === "object") ? copy(v) : v;
  }

  return bObject;
}



https://dev.to/samanthaming/how-to-deep-clone-an-array-in-javascript-3cig
// 입력값이 객체일 경우 문제 있음 , 약간 수정 필요
const clone = (items) => items.map(item => Array.isArray(item) ? clone(item) : item);




//-----------------
// 참고
https://medium.com/javascript-in-plain-english/how-to-deep-copy-objects-and-arrays-in-javascript-7c911359b089

https://dev.to/samanthaming/how-to-deep-clone-an-array-in-javascript-3cig

https://stackoverflow.com/questions/4459928/how-to-deep-clone-in-javascript

 


//--------------------
//테스트용
var arr = {a: [null, [ 1,[ 456, 
    [ 678, [null,{ s:'str', n: 1, fn: function(arg){ return arg+1;}, d : Date.now(), d2: new Date()
        , a: [ null, undefined, Infinity,  NaN , [null, 1,[123, 456]], [2,[123, 456]]] 
        , unl: null, un: undefined, inf: Infinity, nan1: NaN 
        , o: { fn: function(arg){ return arg+1;},  d2: new Date(), a: [ null, undefined, Infinity,  NaN , [null, 1,[123, 456]], [2,[123, 456]]]  }
        }] ]
    ]
    ], null] };

반응형
Posted by codens