+ JavaScript の質問用スレッド vol.131 +

**Name_Not_Found** · 2017/11/21(火) 21:58:33.01

JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください

■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。

■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)

■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【条件】期待する回答の条件を書いてください。(ex: jQuery不可, フレームワーク不可)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
　1レスに収まらないならコード投稿サイトを利用してください。
　http://jsdo.it/　http://jsbin.com/　http://jsfiddle.net/　http://ideone.com/

■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです

**Name_Not_Found** · 2017/12/01(金) 11:35:39.13

>>102
・あなたか「書いた人」が転記ミスしている
・「書いた人」が文法をよくわかっていない

文法エラーは関わった人に問題がある以外に考えられないので、第三者が推理するのは時間の無駄です。
大抵はあなたか「書いた人」が頭の中のイメージで転記しているだけで転記ミスしているケースが大半です。

**103** · 2017/12/01(金) 11:46:06.60

>>101を鵜呑みにして書いてしまいましたが、文法エラーはないですね。
>>100は

var data = '';

と等価で>>100のように回りくどい書き方をする必要は全くありません。
説明用のコードか、難読化の一環なのか知りませんが、コードの意図は書いた人に聞く以外の方法はないでしょう。

**103** · 2017/12/01(金) 11:48:12.00

>>104は

・あなたが転記ミスをしていないのなら
・「書いた人」が転記ミスしていないのなら

の条件付きの回答です。
その可能性を捨ててはいけないと思います。

**Name_Not_Found** · 2017/12/01(金) 17:40:23.92

>>98-99
var a = [0]; として Chrome62の場合
a.push(...a); を繰り返すとlengthが131072の時点で Maximum call stack size exceeded
a=a.concat(a); の場合はlengthが33554432の時点で Invalid array length

引数の問題だからスプレッド自体に問題が有るわけではないけどな

**Name_Not_Found** · 2017/12/01(金) 23:36:41.01

jQueryが必要とされなくなってきたのは,Reactなどの他のフレームワークが登場したせいではなく,標準DOM APIが進歩したおかげです
https://www.ncaq.net/2017/12/02/00/00/01/

またなんか勘違いさんというかｗ、結論ありきさんというかｗ

標準DOM APIがいくら進歩したとしても、jQueryにかなわないんだよ。
それは基本的な設計方針の違いのせい

jQueryも標準DOM APIも、どちらもDOM操作をする。
"DOM操作をするならば"、標準DOM APIよりもjQueryの方が優れてるわけで
わざわざjQueryを捨てる理由はない

その一発逆転がありえるのがReactなどのフレームワーク案だよ
"DOM操作をするならば"、jQueryや標準DOM APIが必要
だけど "DOM操作をしないならば"・・・？

そうDOM操作がいらないフレームワークがでてきたから
JavaScriptフレームワーク導入可能な一部の業種においては
jQueryや標準DOM APIがいらなくなってきたという話
DOM操作がいるならば、これからもjQueryが必要だって

**Name_Not_Found** · 2017/12/02(土) 00:00:42.05

　jQueryをフレームワークにすればと思うけど

**Name_Not_Found** · 2017/12/02(土) 01:01:06.91

>>100-105
式 ? a : b
3項演算子は、式が真なら a で、偽なら b だろ

var data = ('' == 0 ? '' : '');
式 ? a : a

式が、真でも偽でも、空文字を返すから、この式は無意味。
単に空文字を代入すれば良いだけ

**Name_Not_Found** · 2017/12/02(土) 01:25:47.76

あー、まだ >>100の答え出てなかったのか？

var data = ('' == 0 ? '' : '');

これは最終的にこう書いてあるってだけ。そう最終的に

これだけじゃわからんのよ。
間違いかもしれないし意味があるかもしれない。

もしかしてソースコードはこうなっているかもしれない

var data = ('<?= $v' ?>' == 0 ? '' : '<?= $v' ?>');

$vに0が入っていれば
var data = ('0' == 0 ? '' : '0');
0なら空文字

var data = ('1' == 0 ? '' : '1');
1（0以外）なら1

var data = ('' == 0 ? '' : '');
空文字でも空文字

0の場合だけ空文字になる

**Name_Not_Found** · 2017/12/02(土) 01:26:42.28

訂正

var data = ('<?= $v ?>' == 0 ? '' : '<?= $v ?>');

**Name_Not_Found** · 2017/12/02(土) 01:29:18.11

もちろん、意味があるコードかもしれないとは言うが
無駄かつ良くないコードだとも言う
普通はこんな書き方はしない。
こんな書き方はしないが意味が無いとは言い切れない

**Name_Not_Found** · 2017/12/02(土) 09:12:56.52

>>112
無駄なコードを意味がないコードと表現してるだけだろ
言葉遊びも程々にしろ

**Name_Not_Found** · 2017/12/02(土) 09:14:30.51

論理演算の意味がない

**Name_Not_Found** · 2017/12/02(土) 09:22:55.15

三項演算子を出力する意味がない

**Name_Not_Found** · 2017/12/02(土) 18:16:31.30

>>113
「0だったら空文字にしたい」という要望があったとしたら
それを正しく実装しているわけで無駄ではないよ

**Name_Not_Found** · 2017/12/03(日) 00:19:35.36

>>116
それは三項演算子ではなく、ただのif文だろ
それと「無駄かつ良くないコードだとも言う」に言及して反論してるのだが、前言撤回もここまで早いと信頼性ゼロだな

**Name_Not_Found** · 2017/12/03(日) 00:42:59.95

>>117
少なくともifであることは認めたようだが
あんたにとって三項演算子とifの違いって何？

**118** · 2017/12/03(日) 00:44:06.26

> var data = ('<?= $v' ?>' == 0 ? '' : '<?= $v' ?>');

これはやってることに意味があるが
無駄かつ良くないコードだろ
何を反論してるんだ？

**Name_Not_Found** · 2017/12/03(日) 00:46:44.07

>>118
質問の意図が分からんし、「無駄かつ良くないコードだとも言う」の否定に反論がないなら、話はここで終わりだな

**Name_Not_Found** · 2017/12/03(日) 00:47:37.59

> 質問の意図が分からんし、「無駄かつ良くないコードだとも言う」の否定に反論がないなら

無駄かつ良くないコードだと言ったのは俺なんだが、
なんで俺が自分が行った言葉に反論しなきゃいけないんだ？

**Name_Not_Found** · 2017/12/03(日) 00:48:48.68

無駄かつ良くないコードだが
ちゃんと動く

っていうことの意味が分からんのかな？

俺ここでよく無駄かつ良くないコードを
修正してるんだが

**Name_Not_Found** · 2017/12/03(日) 00:49:05.59

>>119
>>112では「無駄」と認めながら>>116では「無駄ではない」といってるだろ
前後で主張が変化する奴は信用できない

**Name_Not_Found** · 2017/12/03(日) 00:50:11.59

あ、揚げ足取っていただけかｗ

**Name_Not_Found** · 2017/12/03(日) 00:54:47.33

揚げ足ではないような
自己矛盾を抱える人は日本語が分かってない人という典型かな

**Name_Not_Found** · 2017/12/03(日) 01:10:35.99

日本語がわからんやつは困るね。いちいち説明せんといかんのかね
コードが無駄だってだけで動作は無駄じゃないってことだよ
ちゃんと書いてあるだろ

**Name_Not_Found** · 2017/12/03(日) 14:02:27.52

動作自体が無駄

**Name_Not_Found** · 2017/12/03(日) 14:11:59.68

じゃあ無駄じゃない動作とは？

**Name_Not_Found** · 2017/12/03(日) 14:27:27.65

祈りの所作

**Name_Not_Found** · 2017/12/03(日) 16:24:26.70

必要なことをやっているけど無駄の多いコードは冗長なコードというべきではないか

**Name_Not_Found** · 2017/12/03(日) 17:55:51.86

1 + 1 // ->
で2が出力されるのですが、これは何でしょうか？？？

**Name_Not_Found** · 2017/12/04(月) 12:45:59.51

>>130
>>130
「冗長」の意味を調べなおした方がいいのではないか。

"文章・話などが、「むだ」が多くて長いこと。また、そのさま。"
https://dictionary.goo.ne.jp/jn/109389/meaning/m0u/

**Name_Not_Found** · 2017/12/04(月) 13:17:53.26

> 必要なことをやっているけど無駄の多いコード
「必要」と「無駄」は対義語
必要なことをやっているなら無駄ではない

**Name_Not_Found** · 2017/12/04(月) 13:19:29.68

>>132
なるほど、この場合はコードに無駄が多くて長いが
処理そのものには意味がある（無駄ではない）ってことだな

**Name_Not_Found** · 2017/12/04(月) 13:20:38.96

>>133
必要の対義語は不必要ってでてきたけど？

**Name_Not_Found** · 2017/12/04(月) 18:31:21.62

必要かつ無駄は矛盾してると思うけどね

**Name_Not_Found** · 2017/12/04(月) 18:45:27.08

>>136
日本語ひどすぎねぇか・・
「必要」かつ「無駄」ってそれぞれ修飾してる語が違うんだけど

**Name_Not_Found** · 2017/12/04(月) 18:47:12.01

>>134
いつも通りの曲解だな

**Name_Not_Found** · 2017/12/04(月) 18:48:18.37

>>137
俺は無駄なコードを書いている
俺は必要なことをやっている(無駄なコードを書く事は必要である)

**Name_Not_Found** · 2017/12/04(月) 21:08:50.03

必要なことをやっているコードと
必要なことだけで書かれてるコードは違うだろう

**139** · 2017/12/04(月) 21:14:31.74

意味不明な論理だし、直接的に反論しないところがいやらしいな

**Name_Not_Found** · 2017/12/04(月) 21:18:43.71

つまりダムってことだな

**Name_Not_Found** · 2017/12/04(月) 21:20:39.67

>>112はいつもの日本語破綻者だしなあ
曖昧に濁して、相手の反応を伺う事で糸口を探してるんだろ

**Name_Not_Found** · 2017/12/04(月) 21:53:11.51

> 必要なことをやっているけど無駄の多いコード
そもそも、これは「無駄なコードを残すことに意味がある」と主張したいが為の論理でしょ
「必要」と「無駄」の修飾先が違うのなら、必要なAだけ残して無駄なコード(B)を排除すれば良いだけ
よって、「無駄なコード(B)を書く事に意味はない」と結論される
どちらにしても、論理が破綻してるんだよ

**Name_Not_Found** · 2017/12/04(月) 22:13:47.23

カレンダーのマス目に編集ボタンが配置されていて、編集ボタンをクリックすると編集画面が表示されるページを作成しています。ここでお尋ねしたいのが、idの名前の付け方です。
今は、id=btnEdit20171201、id=btnEdit20171202と名前を付けていますが、より良い名前の付け方はありますか？

**Name_Not_Found** · 2017/12/04(月) 23:25:30.85

idをつけない、という選択肢もあるんじゃないかな
押したボタンから日付を取得したいなら、カスタムデータ属性なり、button要素でvalue属性を使うなり、手はいくらでもある

**Name_Not_Found** · 2017/12/04(月) 23:48:01.31

>>145
>>146も書いているけどそういうIDが必要になるのがおかしい気がするね。
JavaScriptのスレに書いてるってことは、JavaScriptからそれらを参照するつもりなのだろう

本題の前に言っておくと、普通HTMLでは全部小文字でハイフン区切りが多い
btn-edit-20171201 みたいに。なぜかはよく分からんけどアンダースコアはあまり使われない
まあそれでもBEMみたいな変則的なものは有るし、強制ではない

んで、本題。あーだこーだ言いたいが、まあ要するにIDなしでやる方法を知らんのだろう？
なので軽くサンプルを書いてあげよう
https://jsfiddle.net/bfw0m3p6/

**Name_Not_Found** · 2017/12/05(火) 00:40:08.94

>>146,147
ありがとうございます。とても参考になりました。idを振らずにイベントをトリガーしたり、カスタムデータ属性を使う方法などがあるのですね。
編集画面でクリックされた日の年月日を引き継いで表示したりすることを考えると、カスタムデータ属性が面白そうですね！

**Name_Not_Found** · 2017/12/05(火) 00:54:54.75

>>148
そのマス目に入れるものが日付だけならtime要素を使うのが良いかもね
https://developer.mozilla.org/ja/docs/Web/HTML/Element/time

<time datetime="2017-12-05">5日</time>

**Name_Not_Found** · 2017/12/06(水) 17:17:54.46

['みかん','りんご','みかん','ばなな','りんご','りんご',]から
一番出現回数の多い「りんご」を得るにはどうすればいいでしょうか？

**Name_Not_Found** · 2017/12/06(水) 18:26:46.19

>>150
sort してから反復するとか

let a = [‘りんご’, … ];
a.sort();

let max = -1, // 最大出現回数
let count = 0, // 現在の単語の出現回数
let word, // 出現回数最大の単語

a.reduce(f);

function f(前, 次){
if(前 === 次){
count +=1
} else {
if( max < count ) { max = count; word = 前 }
count = 0;
}

みたいな感じ（細かい所は省略

**Name_Not_Found** · 2017/12/06(水) 18:33:37.87

>>151
すまん、 reduce の使い方がダメダメだったので取り消す

**Name_Not_Found** · 2017/12/06(水) 22:06:13.37

var fruitsArray:Array<String> = ['みかん','りんご','みかん','ばなな','りんご'];
var fruitsMap:Map<String, Int> = new Map();
var count:Dynamic;

for (fruit in fruitsArray) {
count = fruitsMap[fruit];
if(count == null){
count = 1;
} else {
++count;
}
fruitsMap[fruit] = count;
}
trace(fruitsMap);
// 出力 {みかん => 2, りんご => 2, ばなな => 1}

Haxe で書いた。以下で試して。
https://try.haxe.org/

Map に入れたけど、最大値が複数ある場合の、処理がわからない

**Name_Not_Found** · 2017/12/07(木) 00:27:44.39

>>150
lodashを使った
https://jsfiddle.net/5azq6k7q/

const counts = _.countBy(['みかん','りんご','みかん','ばなな','りんご','りんご']);
const max = _.max(_.values(counts));
const picked = _.pickBy(counts, _.partial(_.eq, max));
const items = _.keys(picked);
console.log(items);
// => ["りんご"]

出現回数が最大のものが複数ある場合を考慮して複数返している

**Name_Not_Found** · 2017/12/07(木) 15:49:48.80

>>154
ありがとうございます
やっぱりライブラリ使わないと難しそうですね

**Name_Not_Found** · 2017/12/07(木) 21:15:11.79

>>155
別にライブラリ使わなくてもできるよ。
ただ見て分かる通り優れたライブラリを使うとこの程度の問題なら
複雑化の原因になる条件分岐やループを使わずに最小のコード量で実装できる

**Name_Not_Found** · 2017/12/07(木) 23:12:55.32

すごいな。ちゃんとconstだけでかけちゃってる

**Name_Not_Found** · 2017/12/07(木) 23:19:30.37

Haxe で書いた通り、まずMap が必要だから、
ES6(2015) + Babel で、ES5 へ変換

>>153
で、Map に入れる所までは書いたから、その後を書けば？
漏れは、最大値が複数ある場合の、処理がわからなかったけど

Lodash も、ES6 もほぼ同じ

**Name_Not_Found** · 2017/12/08(金) 00:00:01.13

ES6は必要最小限しか言語機能として搭載しない
という考え方があるから、高度なことはできんよ

>>154の例だとcountByとpickByはない
その他は代替方法があるが少し冗長になる
まあ書いてみると良いよ

**Name_Not_Found** · 2017/12/08(金) 00:20:11.03

ES6 が流行れば、Underscore/Lodash がいらなくなる、という記事が一杯あるけど

Ruby, Kotlin だと、ライブラリが無くても、かなり簡潔に書けるけど。
列Aでソートして、それが同じ値なら、さらに列Bでソートするとか

Kotlin 2
https://mevius.5ch.net/test/read.cgi/tech/1509462463/18

**Name_Not_Found** · 2017/12/08(金) 01:46:22.33

>>160
そこに出てくるMutableListやmutableListOfってのはライブラリだよ

Kotlin Standard Library の一部
https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.collections/-mutable-list/index.html
https://kotlinlang.org/api/latest/jvm/stdlib/kotlin.collections/mutable-list-of.html

RubyのArrayも（組み込み）ライブラリ
https://docs.ruby-lang.org/ja/latest/class/Array.html

言語の範囲っていうのは一般的にはかなり少なく作るもの
関数やクラスの文法とか基本的なものだけ
大部分は標準ライブラリとして実装するのが普通

残念ながらJavaScript（ES6）の標準ライブラリはかなり小さく作られてる
その気になれば一気に最低でもRubyレベルまで実装するのは可能だろうになぜかそういうことをしない。
互換性を保つためなのかブラウザベンダーの負担を減らすためなのか知らんけど

この方針が変わらない限り、貧弱なライブラリとそれを補うlodashとかの構図は変わらない

**Name_Not_Found** · 2017/12/08(金) 01:53:01.14

初歩的な質問で恐縮ですが、お分かりの方ご教授ください。

画像のパスの一部を書き換えるjsを書いてるんですが
ネットで調べてページすべての画像は↓で変更できるようになったのですが、
特定のclass（<div class="gallery">）の中にある<img>画像だけ書き換える時の書き方がわかりません。
jsマスターの方、ご教授ください。

window.onload = function() {
var images = document.images;
for (var i=0, n=images.length; i<n; i++) {
var img = images[i];
img.src = img.src.replace(/xxx/, 'xxx_s');
}
};

**Name_Not_Found** · 2017/12/08(金) 02:01:45.73

>>155
ライブラリ使わなくても単純に考えればいいのよ
const fruits = ['みかん','りんご','みかん','ばなな','りんご','りんご',];
const counts = [];
const result = [];
let max = 0;
for (let fruit of fruits) {
let c = counts[fruit] || 0;
if (++c >= max) {
if (c > max) {
max = c;
result.length = 0;
}
result.push(fruit);
}
counts[fruit] = c;
}

console.log(result);

**Name_Not_Found** · 2017/12/08(金) 02:06:22.46

>>162
jQueryが得意そうな課題だなｗ
動かしてないけどこんな感じかな

$(function() {
　$('.gallery img').attr('src', function() {
　　return this.src.replace(/xxx/, 'xxx_s');
　});
});

**Name_Not_Found** · 2017/12/08(金) 02:06:56.67

>>162
var images = document.querySelectorAll("div.gallery img");

**162** · 2017/12/08(金) 02:23:12.26

>>164
>>165
さっそくありがとうございます。
お二方のコード双方動きました。
動くと嬉しいですね～。

**Name_Not_Found** · 2017/12/08(金) 02:50:47.41

>>166
あ、ごめん。少し無駄があった。
（最初のページロードを待つ部分は単に書くのを省略するとして）

$('.gallery img').attr('src', function(i, src) {
　return src.replace(/xxx/, 'xxx_s');
});

もしくは、これで良かったんだ。

$('.gallery img').attr('src', (i, src) => src.replace(/xxx/, 'xxx_s'));

なんのためにfunctionを使ったんだ？っていうねｗ

**Name_Not_Found** · 2017/12/08(金) 03:16:43.69

文字列の先頭からのマッチングに使うのに適した変数名は何だろう
startWithか？とか思って検索していて、
ES6からStringにstartsWithメソッドが追加されているのに気づきました
こんなメソッド知ってましたか？
Google書籍検索で「JavaScript startsWith」で検索しても、
日本語の本は一冊も出てこないところをみると、
知らない人は決して少なくないと思います
他にもES6で追加されているのに知らないメソッドがある気がします
どう調べればいいですか？

**Name_Not_Found** · 2017/12/08(金) 03:19:02.22

普通にググって見つかるので

**153** · 2017/12/08(金) 06:13:25.95

Ruby 初心者スレッド Part 62
https://mevius.5ch.net/test/read.cgi/tech/1511451329/96

ちなみに、Ruby でやってみた

**Name_Not_Found** · 2017/12/08(金) 06:29:21.92

>>163
答えが複数ある場合でも、OK だね

ただ、そういう複雑なプログラムを書きたくないから、
便利な関数を検索していた

**Name_Not_Found** · 2017/12/08(金) 12:42:30.79

>>163
ありがとうございます
みかんとりんごが同数の場合は、どちらか一つが取れればいいので
こんな感じに書いてみましたが間違ってたらご指摘下さい

var fruits = ['みかん','りんご','みかん','みかん','ばなな','りんご','りんご',];
var fruit = fruits.filter(function (value, index, self) {
if (index === 1) {
return self.indexOf(value) === index && index !== self.lastIndexOf(value);
}
});
console.log(fruit);

**Name_Not_Found** · 2017/12/08(金) 21:54:48.56

>>171
何を持って複雑というかだね。

俺は条件分岐やループが多く処理の中で状態が
変化するようなものを複雑だと定義している

だけど人によっては知らない関数を使うことを
複雑だと言う人もいるだろう

**Name_Not_Found** · 2017/12/08(金) 21:57:13.56

>>172
const counts = _.countBy(['みかん','りんご','みかん','ばなな','りんご','りんご']);
const max = _.max(_.values(counts));
const picked = _.pickBy(counts, _.partial(_.eq, max));
const items = _.keys(picked);
console.log(items);
// => ["りんご"]

さっきの答の最後を書き換えて

console.log(items[0]);

こうすればいいだけだよ

**Name_Not_Found** · 2017/12/08(金) 22:06:48.91

>>173
> 何を持って複雑というかだね。
いや、複雑の定義は（いくつか有るとは言え）ソフトウェア業界で決まってるんだから
いくつか有るうちのどれかに従おうよｗ

オンラインで複雑度を調べるサイトぐぐってみたら
http://jsmeter.info ってのを見つけた
（意味は知らないのあるからちょっと調べてみようかな）

>>163の結果
http://jsmeter.info/m61k7f/1#results
Statements: 27
Lines: 17
Branches: 3
Depth: 3
Cyclomatic Complexity: 4
Halstead Volume: 322
Halstead Potential: 4.75
Program Level: 0.0148
MI: 104.43

>>154の結果
http://jsmeter.info/35xbq5/1#results
Statements: 16
Lines: 5
Branches: 0
Depth: 0
Cyclomatic Complexity: 1
Halstead Volume: 223
Halstead Potential: 4.75
Program Level: 0.0213
MI: 126.20

**Name_Not_Found** · 2017/12/08(金) 22:20:56.36

Statements: 文の数（少ない方が良い）
Line: 行数（少ない方が良い）
Branches: 分岐数（少ない方が良い）
Depth: ネストの深さ（少ない方が良い）
Cyclomatic Complexity: 循環的複雑度
　10 以下であればよい構造
　30 を越える場合，構造に疑問
　50 を越える場合，テストが不可能
　75 を越える場合，いかなる変更も誤修正を生む原因を作る
Halstead Volume: よくわからん
　https://www.imagix.com/user_guide_jp/class-metrics.html
　Halstead プログラム量？
Halstead Potential: よくわからん
　http://se-naist.jp/old/lecture/se3/2006/handouts/productmetrics2.pdf
　語彙の多さに着目した尺度？
Program Level: 抽象度？（高い方がいい？）
MI: 保守容易性（高い方がいい）

**Name_Not_Found** · 2017/12/09(土) 00:53:25.98

>>175-176
ライブラリのコードを含めて比較しなければ公正とはいえない

**166** · 2017/12/09(土) 00:53:30.06

>>167
両方動きました！
上級者になると一行で書けるんですね。

**Name_Not_Found** · 2017/12/09(土) 00:55:50.83

>>177
ライブラリの部分は十分にテストされて書かなくていい部分だから
そこを含める必要はないよ

っていうかその話をするとブラウザの部分まで含めろ
OSの部分まで含めろってなるだろ

**Name_Not_Found** · 2017/12/09(土) 02:40:12.73

自分の書くコードをシンプルにするためにライブラリを使うのに
ライブラリを使ってシンプルにするなど許さん！
ライブラリの分まで含めるのが公平だ！なんて言ってるのか？
どんだけ複雑すれば気が済むんだろうか

**Name_Not_Found** · 2017/12/09(土) 03:09:49.01

そもそも複雑度ってファイルごと、クラスごと、関数毎に出すものだから
例えライブラリが複雑だとしても、

・使ってるライブラリが複雑です
・それはそれとしてあなたの書いたコードはシンプルです

という結果になるだけの話なんだけどね

対するは、

・ライブラリは使ってません
・それはそれとしてあなたの書いたコードは複雑です

となるだけの話

**Name_Not_Found** · 2017/12/09(土) 09:12:58.40

> 自分の書くコードをシンプルにするためにライブラリを使うのに
そう思っているのはあんただけ
意味も分からずに http://jsmeter.info/ を使っているから、ライブラリを使うためのツールぐらいにしか思えないんだろうな

**Name_Not_Found** · 2017/12/09(土) 10:16:41.91

>>182
それで何が言いたいのさ？
否定だけして、お前の意見が何も書いてないぞ

**Name_Not_Found** · 2017/12/10(日) 03:05:54.10

プログラム板にも、荒らしが出てるぞ

元々、荒らしは、全部のスレで、いちゃもんを付けてくる。
漏れも、何回も攻撃されてる

プログラミングの話は、一切できないくせに、批判ばっかり書いてるのが荒らし

ただ、Ruby, JavaScript のスレでは、
荒らしにかまうから、喜んで居着いてるだけ

荒らしは一切、無視すべし！

**Name_Not_Found** · 2017/12/10(日) 14:47:13.97

sortを使えばいいと思う
こんな感じで

let fruits = [ 'みかん', 'りんご', 'みかん', 'みかん', 'ばなな', 'りんご', 'りんご', ]

let map = new Map
for(let f of fruits) map.set(f, (map.get(f)|0)+1 )
let [[max]] = [...map].sort( ([,a],[,b])=>b-a )

**Name_Not_Found** · 2017/12/10(日) 15:18:23.37

>>185
最大を複数取得したい場合は？

**Name_Not_Found** · 2017/12/10(日) 16:09:19.03

誰が複数取得したいなんていったんだ？

**Name_Not_Found** · 2017/12/10(日) 16:19:48.14

>>166が言ってるけど？

**Name_Not_Found** · 2017/12/10(日) 16:20:04.59

>>186の間違い

**Name_Not_Found** · 2017/12/10(日) 17:45:40.53

>>186
あれに付け加えてもいいけど
別のやり方でもうちょっと汎用的な処理を書くとして例えばこういうのはどう？

let fruits = [ 'みかん', 'りんご', 'みかん', 'みかん', 'ばなな', 'りんご', 'りんご', ]

let ary = [] // 個数毎にグループ分けした配列を作る
fruits.sort().reduce( (c,f,i,a,n=c|0) => (f==a[i+1]) ? n+1 : (ary[n] = [f,...ary[n]||[]]), 0 )

ary[0] // ["ばなな"] => 個数1
ary[1] // undefined => 個数2
ary[ary.length-1] // ["りんご", "みかん"] => 最大個数

**Name_Not_Found** · 2017/12/10(日) 20:34:15.96

コードゴルフってやつだね

**Name_Not_Found** · 2017/12/10(日) 20:43:06.10

>>190くらいなら同時に把握しない要素数が１０も無いから
プログラマのワーキングメモリに乗るという意味で普通のコードの範疇だと思う

**Name_Not_Found** · 2017/12/10(日) 20:59:52.72

関数や命令を知っているという前提で、1行の処理を把握するのに
5秒以上かかるようなものは普通のコードではないと思う
コードは読むものであって、解析するものになってはいけない

**Name_Not_Found** · 2017/12/10(日) 22:45:15.56

場合による
行数が短く一つのブロックがスクロール無しに見れることも重要
つかそもそも読む必要はできるだけ少ないほうが良い
今回のような処理の場合ただ最大個数の要素を得るためだけに十行二十行かけるのは極めて愚策
そこからの処理が重要なんだから、普通は外部関数化する
あえてインラインで書くならできるだけ目につかないように短く書いたほうが良い
仮にもしそこに問題がありそうだということになれば、一行捨てて書き直しても良い程度のものだし

**Name_Not_Found** · 2017/12/10(日) 22:47:45.60

> つかそもそも読む必要はできるだけ少ないほうが良い

ということは、ライブラリを使って読むものを減らすのが正解なわけか

**Name_Not_Found** · 2017/12/10(日) 22:50:53.43

> fruits.sort().reduce( (c,f,i,a,n=c|0) => (f==a[i+1]) ? n+1 : (ary[n] = [f,...ary[n]||[]]), 0 )

このコードの読むもの = トークンはどれくらいあるのかざっくり数えてみた
（カッコは省略、連続する変数定義は一つにまとめた）

fruits
sort
reduce
c,f,i,a,n
=
c|0)
=> (
f==a[
i+1]
) ?
n+1
:
(ary[n] = [
f,...ary[n]
||[]
]), 0 )

全部で16個ぐらい
これぐらいの量を、ひとつづつ意味を考えながら
読んでいかないといけない

**153** · 2017/12/11(月) 01:05:24.91

>>170
にも書いた通り、Ruby でも調べたけど、
最大使用回数が複数ある場合、簡単には取得できない

最大使用回数を返す場合、1つしか返さない

strHash = {"a"=>2, "b"=>1, "c"=>2}

maxCount = strHash.values.max #=> 2
p strHash.select {|k, v| v == maxCount } #=> {"a"=>2, "c"=>2}

まず、Hash の全要素をなめて、最大使用回数を取得して、
その最大使用回数に一致するキーを、Hash の全要素をなめて取得する

同じHash を、2回走査してしまう。
一発で取得できないから、無駄を感じる

**Name_Not_Found** · 2017/12/11(月) 05:39:34.10

>>196
考え方が逆
そもそも一度限りのかき捨てのコードなんだから読む必要がない
問題があれば捨てればいいだけでその時に例えば>>174のような感じだと
４個も公開変数があるから結局一部を捨てたりということもしづらい
一部を修正しようと思えば結局全ての行とそのほかの部分の絡みを考えないといけない
これもワンラインで書くなり使わない変数を削って一つの塊にすべき
もしくは５行程度なら即時関数にしてスコープ限定してもいいけど
本当にデバッグを考えたら結局コメントだったりわかりやすさが足りない

逆に何度も使うんならライブラリ使ったり書いたりする
もし単関数で取れるライブラリがあればそれで良し
中途半端な気遣い（？）は一番無駄

**Name_Not_Found** · 2017/12/11(月) 05:43:08.85

> そもそも一度限りのかき捨てのコードなんだから読む必要がない

一度限りのかき捨てのコードなんて誰が決めたの？
あなたの思い込みですよね？

**Name_Not_Found** · 2017/12/11(月) 05:53:03.70

> 問題があれば捨てればいいだけでその時に例えば>>174のような感じだと
> ４個も公開変数があるから結局一部を捨てたりということもしづらい

公開変数ってなんや？
this.foo なんてのが公開変数やろ？
どうみても>>174はローカル変数や

一部を捨てたりってなんや？
全くもって意味不明だ

**Name_Not_Found** · 2017/12/11(月) 06:10:08.40

初心者です。
この本（http://amzn.asia/386grG8）を文中の課題をやりながら読み終わったので、
次はこちらの本（http://amzn.asia/cDn7CWG）に行こうと思っております。
この話を知人にしたところ、旧版（http://amzn.asia/cv1is9n）を持っているから貸してやろうか？と言われました。

同じ本ですが2010年の旧版です。
javaScriptの学習においてそこまで問題がなければ旧版を借りようかと思うのですが、
この界隈の技術の移り変わりは早いので本書も最新版を買うべきでしょうか？

**Name_Not_Found** · 2017/12/11(月) 08:39:09.19

初めてのJavaScript 第3版、オライリー、2017

この本は、ES6(2015)の本だけど、
プログラミングを数年以上やっていないと、難しくて読めない

初心者は、(ECMA Script)ES3, ES5, ES6 と順番に、やった方が良いかも

今のブラウザは、ES5だけど、
ES6ではクラス構文などもできて、極端に難しくなる