- 자바스크립트 개체 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] };
'Code > JavaScript' 카테고리의 다른 글
[Javascript] 함수형 프로그래밍 (0) | 2020.04.05 |
---|---|
[Javascript] Lodash 같은 라이브러리 만들기 (0) | 2020.04.04 |
[Javascript] call(), apply(), bind() 차이 (0) | 2020.04.03 |
[Javascript] 전개 구문(Spread syntax , spread operator) (...) (0) | 2020.02.27 |
[Javascript] EsLint 에러 해결 방법 (0) | 2020.02.23 |