Javascriptで二次元配列の各要素に全て計算処理をしたいです。

Question

[
  ["1", "2", "3", "4"], 
  ["5", "6", "7", "8"],
  ["9", "10", "11", "12"]
]

このような二次元配列の各行の、
数字全ての二乗和の平方根を計算して、新しい配列を作りたいです。

結果として得たい形は、

[
  一行目の計算結果, 
  二行目の計算結果,
  三行目の計算結果
]

というものです。

二乗和の平方根を出すためのメソッドとしてMath.hypot()があることを知り、
それとforEach文を組み合わせて試したのですが、うまくいきません。
以下は試したコードです。

var sample = array.forEach(function( value ) {
     Math.hypot( value );
});
console.log(sample);

コンソールしてみるとundefinedと出てきます。

どなたかご教示のほど、よろしくお願いいたします。

Answer 1

array.forEach()の返り値はundefinedですので表示は正しいです
希望されている動作をするのはforEachではなくmapかと思います

Comments

[hachimitu_remon]

ご回答ありがとうございます。
array.mapで試してみたら、配列は出来ました。
しかし結果の配列の要素が全てNaNになってしまっていて、その問題を解決しようと奮闘しています。
アドバイスを頂けると嬉しいです。

[AkitoshiManabe]

hachimitu_remon さん
類似のご質問 https://teratail.com/questions/234689 の回答を踏まえて計算すると解決できるはずです。

[hachimitu_remon]

AkitoshiManabeさん、お返事ありがとうございます。
もう一つの質問によって数値化は成功したのですが、それでもなお結果はNaNとなってしまっています。
おそらくmapメソッドを二次元配列に適用する際にどこかでミスをしているのかと思い、今試行錯誤しています。

[退会済みユーザー]

Math.hypotの引数に数値に変換できないものがあると結果がNaNになるとリファレンスに記載されています
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/hypot
mapは引数に渡した関数を配列の各要素に適用するものです
今回の場合、要素は配列になりますのでNaNとなります

[hachimitu_remon]

retlatさん、お返事ありがとうございます。
おっしゃる通りでした。

Answer 2

samples = array.map( row => {

  console.log( row ) // rowの変化を確認#1
  row = row.map(Number); // 数値化
  console.log( row ) // rowの変化を確認#2

  let hypot = /* ヒント：二乗和の平方根を返却 */
  console.log( hypot ) // 結果を確認

  return hypot;
})

Math.hypot( n0, n1, n2, ... ) は Math.max() や Math.min() のように引数ごとに数値を与える関数ですが、apply( null, likaAry ) を使うことで対応できます。

---

コードは 意図した結果を得られるように書くことを重視し、複数行に渡って示しました（短く書き直すのは後から出来ます）。

Comments

[hachimitu_remon]

AkitoshiManabeさん、ご回答ありがとうございます。
ヒントの通りに今、コードを考えているのですが、
let hypot = の後には関数を宣言するのですよね？
関数自体の形ははなんとなくわかってきたのですが、私の勉強不足でその関数をどう配列の各値に作用させるのかが分からず、混乱してしまっています。。

関数は、
function()
{
var y = 0;
var length = arguments.length;

for (var i = 0; i < length; i++) {
if (arguments[i] === Infinity || arguments[i] === -Infinity) {
return Infinity;
}
y += arguments[i] * arguments[i];
}
return Math.sqrt(y);
};
のような感じでしょうか。
Math.hypot()のポリフィルから持ってきて、やっていることは分かるのですが。。

[AkitoshiManabe]

リンク先 のMDNでは、``Math.min.apply(null, arg)`` みたいに利用されていませんか？

[hachimitu_remon]

AkitoshiManabeさん、お返事ありがとうございます。
``Math.min.apply(null, arg)`` のようなコードでとりあえず計算結果は正確に出せました。
まだ、配列内に重複が発生してしまう問題などがありますが、.applyを使う事で大きく進展はしたので、
ベストアンサーを付けさせていただきます。