JavaScript 多次元配列の値渡し
基本
オブジェクト型(配列)は参照渡し
const a = [0,1,2];
const b = a;
//bはaを参照しているため、bを変えるとaも変わる。
b[0] = 3;
console.log(a) // [3,1,2]
console.log(b) // [3,1,2]
JavaScriptでは、オブジェクト型は参照渡しとなる。(プリミティブ型は値渡し)
オブジェクト型(配列)を値渡し
const a = [0,1,2];
const b = [...a];
//aを値渡ししたため、bを変えてもaは変わらない
b[0] = 3;
console.log(a) // [0,1,2]
console.log(b) // [3,1,2]
//連想配列は対応してません
スプレッド演算子を利用することで値渡しを行うことができる。
多次元配列で値渡し
const a = [[0,1],[0,1],[0,1]];
const b = [...a];
b[0][0] = 3;
console.log(a) // [[3,1],[0,1],[0,1]]
console.log(b) // [[3,1],[0,1],[0,1]]
多次元配列でこのようにしても、値渡しができない。 これはJavaScriptの多次元配列の仕様によるものである。
JavaScriptでは、多次元配列という構文が用意されておらず、配列の要素に別の配列リテラルを格納することで、多次元配列として扱っている。
つまり以下の状態である。
const a = [[0,1],[0,1],[0,1]];
// a = [Array [0, 1], Array [0, 1], Array [0, 1]]
なので先ほどのように多次元配列の値渡しをしたい場合は、配列の要素に対して変数を宣言して変更を加える必要がある。
const a = [[0,1],[0,1],[0,1]]
const b = [...a];
const c = [...a[0]];
c[0] = 3;
b[0] = c;
console.log(a) // [[0,1],[0,1],[0,1]]
console.log(b) // [[3,1],[0,1],[0,1]]