Copying array values to multiple arrays

Question

I've stuck with basics of JavaScript array. here is my code

let arr = ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]];
let new_arr = [];

new_arr = new_arr.concat(arr);
console.log(new_arr); //output : ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]]

new_arr[2].pop();
let sub_arr = [];
sub_arr = sub_arr.concat(arr);

console.log(sub_arr); //output: ['students', 'exams',[{'sub1':80, 'sub2':60}]]

Expected output for sub_arr is ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]]

I've tried using slice() also. it didn't work. plz help me with this issue.

it's better to use JS Sets (use `new Set()`) as they are more performant. Furthermore sets only allow unique elements, and automatically delete equivalent elements. — Krokodil, Apr 07 '21 at 19:49
And for debugging JS arrays, especially with objects use `console.table(array)` — Krokodil, Apr 07 '21 at 19:52

Ran Turner · Accepted Answer · 2021-04-07T19:57:02.720

What you want to do is deep clone.JSON.parse and then JSON.stringify instead will do the job for this.

let arr = ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]];
let new_arr = [];

new_arr = JSON.parse(JSON.stringify(arr));
console.log(new_arr); //output : ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]]

new_arr[2].pop();
let sub_arr = [];
sub_arr = sub_arr.concat(arr);

console.log(sub_arr); //output: ['students', 'exams',[{'sub1':80, 'sub2':60}]]

score 0 · Answer 2 · answered Apr 07 '21 at 19:51

You need to deep clone your array, eg.:

const deepClone = (obj) => JSON.parse(JSON.stringify(obj));


let arr = ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]];
let new_arr = [];

new_arr = new_arr.concat(deepClone(arr));
console.log(new_arr); //output : ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]]

new_arr[2].pop();
let sub_arr = [];
sub_arr = sub_arr.concat(deepClone(arr));

console.log(sub_arr); //output : ['students', 'exams', [{'sub1':80, 'sub2':60},{'grade_sub1':'A', 'grade_sub2':'B'}]]

score 0 · Answer 3 · answered Apr 07 '21 at 20:02

You could clone a deep copy of an object by using a recursive function as seen below:

const original = [ 'students', 'exams', [
  { 'sub1': 80, 'sub2': 60 },
  { 'grade_sub1': 'A', 'grade_sub2': 'B' }
]];

const clone = val =>
  val == null
    ? null
    : typeof val === 'string'
      ? val
      : Array.isArray(val)
        ? val.map(sub => clone(sub))
        : typeof val === 'object'
          ? Object.fromEntries(Object.entries(val)
            .map(([key, value]) => [key, clone(value)]))
          : val;

const copy = clone(original);

console.log(copy);

.as-console-wrapper { top: 0; max-height: 100% !important; }

Copying array values to multiple arrays

3 Answers3