表題の通り、以下のような配列の中で、最大の長さ・要素数を持つものの、長さ・要素数の値を求める話です。
const testArray = [
[5, 10, 8, 7, 11],
[1],
[3, 6, 2],
[12, 8, 7, 4, 2, 1, 0, 9],
[1, 8],
];
const testArray = [
{ a: 0, b: 3 },
{ a: 7 },
{ a: 8, b: 6, c: 11, d: 3 },
{ a: 9, b: 2, c: 12 },
];
2次元配列を対象にした処理
まずは、異なる長さの配列を要素にもった配列、その 2次元配列を対象に要素数の最大の長さを求めてみます。
プログラムは以下の通りで、「単純なループ処理」・「reduce を使ったもの」・「map・スプレッド構文を使ったもの」の 3通りをのせています。
const testArray = [
[5, 10, 8, 7, 11],
[1],
[3, 6, 2],
[12, 8, 7, 4, 2, 1, 0, 9],
[1, 8],
];
function setup() {
createCanvas(450, 350);
// 単純なループで処理
let maxLength = 0;
for (element of testArray) {
if (element.length > maxLength) {
maxLength = element.length;
}
}
console.log(maxLength);
// reduce を利用
const maxLength2 = testArray.reduce((previousValue, currentValue) =>
max(
Array.isArray(previousValue) ? previousValue.length : previousValue,
currentValue.length
)
);
console.log(maxLength2);
// map・スプレッド構文を利用
const maxLength3 = max(...testArray.map((arr) => arr.length));
console.log(maxLength3);
}
function draw() {}
ここで、p5.js の関数を使っているのは、 max() の部分のみです。
これは、もちろん JavaScript のみで書くなら Math.max() で置きかえてやれば OK です。
これらの中では、map・スプレッド構文を利用する形がシンプル。
オブジェクトの配列を対象にした処理
次に、異なる要素数のオブジェクトを要素にもった配列を対象にしてみます。
上記の map・スプレッド構文を利用する形がシンプルだったので、それを用います。
const testArray = [
{ a: 0, b: 3 },
{ a: 7 },
{ a: 8, b: 6, c: 11, d: 3 },
{ a: 9, b: 2, c: 12 },
];
function setup() {
createCanvas(450, 350);
// 単純なループで処理
let maxLength = 0;
for (element of testArray) {
if (Object.keys(element).length > maxLength) {
maxLength = Object.keys(element).length;
}
}
console.log(maxLength);
// map・スプレッド構文を利用
const maxLength3 = max(
...testArray.map((object) => Object.keys(object).length)
);
console.log(maxLength3);
}
function draw() {}