+ JavaScript の質問用スレッド vol.129 + [無断転載禁止]©2ch.net
レス数が950を超えています。1000を超えると書き込みができなくなります。
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-6のテンプレを読んだ上で質問してください。次スレは>>950が>>2のテンプレ案(本スレで改善案があれば考慮)を元に立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
・回答者同士のレスは原則禁止(>>6を参照)
・ライブラリの話題の投稿(>>6を参照)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/ サンプル用意しました
https://jsfiddle.net/ecmsjwLc/1/
「お名前」をダブルクリックして出るサジェストにマウスが乗ったとき
これをmouseoutから除外したい、です
よろしくお願いします >>883
この場合はmouseenter/mouseleaveの方が適切な気がするけど、
それは置いといて、
if (evt.relatedTarget) {
$(this).removeClass('hover');
}
とかすればいいんでないの？
サジェストにマウスが乗ったときの正確な仕様は知らんけど >>884
あざます
たぶんなんだけど
サジェストに乗った時は
幅100%の要素からwindowの外に出た時と同じ扱い
のような気がするんですよね、nullだし
documentの外の物というか
>>883のサンプルみたいに、サジェストに対して<div>が十分大きければ
座標判定で逃げることもできるんですが >>885
いわゆるビックプルダウン的なのを作った時に同じことあったわ
同じように、マウス座標で判断した var res="12:34:56".match(/(\d+)/g);
console.log(RegExp.$1);
console.log(RegExp.$2);
console.log(RegExp.$3);
としました。
結果は最初の一行に56が出て、あとの2行は空白。
期待するのは、
12
34
56
でした。
console.log(res);// ["12","34","56"]とすれば容易なのですが
例えば
<あ0>12</あ><あ0>34</あ><あ0>56</あ>
みたいなときにmatch(/<あ0>([\d]+)</あ>/g)すると
['<あ0>12</あ>','<あ0>34</あ>',<あ0>56</あ>]
となるので、あとで<あ0></あ>を切り取ってやるかのか、そもそもmatchじゃなくreplaceすればいいのか
こういう、マッチさせつつマッチした中の重要な一部分を取得したいとき、
普通はどう処理するのか知りたいですよろしくお願いします >>887
あとで切り取るかreplaceすれば良い 質問：
タッチパネルの座標を取得したいんだけどスクロールすると取得座標が合わない
誰か教えて
// var node = イベント（onTouchStart）を登録するHTML要素
// var e = タッチイベント
// var touch 結果を格納する
function onTouch(e){
var _t = e.changedTouches[0];
var _x = _t.pageX;
var _y = _t.pageY;
var rect = node.getBoundingClientRect() ;
var offset_x = rect.left + window.pageXOffset ;
var offset_y = rect.top + window.pageYOffset ;
touch.x = _x - offset_x;
touch.y = _y - offset_y;
} アドバイスお願いします。
定期的かつ頻繁にforで124000回実行
中の処理は特定文字が見つかり次第置き換え。
このような処理が4000〜5000件。
JavaScriptを使って少しでも速く処理させたいと考えています。
適切な方法や書き方教えてください。
お願いします。 >>887
var str = "12:34:56";
var re = /(\d+):(\d+):(\d+)/;
var ary = str.match(re);
console.log(ary);
正規表現 - MDN
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Regular_Expressions
正規表現なら、プログラム板の正規表現スレで、聞いた方が良いかも
>>890
速さでは遅延評価する、Lazy.js が速いらしいけど、
Lazy.js > Lo-Dash > Underscore
Lazy.js って使われているの？
version 0.4.2 だけど
Lo-Dash を使えば、ほぼすべての関数で、ネイティブと同等か、速い
.reduce: LoDash vs Underscore.js vs native
https://jsperf.com/reduce-lodash-vs-underscore-js-vs-native
Win10, IE11 でテストしたら、ネイティブの倍、速かった > 速さでは遅延評価する、Lazy.js が速いらしいけど、
http://itpro.nikkeibp.co.jp/article/COLUMN/20070403/267180/
> 遅延評価のほうが遅くなる場合
これ読めばわかるが遅延評価が速くなるのは
遅延評価に適した問題で実務でよく使われる
単純な例では遅くなる方が多いよ >>893
自己レス
Revision 4: published Igor Cescon de Moura on 2017-5-15
で実行したら、ネイティブの3倍速かった >>894
遅くなる場合でも、ほぼ同じぐらいだろ
ブラウザの実装の違いを、平均化するから、ライブラリを使って損はない。
または最初から、フレームワーク内で、Lo-Dash を使っている 何故早くしたいのかにもよるだろう
UXもといレンダリングに影響を与えるということなら
２倍早くできればいいというものでもないからな
そうじゃなくとも最速はSABを使ってのパラレル探索だ
本当はWASMでSIMD使いたいところだが >>897
そのSABとかWASMを使うのに便利なライブラリを
教えてください。 ばか！ そこが一番楽しいところだろ
つうかSAB使うのにライブラリは要らん
特に独立型の単純並列ならAtomicな処理も最小限で済むからね いやね、実験するだけならそれで良いかもしれないけど
実用するなら対応してないブラウザのサポートをどうするのか？って
問題があるんだよ。だからそれを抽象化して対応してない
ブラウザにはエミュレートするような機能があるライブラリが必要なわけ 実際にはフラットケイジング処理でフレンジは皆無なんだけどね ポリフィルライブラリでエミュレートしなくちゃって言うのは、今回のようなパフォーマンス問題の場合には合わないかな
だって今回提案してる機能は、それを使う方が要件が楽に、スマートに実現できると言う物じゃなくて、確実に面倒にはなるけどパフォーマンスが良くなると言うものなのだから、
そもそもそれが同パフォーマンスで広環境向けにエミュレート出来るんなら最初からそっちを使えば良いと言うことになる
どちらかと言えばエンハンスメントかフォールバック式に考えた方が良い
まあただSABの場合はABの移譲として実装しても良いことも多いと思うよ >>890
var i=0;
var max=str.lengths; //124000回
var keyword="キーワード";
for(i=0;i<max;i=i+1)
hit(i);
}
function hit(i){
if(str[i].indexOf(keyword,0)!=-1){
// 特定の文字列が含まれているので置き換え
}
} 遅くなりました890です。
>>903
こちらの方法で改善できました。
ありがとうございます。 ワロタ
関数挟まない方が若干早くなるんじゃないか？ 改善っていうかやり方すらわからなかったんだろうなぁ googleのコード短くするツール使うと
日本語が実体参照？数値参照？みたいなやつに置き換わるのですが
JavaScriptのコード中にそのまま日本語含めるのは好ましくないのでしょうか？ >>911
単純にコードを短くするだけでなく、圧縮時のサイズ等も考慮されるため
圧縮しやすいように全角文字を変換し省くことで、圧縮性を高めています
日本語文字列の使用が好ましくないという事はありません 全角文字を省いたって数値参照？になるから
増やしてから減らしてるだけじゃん。意味ないよ 国際化しないのなら、日本語のコメント・文字列を書いてもよい
ただし、変数名などには、日本語を使うな。
誰も日本語でテストしていないから、バグるかも
国際化対応では、文字列に、ID_何々と付けておいて、
別のファイルで、IDと日本語文字列を対応させる おはようございます
>>912-915
レスありがとうございます
特別に何か不都合があってそうしてるわけではないということですね
これで安心できます プログラム板のスレが落ちて荒らしが移ってきたって言いたいんじゃない
元からどっちにも居着いてたと思うけど >>917
質問スレッドなのにスレルールも守れない人が書き込みしてる スレルール
> ・質問への「答え」だけでなく「意見」を出しても良い。 909です。
>>917
>>890 例えばこの主に対して
読解力が無いまたは技術がない。もしくは簡単ではないと判断したから以下のようなレスをする。
>>891
>>892
それに対して>>903はソース例を回答する。
主から連絡があり解決されるが、
回答もしてない人達がケチをつけはじめる。
回答しているなら意見として良いことだと思うが今回はソース例を出したのが1名だけ。
はたからみるとスレを劣化させる悪質な人達だと思ってしまうといった葉梨です。
917さんと919さんはどう思われますか？ >>921
12400回ループを回すと重いどうにかならん？って質問に
12400回ループを回すコードを差し出してんだから
ネタじゃん そう?
俺は単純な判定に大袈裟な正規表現を使ってたり、
ループ内の処理に問題があったのならあの回答も良いものだと思ったけど
あと日本語変数は全く問題ないよ 何れにせよ主から解決された書き込みがあったのだから正解を導いたレスが正義なんだよな
俺も次回からはコードなり例なり出すようにしようかな 重いって言ってるんだから重いコードを出すか具体的にどう書いたのが書くべき
書かないなら ■禁止行為である「丸投げ質問」
正義を振りかざすな
質問者にとって正義かどうかとスレにとって正義かどうかは別だ わりとマジで書いたコード見せてくれるのが一番早いよなあ
書く方もJSを日本語に変換する手間もないし
脳内のJS→日本語インタプリタってよくバグるし
jsfeddleとかに貼ってくれるだけで十分なんだけどなあ 919だけど
>>921
以下の書き込みは一言余分な箇所がありスレの禁止行為に該当するとは思う。
>>905
>>906 禁止行為に該当したらなんだって言うんだ?
現在進行形で明らかに同一人物が荒らしを続けてるならまだしも 921です。
>>929
スレのルールを無視して荒らすような連中はスルーで良いんじゃないの？ﾜｯﾁｮｲもなければIDも非表示のスレなんだし・・
そのへんは929さんはどう思う？ ＿あいう＿＿かき＿＿＿＿さ＿＿AB＿＿＿
などの文字列１行があります。
＿は全角スペースまたはアンダーバーで数不特定。混在の可能性あり。
よって行の長さも不特定。（30文字までなど制限は加納）
＿で始まるとは限らず文字列で始まる場合や文字列で終わる場合もあり。
これを文字列はそのままで左右入替するにはどうしたらいいでしょうか？
＿＿＿AB＿＿さ＿＿＿＿かき＿＿あいう＿ 正規表現で全角のスペースorアンダーバーかそれ以外の単位で分けて配列に入れる
ひっくり返す >>934
"＿あいう＿＿かき＿＿＿＿さ＿＿AB＿＿＿ ".match(/[ ＿]+|[^ ＿]+/g).reverse().join('')
こうか jQueryで簡単にできなかったら
jQueryは正規表現置換もできない
クソライブラリってことだ jQueryはDOMライブラリだからという言い訳はするなよ
jQueryはどんなことにでも使える汎用ライブラリだって聞いた jQueryは何にでも使えるライブラリである（俺の定義）
もし何にでも使えると主張するライブラリが
それを満たさなければクソライブラリである（俺の定義）
故に俺の定義によればjQueryはクソライブラリである
反論したいなら、俺の定義が間違っていることを客観的に
指摘している情報をもってこいな >>937
[ ＿]と[^ ＿]をsplitで別の配列に入れてそれぞれreverseしてました
もっと簡単に書ける方法があるはずと感じながら・・・感謝です。 おいぃぃぃぃ！今の流れはjQueryを
馬鹿にする流れだろおよおぉぉ！！ jQuery原理主義者はSOHOスレに誘導させない方向で頼む 誰もいかないだろｗ
そんな負け組が集まってるようなスレ jquery原理主義者なんているんだ。jqueryってそんなにいいものなの？
正直つまみ食い的な使いかたしかしてないけど
DOMを直接操作するのと何が違うのかよくわかんない。 React使わされるくらいならjQuery原理主義と謗られても構わん！
と思うくらいにはjQuery好きかも・・・ JavaScriptがデフォルトで遅延評価になる日は来ますか？
現状配列をmapしてfilterして…みたいな使い方だとループを2度回すことになり無駄が多いのが不満です 遅延評価って過程を事前にコンパイルしてできるだけ実行時の過程の処理を省略できるから意味がある訳で
スクリプト言語で実行時にそれをやっても良くはならないよ >>953
そうなんですね
素直にfor文使います
ありがとうございました >>950
> DOMを直接操作するのと何が違うのかよくわかんない。
できることが同じなら短いほうが良いでしょ？
それは可読性やバグ混入率にもつながる
jQueryを使わないで書く方法を見ればわかる。
どれもjQueryの方が短くなってるからｗ jQuery原理主義者はいるぞ。
否定されるとゴキブリのごとくほいほいわいてくるw jQueryはajaxを簡易に使うためくらいにしか使わないな
素のJavaScriptで全部できるし、jQuery使うと無駄に動作が遅くなる >>960
だからメリットがわからないんじゃね？
jQueryは3.0でSlim版っていうのができたが
これはAjax部分を取り除いたもの。
jQuey的にはAjaxはおまけ部分でしか無く
それだけしかお前が使っていないというならば
jQueryを分かってない人がjQueryを批判している図式にしかならないよ Ajaxも素のJavaScriptでできると思いますがねぇ >>955
コードが短くなるって利点は
typeScript使いの俺にはあんまり響かないなぁ
IDEで補完しまくるからそもそもほとんど打ち込まずに構築できるし。
なら極力使わないでいいかなと。
正直reactと言うよりreduxがしんどくなってきてelmに逃げたくなる自分がいる
仕事があるんかなw それってTypeScriptを使ってないとだめだよね？ つまりtypeScriptを導入してないひとには
jQueryはメリットがあるってわけだな なんで抽象化の話が出てくるのかわからない。
関係ないだろ？ いや、関係あるというのなら
どういう風に関係あるのかを説明してくれれば良いんだが >>961
単にajaxだけは素のJavaScriptだとコード量の差が大きいから、その部分だけ簡易にしたいだけで、
他は素のJavaScriptで全然いいやってだけなんだが
jQueryの良さを分かってないというか、別にajaxもjQuery使わずに実装できるし、なくても困らない
なんだフルにjQuery使う実装に固執しないとだめなんだ jQuery原理主義ってなんだ？
jQuery至上主義ならわかるが >>969
現代日本語での「原理主義」は
ファンダメンタリズムのことではなくただのレッテル貼りに使われる蔑称なので
特に意味は気にしなくていいんだよ >>968
> なんだフルにjQuery使う実装に固執しないとだめなんだ
逆だろ？ jQueryを使わないことに固執してるだろ？
理由があってjQueryを使わないわけではなく
jQueryを使わないことが目的になってる
jQueryがDOMよりも使いやすい命令を提供しているのは事実。
それは昔も今も変わってない。
あとはjQueryを使うか、他のフレームワークを使うか
素のDOM APIだけで頑張るかはトレードオフの問題であって
使う理由がなくなったわけじゃないんだよ。
jQueryからDOM APIの置き換えは簡単なんだから
必要になるまではjQueryを使えばいいだろ
その方が簡単に記述できるんだから <!--reactみたいなコメントがずらーっと挿入されてるのはreactなの？ >>971
文盲？頭が悪いんだろうな
jQueryの利点や使いやすい部分は理解しているが、JavaScriptでそれは普通にできてるしjQueryかますと当たり前だけど素より重くなるから使わないって選択肢なんだが
なんでわざわざ自分にとってデメリットになる方法を使わないといけないんだ
メリットあるとこだけ使えばいいだけで、
DOM操作だって、処理さえ理解していれば結局やってる事は同じだろう
DOM扱うのにjQueryが必須とか考えてるんだったら、それはjQueryに振り回されてるバカだ > JavaScriptでそれは普通にできてるし
そりゃjQueryもJavaScriptなんだから
できるできない、可能不可能の話なら可能に決まってるだろｗ
そんなこと始めっからわかりきってるんだよｗ
で、お前、jQueryのメリット書けないの？
やっぱり分かってないじゃん。
あぁ、あれだ。お前、歩いていくのも自動車で行くのも
どっちも目的地にたどり着けるから同じだって
考えてるやつだｗ jqueryってもともとブラウザ間の互換性確保のためのものなんでしょ？
今でも互換性がないDOM操作ってあるの？ >>975
今でもIE8からEdgeまでがメンテ対象なんですよ。 ふふふ
いっそ殺してくれとも思いますよ、ええ > jqueryってもともとブラウザ間の互換性確保のためのものなんでしょ？
違う。jQueryのメリットはそこじゃない。
だからさ、自分で間違って理解しておいて
その間違った自分の理解が間違ってるって
まるで自分で自分の間違いを指摘するような行為ってなんなの？ jQueryのメリットは、
脱jQueryの記事みればわかるよ。
jQueryを使わないことで
コードが2〜3倍に膨れ上がってる jQueryは簡潔に短いコードを書くことを目的としてるんでしょ
開発者によって面倒だったりポリシーであえてレガシーサポート切ったり様々だけど
ブラウザ間の差を吸収するってのはユーザビリティを過度に考慮した開発者の嗜みみたいなもんだ
つまりクロスプラットフォームなんてのはJavaScriptライブラリ全般に言えるっちゅうこと
んまあいくら簡潔っていってもメソッドチェーン多用しすぎ自由度高すぎで
人様の書いたjQueryのコードはあんま読みたくない > メソッドチェーン多用しすぎ
それは疑問がある。
メソッドチェーンができることは正しいがメソッドチェーンを多用することはないだろう？
それはjQueryの使い方を知らないだけではないか？
例えば、メソッドチェーンを使わずに3つのCSSプロパティを適用できる
http://js.studio-kingdom.com/jquery/css/css
$('div').css({
'background-color' : '#ddd',
'font-weight' : '',
'color' : 'rgb(0,40,244)'
});
例えば、メソッドチェーンを使わずに３つのイベントを適用できる
http://js.studio-kingdom.com/jquery/events/on
$("div.test").on({
click: function(){
//クリック処理
$(this).toggleClass("active");
},
mouseenter: function(){
//マウスが要素上に入った時の処理
$(this).addClass("inside");
},
mouseleave: function(){
//マウスが要素上から離れた時の処理
$(this).removeClass("inside");
}
}); 例えばDOM要素を生成する時にメソッドチェーンを使わずに
一気に属性やテキストやイベントを指定できる。
http://api.jquery.com/jquery/#jQuery-html-attributes
$( "<div/>", {
"class": "test",
text: "Click me!",
click: function() {
$( this ).toggleClass( "test" );
}
})
.appendTo( "body" ); レス数が950を超えています。1000を超えると書き込みができなくなります。
