質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

1260閲覧

[JavaScript]2つの配列の値を合計し平均値を出す方法

newyee

総合スコア213

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

1クリップ

投稿2018/06/27 09:43

下記のコードは、自分で作成したコードなのですが、もう少しシンプルに書く方法があったら教えて頂きたいと思いご質問させて頂きました。
コードで実現したいこととしましては、配列変数、「data1」と「data2」の値を合計し、平均値を出し、さらに、求めた平均値以上の値を全て出力する、といった内容です。

JavaScript

1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <title>practice</title> 6 </head> 7 <body> 8 <script> 9 10 var data1_sum = 0; 11 var data2_sum = 0; 12 var ave = 0; 13 14 var data1 = [59, 39, 100, 2, 15, 40, 84, 97]; 15 var data2 = [63, 18, 64, 97, 50, 98]; 16 17 for(var i = 0; i < data1.length; i++){ 18 19 data1_sum += data1[i]; 20 } 21 22 for(var i = 0; i < data2.length; i++){ 23 24 data2_sum += data2[i]; 25 } 26 27 ave = (data1_sum + data2_sum) / (data1.length + data2.length); 28 29 document.write("<p> data1とdata2を合わせた平均値" + ave + "</p>"); 30 31 for(var i = 0; i < data1.length; i++){ 32 33 if(data1[i] >= ave){ 34 35 document.write("<p>data1:" + data1[i] + "</p>"); 36 } 37 } 38 39 for(var i = 0; i < data2.length; i++){ 40 41 if(data2[i] >= ave){ 42 document.write("<p>data2:" + data2[i] + "</p>"); 43 } 44 45 } 46 47 48 49 50 51 52 53 54 </script> 55 </body> 56</html>

よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

ベストアンサー

こんにちは。

たとえば以下のようなやり方でいかがでしょうか。
(※ 下記のコードは、https://jsfiddle.net/jun68ykt/qgyar358/16/ にも上げておきました)

javascript

1const 2 data1 = [59, 39, 100, 2, 15, 40, 84, 97], 3 data2 = [63, 18, 64, 97, 50, 98], 4 dataAll = data1.concat(data2); // data1 と data2 を連結した配列 5 6const ave = dataAll.reduce((sum, e) => sum + e) / dataAll.length; // 平均を求める 7 8const results = [data1, data2].map((data) => data.filter(e => e >= ave)); // 平均以上の要素から成る配列を作成 9 10console.log(results[0]); // data1 の要素で平均以上のもの: [59, 100, 84, 97] 11console.log(results[1]); // data2 の要素で平均以上のもの: [63, 64, 97, 98]

上記を実行すると以下が表示されます。

[59, 100, 84, 97]

[63, 64, 97, 98]

参考になりましたら幸いです。


補足

reduce を使って合計を算出するのは、以下の質問

https://stackoverflow.com/questions/10359907/array-sum-and-average

で、多数の Good がついている回答(上から2番目)にも、次のようなサンプルで出ています。

javascript

1var sum, avg = 0; 2 3// dividing by 0 will return Infinity 4// arr must contain at least 1 element to use reduce 5if (arr.length) 6{ 7 sum = arr.reduce(function(a, b) { return a + b; }); 8 avg = sum / arr.length; 9} 10 11document.write("The sum is: " + sum + ". The average is: " + avg + "<br/>");

ただし、上記の回答についているコメント

elegant !== fast. Array.prototype.reduce requires the execution of a function on each iteration which is far slower (orders of magnitude) than running a simple loop. jsperf.com/speedy-summer-upper – furf May 7 '13 at 18:47

からのリンク先 にあるように、処理の速さをとるなら、ループのほうがよいです。特に、配列の要素数が多くなったときに差が出てきそうです。

投稿2018/06/27 11:05

編集2018/06/28 00:28
jun68ykt

総合スコア9058

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

newyee

2018/06/28 00:28

ご丁寧にご回答いただきましてありがとうございます。 すみません。他の方のご回答も頂いているのですが、自分のスキルレベル以上のことを考えず質問してしまったなと反省しております... 実は、正直なことを申しまして、質問内容に関係なく、ご回答下さった構文においても理解できていない状況でして... せっかくご丁寧にご回答くださったのに、本当にすみません... この質問に関しましては、きちんと勉強をし、ご回答下さった内容が理解できると思った時にまた、ご参考にさせて頂きたいと思っております...
jun68ykt

2018/06/28 00:31

なるほどです。頑張ってください。
guest

0

下記の記事がほぼそのまま参考になると思います。

投稿2018/06/27 09:48

m.ts10806

総合スコア80765

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

newyee

2018/06/28 00:10

ご回答ありがとうございます。 動物病院の予約システムの件では、アドバイス&ご指摘頂きましてありがとうございました。 貼って頂いたリンクなのですが、まだ僕自身知識不足すぎて、理解できない部分が多いですので、もう少し勉強をし理解できるようになったと思った際にご参考にさせて頂きたいと思っております。 後、質問させて頂いた内容とは関係がないのですが、質問全般のことに関してお聞きしたいことがございまして... 僕自身、プログラミンの勉強をしている際に、分からないことがあったら何度も質問させて頂いているのですが、自分のスキルレベルが低い状態ですと、ご回答下さっても、理解できない部分が多々あります。 実際は、自分が現在のスキルレベルよりも高い内容のことをご質問しているかもしれないとは認識はしているのですが、もしかしたら自分でも分かるかもしれないと思いご質門させて貰っているんですよね... 今回の場合ですと、まだ配列の所までしか学習が終わっていないのに、関数も絡んでくるだろうという認識はありながらも質問させて頂きまして... 長々と関係ない質問すみません。
m.ts10806

2018/06/28 00:20 編集

えーと。 まず理解できてない云々を言い訳にするのではなく、実際に動かしてみればいいだけの話です。 「これがこうなるのか」と実体験すればそれが知識になり続けていくうちに 「今度はこう使えるんじゃないか」と応用につながる。 提示した記事で今質問者さんがやっているのは「イケてない実装」の方そのままです。そこは分かりますよね?ほぼ同じコードなので。 だからこそ「これがこうなる、こう変化させられる」というイメージがつきやすいと思ったのですが。 teratailの「質問するときのヒント」に書いてあることがまさにやるべきことです。 https://teratail.com/help/question-tips#questionTips2 >質問をする前に自分で何がわからないのかを把握しましょう >今置かれている状況を整理し、わかっている範囲とわからない範囲を明確にしましょう 何一つ分かってないということはないはずです。 ただ単に「分かっていることの中に分かっていないことが出てきたら”全て分かってない”と錯覚してしまっている」だけです。 落ち着いて見てみれば見覚えのある表現がでてきているはずです。 分かっている範囲と分からない範囲が明確にできたら、あとは「分からない範囲」を調べて分かっている範囲との連携部分とか辻褄をあわせていくものです。 英語の文章とかまさにそれですね。中学卒業程度の授業を受けていたら一文全て分からないということは滅多にないです。分からない部分を辞書を引いて文章として成り立つ形を目指していく。そうすると意味が通じるようになる。 それと同じだと思います(まあ日本語のちょっと難しい小説読むときとかでも同じことが言えます)
newyee

2018/06/28 10:12

分かりました。取り敢えずは、理解できない部分があったとしても、ご回答くださったコードを写してみるなどして、実行してみたいと思います。 いつもご丁寧なアドバイス&ご指摘感謝致します。
guest

0

質問に関しては jun68ykt様が記述しておられるものが一番コード数が少なく限りなく正解に近いかと!

回答済みになっていないということはまだ理解ができておられない、ということで私なりに補足しますと

javascript

1dataAll = data1.concat(data2); // data1 と data2 を連結した配列

ここはconcat関数で単純にdata1とdata2を結合しています。

javascript

1dataAll.reduce((sum, e) => sum + e)

ここではreduceという関数を使用して前手順で結合した配列(dataAll)の合計値を求めています。
reduce関数は配列の最初の要素から後方の要素へ与えられた関数を同時に適用していきます。( sum+ e の部分)

分かりやすくすると

javascript

1dataAll.reduce(function(a , b){ return a + b });

といった感じでしょうか。
aには最初の引数、bには2番目の引数が渡されますので、59 + 39がreturnされます。
その次は59 + 39(=98)の値がaに代入され、bには3番目の要素100が入ります。
これが自動的に行われ続け配列内の値の合計が求められると考えて問題ないかと。

その後

javascript

1/ dataAll.length;

の一文でdataAll内の配列要素数で割っています。
arr.lengthプロパティはその配列の要素数が入るようになっています。

少しでも理解、解決の手助けになれば。

投稿2018/06/28 09:29

unorigino

総合スコア128

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

jun68ykt

2018/06/28 09:32

丁寧な解説、ありがとうございます!
newyee

2018/06/28 10:25

ご丁寧にご解説頂きありがとうございます。 おおよそ把握することができました。まずは、実際にコードを実行してみて、多少の分からない部分などは調べながら、確かめていきたいと思っております。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問