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

[表示 : 全て最新50 1-99 101- 201- 301- 401- 501- 601- 701- 801- 901- 1001- 2ch.scのread.cgiへ]
Update time : 11/03 15:03 / Filesize : 323 KB / Number-of Response : 1014
[このスレッドの書き込みを削除する]
[＋板最近立ったスレ＆熱いスレ一覧 : ＋板最近立ったスレ／記者別一覧] [類似スレッド一覧]


↑キャッシュ検索、類似スレ動作を修正しました、ご迷惑をお掛けしました

1 名前：デフォルトの名無しさん [2016/03/09(水) 00:58:36.45 ID:S0itb4sM.net]: JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-5のテンプレを読んだ上で質問してください。

■質問を書く上で
(1) 煽り、コード制作依頼等、人を不快にさせる投稿はご遠慮下さい。公序良俗を守った応対を心がけてください。
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
　　(ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 質問者及び議論を行う人はメール欄を空欄にし、名前にレス番を入れることを強く推奨します。回答者はなりすましを判断できませんので、なりすましが現れても自己責任となります。
(4) 常に自発的に調べる心構えを持ってください。
　　具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
　　わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
　　※必ず「問題の事象が再現されること」を確認してください。
　　　必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。>>2の質問テンプレートを活用してみてください。
(9) ライブラリ関連の質問は禁止です。関連スレにあるライブラリ質問スレで質問して下さい。
(10) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。
655 名前：デフォルトの名無しさん mailto:sage [2016/05/10(火) 23:40:05.80 ID:WbwZXmAZ.net]: >>645
何を言ってんだか
jQueryみたいなライブラリで短くなるのは当たり前でしょ
むしろそうじゃなければ存在意義が全く無い
そしてコードが短くなることと面倒でなくなることは繋がっていない
例えば他人が書いたコードを読むのであればjQueryの方が「面倒」だろうよ
656 名前：デフォルトの名無しさん mailto:sage [2016/05/10(火) 23:48:31.48 ID:yLtf5w/x.net]: >>648
読む量も減るから楽になるよ。

面倒に対するアプローチには二通りある。

一つは勉強するのが面倒だからと勉強を避ける。
一見楽なように見えるが、知識がないからもっと楽な道を選べずにひたすら
単純作業を繰り返すことになる。勉強する面倒さを避けたがために面倒になる。

もう一つは勉強する面倒さを受け入れることで、もっと効率のいい方法に到達する。
急がば回れの言葉通り。最初に勉強という面倒なことをやることで、
その後ずっと楽になる。
657 名前：デフォルトの名無しさん mailto:sage [2016/05/10(火) 23:57:03.18 ID:uAV2Alwm.net]: なぜコード量が大幅に減るか
それは本来モジュール化すべき重複したコードが大量にあるからなんだな
例えば100箇所に同じようなコードがありjQueryでそれを削減したとしよう
しかしちゃんとしたプログラマは1箇所に処理を纏めて再利用して重複を減らすだろう
この場合jQueryで削減できるコードは先の場合の1/100でしかない
しっかりしたコードを書くほどjQueryの恩恵は小さくなるのだ
658 名前：デフォルトの名無しさん mailto:sage [2016/05/10(火) 23:58:28.27 ID:yLtf5w/x.net]: 誰かが「面倒」といったとき、勉強するのが面倒と言ってるのか、
その後の作業が面倒と言ってるのかを見極めないといけないね。

どんなことでも作業を楽にするには、勉強する面倒さを
乗り越えないといけない。勉強して知識と技術がつけば作業は楽になる。

自動車の運転しかり、パソコンに使い方しかり、数学の公式しかり
作業ではなくて、勉強するのが面倒と言っているやつは、
そこまでのやつってことだよ。
659 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 00:00:25.17 ID:ye4EAN+q.net]: >>650
そのしっかりしたコードが、jQueryを使った場合と
使わない場合で、倍のコード量になってくるんだよ。

これ以上は絞り込めないといったコードで比較した話なんだから。
660 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 00:01:12.32 ID:ye4EAN+q.net]: ato
jQueryで楽々削減するのと、
しっかりと書かないと減らせないのとでは
面倒さも違ってくるだろｗ
661 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 00:43:36.75 ID:wiJHIT3v.net]: >>652
短く書きたいのなら別にjQueryでなく様々なものがある
jQueryは互換性を保つという点が薄れてきた今となっては極めて中途半端な存在
ちょっとしたことなら、わざわざ何かを導入しなくとも昔より発展した標準APIを使えばいいし、
それ以上のことでDOM操作を頻繁にするなら仮想DOM系の方がパフォーマンス的にも良い
それ以上ならフレームワークを使う

いずれにしろjQueryのパターンは古臭く、今ちょっとした味付けが欲しい場合は
Observableパターンと標準APIを使ったほうが良い
662 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 01:29:13.56 ID:ye4EAN+q.net]: >>654
たかだかHTMLにちょっと動きをつければいい所に
AngularとかReactとか持ち出すのは過剰。

jQuery程度がちょうどいいんだよ。
標準APIが発展？冗長なのは変わってないだろ。

jQueryを使えばDOM APIよりも短くなるのは明らか。
比較一覧で証明された。

短くシンプルに書くのが目的であって
道具を導入するのが目的ではない。
663 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 01:30:48.00 ID:x+4ifnQN.net]: 短く書ける事が即作業能率に繋がるわけじゃないんだけどな

document.getElementById('hoge')
$('#hoge')

確かにDOMの方が3倍長いけど、コード補完を使うから入力速度は大して変わらんね
664 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 01:41:26.30 ID:mC1n68eU.net]: >>655
jQueryはプログラミングに詳しくない人が本体とプラグインを使って
コピペ＋αでそれなりのものを作るためのもの。

少しコードが多くなるとデバッグも適切な設定をしないと困難だし、
短くシンプルに書くためのものなんてのは誤った危険な認識だよ。

そしてjQueryは実際はそれ自体が目的で使われてる。
便利だからではなく、便利と思って使ってきたから、また使うとなってるだけ。
その無意味なスパイラルから抜け出さないと何時までも停滞したままだよ。
665 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 01:53:32.30 ID:mC1n68eU.net]: 確かにDOMを平に見て弄りまくる場合にはjQueryは適してると言えるが
そんなに弄りまくる場合にはVirtualDOMを使うのが最近の流儀でメリットも沢山あるし
できればそもそもそんなことはしないで各種モジュール化するというのがより良い解決策

そしてモジュール化するとなったら特にjQueryのような平に影響を与えるライブラリは邪魔になり
必然的に標準仕様と、時期が来ればいつでも外せる少量のポリフィルを使うことになり
それが嫌なら全てをまとめて抽象化してくれるフレームワークの出番になる

jQueryはDHTMLだとかそういう時代には合ってたが、今jQueryが生まれた背景事は殆ど解決し
より良い解決策がたくさんあるのにあえてその古くて悪いスタイルを推すことは無いだろう
666 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 02:08:46.99 ID:z7XWs6Or.net]: >>5を読んだら次からスルーしてね
667 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 06:05:18.26 ID:qJ1gI9ow.net]: こいつが当人なんだから言うこと聞くわけないじゃん
668 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 06:05:43.37 ID:T3iqLJ21.net]: javascriptは流行の移り変わりが激し過ぎて、現在の最善手が1年後の時代遅れになりそう
触る人全員が最新技術を追いかけられればいいけど、それが無理なら枯れていて情報量が多く、あんまりわからん人でも気合で押し切れるjQueryは有用に感じる
669 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 06:48:45.94 ID:udOmff2f.net]: jQueryで削減できるのは末端のコーディングコストでしかない
重要なポイントは設計のコストでありjQueryにはこのコストを削減する力はない
むしろ全体の工数を削られたことによって設計が疎かになる可能性の方が恐い
670 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 07:06:15.34 ID:XhqmdNgU.net]: jQueryの悪さってもっと別のところにあると思う
EWMに沿ってライブラリが標準と共闘して活躍するのが理想だけど
jQueryは完全に自分の世界を築いちゃって相容れないこと
まあこの先の進化で自ずとそうなっていくだろうけど今はまだデファクトとして認められないね
671 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 07:15:59.11 ID:XhqmdNgU.net]: >>661
ブラウザのアップデートが一月半毎なことを考えると、時代遅れになるのは３ヶ月くらいのスパンだと思う
とは言えここ１年はESのアップデートが中心で、WebAPIはマイナーな調整が殆ど
来年以降HoudiniとかEWMに沿う低レベルの仕様がまたどんどん出てくると思う
672 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 08:16:21.66 ID:7o2M3lBg.net]: IE11 しかサポートしなくていい人は気楽だのう。
673 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 08:31:45.67 ID:47ZN8m01.net]: IE11以上サポートなんて半端なことよほどじゃないとしないでしょ？
Edge以上か、IE9以上か、プログレッシブエンハンスメントにして機能で篩い分けるか
の３択で今行ってる
674 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 09:08:23.44 ID:ye4EAN+q.net]: >>657
> jQueryはプログラミングに詳しくない人が本体とプラグインを使って
> コピペ＋αでそれなりのものを作るためのもの。

という勘違いをしている人が、jQueryを悪く言ってるんだよねｗ
675 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 09:09:01.34 ID:ye4EAN+q.net]: >>663

Angularの悪さってもっと別のところにあると思う
EWMに沿ってライブラリが標準と共闘して活躍するのが理想だけど
Angularは完全に自分の世界を築いちゃって相容れないこと

好きな言葉に置き換えればいいよｗ
676 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 09:09:58.99 ID:ye4EAN+q.net]: >>658
> 確かにDOMを平に見て弄りまくる場合にはjQueryは適してると言えるが
> そんなに弄りまくる場合にはVirtualDOMを使うのが最近の流儀でメリットも沢山あるし

手段と目的が逆になってるｗ

VirtualDOMをいじらなくていいような簡単な所を
わざわざ複雑にするなや
677 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 09:47:54.59 ID:LV2XLOSJ.net]: 一般的な記述でjQueryを使用して書けばソースが約半分になるは事実だ
どうして屁理屈をこねて反論するのだろうか?
jQueryを使用しているとJavaScriptを本質的に理解していないと
自己解釈しているだけだろｗ
678 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 10:17:41.47 ID:x+4ifnQN.net]: Virtual DOMはDOMが遅いから生まれたのであって独自の世界になるのは当然
AngularJSはMVC設計を取り入れているからMVCをやりたい時に使う
「では、jQueryは何をしたいが為に使うのか」という話だよな
記述量が半分になるメリットだけではjQueryの世界に没入するデメリットを相殺しきれない
679 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 11:00:32.08 ID:kvpM6w4K.net]: >>644
1はなんとかできたけど
2がわからない…
680 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 11:27:16.56 ID:x+4ifnQN.net]: >>672
どこがわからないのかわからんけど、form.elements['inputName'] で各要素を参照できる
681 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 15:35:23.12 ID:m6oW+Aes.net]: ここでjqueryに執着している奴は他の言語をあまり知らないんだろうな。jqueryなんてjsやる時に使えば便利という程度だろ。
c++とかc#とかもやるといいよ。
682 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 15:38:05.91 ID:S3kH2EJT.net]: 忙しい調理場で「ハサミで切ったほうが丁寧に切れますよ」とか言ってくるやつがいたら
「さっさといつも通り包丁で切れよ」って思うだろうな
もちろんjqueryが包丁な
683 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 15:45:03.20 ID:LV2XLOSJ.net]: もうやめようよ
馬鹿と何とかは使いようっていうしなｗ
684 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 18:02:34.45 ID:716xjHj3.net]: >>668
それは機能の寄せ集めである典型的なライブラリであるjQueryにこそ最も強く言えることであって、
AngularJSは別物だよ
685 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 20:35:53.97 ID:xrNZw1On.net]: >>671
Virtual DOMはテストがやりやすくなるし
標準の代わりとしてまだ分かる
jQueryはむしろテストがしにくくなる
ただの餓鬼の玩具
686 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 20:42:34.87 ID:w9XqkPaB.net]: お前らの価値観とかどうでもええわ
687 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 22:00:50.15 ID:ye4EAN+q.net]: >>671
> jQueryの世界に没入するデメリットを相殺しきれない

デメリットって勉強するのが面倒くさいって話？

それって、その人自体のデメリットだよね。
勉強が嫌いな人に仕事を任せるのはデメリットｗ
688 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 22:06:23.24 ID:ye4EAN+q.net]: >>678
同じ理屈で

Virtual DOMはテストがやりやすくなるし
標準の代わりとしてまだ分かる
DOM APIはむしろテストがしにくくなる
ただの餓鬼の玩具

といえるんだよｗ

DOM APIとjQueryならば、jQueryを使ったほうがいい。
689 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 22:08:36.24 ID:S3kH2EJT.net]: すぐに廃れるものは勉強めんどいのわかるが
jqueryは勉強しといて損はないだろ
つーか勉強ってほどでもない
JS知ってりゃ1日で慣れる
690 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 22:08:53.06 ID:ye4EAN+q.net]: >>677
> それは機能の寄せ集めである典型的なライブラリであるjQuery

何を言ってるんだ？

jQueryはDOM APIの置き換えであって、
お前が言ってるのは（野良）jQueryプラグインの話だろ？

jQueryはオブジェクト指向型のDOM APIを関数型のプログラミングが
できるように置き換えるライブラリだよ。
（※ブラウザ間の互換性を吸収するライブラリではない）
691 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 23:12:52.71 ID:O2+YRvW5.net]: scって>>レス番にマウスポインタ持っていくと、返信先のレスが表示されますよね？
あれってどういう仕組みでしょうか？
ツールチップではないみたいですが
692 名前：デフォルトの名無しさん mailto:sage [2016/05/11(水) 23:42:07.24 ID:IeznZ4jj.net]: まぁ、DOM操作をするか、何かにバインドするか、毎回一定範囲ごともらうかは思想次第だからなぁ。
書こうと思えば、jQueryだけでSPA書けるだろうし、その時にDOM足したり消したり細かくするか、innerHTMLごとサーバから貰うかも思想だし。
俺はinnerHTMLを毎度やりとりしてた派だから、今のreactの流れは当然の結果に落ち着いたとも思うし、
逆にクライアントサイドで何もかも済ませて、restfulなapi呼び出ししかしない、その上でクライアントサイドの状態と表示が不一致になるのを避けたり、コンポーネントとして再定義するという意味ではvue.jsは好き。

angularは収集つかなくなってる感が凄く嫌だな。
693 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 00:54:32.46 ID:8vh2YrlZ.net]: >>682
適材適所が出来ない無能だからこそ
何かと理由を付けてキャパシティの低さをカバーするのよ
694 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 01:36:10.90 ID:WDa8o6L5.net]: jQueryの勉強がめんどいって誰も主張してなかったと思うけど、何かと理由をつけて反論したいのね
695 名前：デフォルトの名無しさん [2016/05/12(木) 01:59:28.76 ID:9Y0usIRW.net]: jqueryをちょっと練習してます。

サイトを見たんですが、なぜクロージャで実行するのでしょうか？
function内だけを実行しても同じ挙動に見えます。

$(function(){
$("#text1").css('color','red');
});

$にfunctionを渡すとどうなるのでしょうか？
696 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 02:36:00.78 ID:WDa8o6L5.net]: >>688
下記コードとほぼ等価
document.addEventListener('DOMContentLoaded', function () {
$("#text1").css('color','red');
}.bind(this, jQuery), false);
697 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 02:39:56.36 ID:Xc9f48N7.net]: やっぱりjQueryを使わないと長くなるなｗ
698 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 02:43:56.98 ID:Xc9f48N7.net]: >>685
Reactは高品質な（準）標準UIコンポーネントが作られれば普及すると思うよ。

そういう世の中になったら、jQueryを嫌がるのと同じように
○○コンポーネントは使うな自作しろとか言うやつが出てきそうだけどｗ

で、UIコンポーネントが出来た後は、ウェブアプリをポトペタで作れるようになって、
そしてUIコンポーネント同士を連携させるのにjQueryがやっぱり便利じゃね？って
言われるようになる。
699 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 08:01:45.83 ID:RFqkT9TF.net]: >>691
標準コンポーネント要らなくない？reactなら。
ポトペタでコンポーネントを置いて、結局コンポーネント間の操作をjQueryでやるのはまず破綻すると思うが。
良きひとつの別解としてでもDOMから離れて行くと思うよ。
操作したいのはDOMではなく、コンポーネントだからね。
今までは、DOM≒コンポーネントだっただけで。
700 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 08:12:03.13 ID:ffZfaRCN.net]: jQuery以外を知らず井の中の蛙となってる奴に何言っても無駄。
皆が新設でこれだけ教えてあげようとしてるのにムキになるだけだしどうしようもないクズだね。
701 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:11:36.25 ID:VZ0ffw6x.net]: 蛙に失礼だろ
702 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:16:41.78 ID:6wLBo9DQ.net]: とりあえず今からjs始めようとするのにjQueryを触るのはなしだってことだよね。
703 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:29:20.27 ID:pPHDojvh.net]: 「JS」を始めようとするのには無し
でもWebデザイン中心の入門としては学習資産があるからね
704 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:30:41.67 ID:Xc9f48N7.net]: >>695
DOM APIを触らないのであればそのとおりだけど。
DOM APIを沢山触るのであれば、
それをjQueryに置き換えると遥かに効率が上がる。
705 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:37:11.92 ID:cWhHAzov.net]: そりゃJavaを始めるのに面倒だからScalaで書いて呼び出すみたいなもの
いつかは触らないといけないのなら最初からDOMを勉強した方がいい
この先月に１回未満くらいしかJSをに触れる必要が無いのなら選択肢としてあり得る
706 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 09:52:19.65 ID:lQiQw1tJ.net]: 必要なら$(elem)[0]を参照すれば済む
707 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 10:09:14.52 ID:cWhHAzov.net]: id振ってりゃその名前で直にアクセスできるけどね
708 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 10:15:36.21 ID:RFqkT9TF.net]: ID振るとか正気かわからん。
ページで、一意にしなきゃならんのだぞ。
「コントロールの中に幾つかのコントロールがある」コントロールを幾つか置いたらもう考えるのが面倒くさいし、状態変数(サーバで持ってるかクライアントで持ってるかに関わらず)との乖離が酷くなっていくじゃん。
709 名前：デフォルトの名無しさん [2016/05/12(木) 10:30:08.78 ID:cWhHAzov.net]: それこそjQueryで扱う状況じゃないな
別にjQueryは抽象的だとか相対的な関係を扱うのに長けてるわけでもなく、
ただ「短く書ける」程度のものなのだから、
標準DOM APIで困難でフレームワークを使うような必要性が有るときは
それはjQueryにだって不向きな場面であるのは自明

jQueryの様々な付加価値、AnimationとかFetchとかPromiseも時代遅れの仕様だし
最早document.querySelectorAllを$と短く書ける以上のシロモノじゃない
いかに中途半端で役に立たないシロモノか分かったね？
710 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 10:33:36.37 ID:gnZrQsyk.net]: >>701
jQueryだって平に見て何かをする以上のことはできない。
ShadowDOMとか使ってコンポーネント化したり高度なこととは折り合いがつかない。
711 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 12:22:57.19 ID:8PwOpBF8.net]: だから相手すんなっての
lodashの啓蒙（）で延々と荒らされた状態から何も進歩してねえ
712 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 12:49:57.46 ID:RFqkT9TF.net]: >>703
だから、jQueryでID指定でどうのとか、DOMapiでとかそういう発想じゃなくて、
ちゃんとコンポーネントとして考えようねって話だよ。
713 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 13:39:59.81 ID:zeyNygYO.net]: enchant.js 用のマップエディタを、jQuery UI で作って、公開している人がいる

jQueryは、ちょっとしたアプリにはいい。
こんなのDOMでは、面倒くさくて作れない
714 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 14:33:59.41 ID:QFbK3hrX.net]: jQuery MobileとjQuery UIはjQueryとは別物
一緒に語るな
715 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 16:19:45.56 ID:iX4T91tZ.net]: SPAを作るのに、SPA用FWを使いたいのですが、JQUIも使いたいです
組み合わせて使うのは、可能でしょうか？また、一般的な方法でしょうか？
716 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 16:46:03.41 ID:RFqkT9TF.net]: >>708
SPA用フレームワークが何かによる
717 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 16:56:38.45 ID:iX4T91tZ.net]: >>709
迷っているところです
VuaやAngular2などがあるみたいですが、おすすめはありますか？
718 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 16:59:58.81 ID:3OjnTRaH.net]: >>708
spaって何よ？
719 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 17:03:19.84 ID:iX4T91tZ.net]: >>711
シングルページアプリケーション
720 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 17:37:38.25 ID:RFqkT9TF.net]: >>710
vue.js使ってるけど、今までで一番感動した。
今はjQuery一切使ってないよ。
viewとモデルに専念してくれるから、あんまりお作法とか無いし。
721 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 17:46:16.47 ID:iX4T91tZ.net]: >>713
Angular2は複雑みたいですね
vue.jsの方が覚えやすいですかね？
722 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 17:49:42.18 ID:aiv+0stS.net]: >>693
jQueryは三下のやるゴッコだから許してやれ
723 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 18:23:11.34 ID:gjMSeNc+.net]: >>714
ライブラリ(フレームワーク)の選び方

コミュニティの大きい方
rc版とか論外
vueもag2も無い
724 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 18:42:57.19 ID:iX4T91tZ.net]: >>716
バインド以外使いたい機能特にないんですが、vueじゃ駄目ですかね？
UIはJQUIで作る予定ですが
725 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 19:53:00.09 ID:RFqkT9TF.net]: >>714
覚えやすいよ。

>>716
もうstable何度も出てるよ。トップページのボタン見て思ったんだろうけど。
コミュニティは大きいに越したことは無いけど。

>>717
UIは何でjQuery UI使うの？
アニメーションとかの為なら、vueでも出来るよ。
それこそバインドしておけば勝手に。
726 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 20:08:26.12 ID:BZDGS6so.net]: 非同期な関数A、B、Cがあったとして

Aを実行、callbackでエラーと結果を受け取る
　　エラーなら終了
　　Aの結果がまずけりゃBを実行、cal（ｒｙ
　　　　エラーなら終了
　　　　その後Cを実行
　　Aの結果がまずくなけりゃそのままCを実行

なんて流れで書きたいときCを実行するコード2回書かなきゃいかんの
それとも超クールな書き方あるの
727 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 20:09:48.05 ID:iX4T91tZ.net]: >>718
タブとダイアログを使いんですが、自分で実装出来ますかね？
728 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 20:58:00.22 ID:bBgG4/I/.net]: idすら一意に管理できないようなのはエンジニアやめたほうがいい
729 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 21:03:34.87 ID:RFqkT9TF.net]: >>720
タブは瞬殺。
チェックボックスの状態と、タブページのdisplayをバインドするだけ。
チェックボックスはcssでタブ耳みたいにしておく。
(チェックボックス自体は見えなくして、label forにスタイル当てるととても楽)
ダイアログもほぼ瞬殺。ダイアログの中身はslotで書いとけばいい。
背景を暗くするためのdivと、その上に置くdivのdisplayを、ダイアログメッセージ!=""にバインドしとけば、
ダイアログメッセージに文字列入れるだけ。
730 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 21:09:40.37 ID:8TSCgVOi.net]: >>719
超クールに書けますよ。そうJQueryならね
731 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 21:19:35.09 ID:BZDGS6so.net]: >>723
いやマジで
ぜんっぜんわかんねえ
promiseも細かい分岐書こうとしたらなんかresolve地獄になった
732 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 21:26:53.32 ID:hY0jzmnf.net]: >>711
まだこんなのがいるんだな
733 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:06:37.95 ID:5wVtNAV4.net]: インスタント麺だろ
知ってるよ
734 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:33:10.83 ID:RFqkT9TF.net]: p=new Promise(function(res,rej){res()});

p.then(a).
.catch(b)
.then(c)
.then(/*全部終わった*/)
.catch(/*cで死んだ*/)

ではいかん理由があるのだろうか。
735 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:34:03.31 ID:lH3ZGyQp.net]: たらこがない
736 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:34:57.59 ID:Xc9f48N7.net]: >>705
> ちゃんとコンポーネントとして考えようねって話だよ。
いやコンポーネント作ったからってそれで完結するわけじゃなくて、
コンポーネントとコンポーネントを繋ぐものが必要だろ？
そこにjQueryを使うんだよ。

>>713
> vue.js使ってるけど、今までで一番感動した。
> 今はjQuery一切使ってないよ。
DOM APIは使ってるかい？使ってないだろう？

そういうこと。そのタイプのフレームワークを使うことでDOM APIを使わずに
ウェブアプリを作ることは出来る。むしろDOM APIを直接触ってはいけない。
jQueryを使ってないっていうのは、jQueryはDOM APIを置き換えるだけだから、
DOM APIを使わないならば、必然的にjQueryも使わないだけ。
そしてこのフレームワークを覚えるのはjQueryよりも大変で単純なウェブサイトでは
大掛かりすぎて使うほうがコストがかかる。

整理するとjQueryの代わりに（もっとコストがかかる）フレームワークを使ったら
jQueryもDOM APIも使わないでいいということ。
フレームワークがいらない場面ではjQueryを使うのが良い。DOM APIは出番なしｗ
737 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:36:45.62 ID:Xc9f48N7.net]: >>725
> まだこんなのがいるんだな
そりゃそうだろｗ

例えばWordPressのようなブログサイトをSPAで作るとかありえない。
用途で使うものは変わってくるんだよ。

ネイティブアプリのようなウェアプリを作るならば、フレームワーク（DOM APIは使わない）
ブログのようなウェブサイトを作るならば、jQuery（DOM APIは使わない）
738 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:38:32.41 ID:Xc9f48N7.net]: >>723
> 超クールに書けますよ。そうJQueryならね

言葉が足りない。

超クールに書けますよ。そうJQueryならね。
なぜなら、Promiseに近い仕様のDeferredを持っているから。
そしてjQuery 3.0からはDeferredはPromiseと互換性があるものになる。
739 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:39:13.51 ID:HUbJz6nz.net]: カルボナーラもないじゃないじゃないか
740 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:39:52.59 ID:GBRI772U.net]: ありえなくは無いだろ
モバイルサイトでは一時期流行ったし
741 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:41:31.51 ID:46WAWDCU.net]: >>729
気でも狂ってるのか、文盲なのか。
明示的にDOMを触るんじゃなくて、DOMのいじりはフレームワークに任せるんだよ。

お前もしかして、jQueryしか知らないんじゃないか？
742 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:41:59.44 ID:Xc9f48N7.net]: >>722
> タブは瞬殺。
瞬殺と言うのなら、そのコードを書いたほうが楽じゃないのか？ｗ

ちなみにTwitter Bootstrapを使うって手もあるよ。
タブは瞬殺

<div id='ui-tab'>
　<ul class='nav nav-tabs'>
　　<li class="active"><a href="#apple">Apple</a></li>
　　<li><a href="#google">Google</a></li>
　　<li><a href="#classmethod">Classmethod</a></li>
　</ul>

　<div class='tab-contents'>
　　<div class="tab-content active">
　　　... apple 文章 ...
　　</div>
　　<div class="tab-content">
　　　... google 文章 ...
　　</div>
　　<div class="tab-content">
　　　... classmethod 文章 ...
　　</div>
　</div>
</div>
743 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:42:27.84 ID:46WAWDCU.net]: だいたいコンポーネントとコンポーネントを繋ぐものとかねえよ。
「コンポーネントとコンポーネントを内包した」コンポーネントでしかない。
744 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:44:09.19 ID:Xc9f48N7.net]: >>734
> 明示的にDOMを触るんじゃなくて、DOMのいじりはフレームワークに任せるんだよ。

明示的にDOMを触るんじゃなくて、DOMのいじりはjQueryに任せるんだよ。

だからこういうことだろ？

　　フレームワーク VS jQuery

DOM APIは（直接）使わない。（どちらも内部で使うのは当たり前）

あとは作るものが、開発コストが高いフレームワークを
導入するレベルものかどうかで、フレームワークか jQuery かを
選べば良い。
745 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:48:09.87 ID:46WAWDCU.net]: >>735
<input type=checkbox v-model="tab.state" v-for="tab in tabs" />
:
<div ..... v-for="tab in tabs" v-show="tab.state" >
{{tab.content}}
</div>
みたいな感じ。
746 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:49:25.89 ID:46WAWDCU.net]: >>737
そりゃ、明示的にDOMをいじってるんだよ。
vsじゃない。
ハサミとカッターナイフみたいなもん。
開発工数以外に、保守工数も考えて喋れよ…
747 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:50:04.64 ID:Xc9f48N7.net]: >>736
HTMLはそもそも文書を書くものなわけで。

例えば論文だと思えばいいよ。
第一章、第二章、第一節、第二節なんてがあるような。

そういう論文形式のウェブページをコンポーネントにするのがおかしい。
論文ページコンポーネントがあって、一章コンポーネントがあって
その中に一節コンポーネント、二節コンポーネントがあるとかやる気かねｗ

ネットはこのような論文やブログ形式のサイトが多いわけで
そういったページをSPAにしたりフレームワークを導入するのは
目的に対して使う道具が間違ってる。

そういうサイトにはフレームワークではなくjQueryが適している。
748 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:50:33.86 ID:46WAWDCU.net]: >>738
思いっきり間違えた。radioだな。
749 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:51:14.28 ID:Xc9f48N7.net]: >>739
> 開発工数以外に、保守工数も考えて喋れよ…

論文サイトの保守工数って何？
HTMLの修正がメインなんだけどｗ
750 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:53:36.72 ID:3OjnTRaH.net]: >>712
業界ではそう訳すのが普通なのか。
751 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:54:07.93 ID:46WAWDCU.net]: >>740
写真と、図のキャプションは、まとめて、「figure 1」だよな。
figureなんとかの塊と、文字と、グラフで出来たものが、節であり、節が集まり章になり、論文になるでしょ。
第二節コンポーネントとか筋悪すぎるだろ。さすがjQuery使いだとしか思えん。

節コンポーネント。
節コンポーネントの配列を持つものが、章コンポーネント。

お前アホだろ。
752 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:55:09.86 ID:3OjnTRaH.net]: >>719
cを関数で書けよ
753 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:56:13.29 ID:3OjnTRaH.net]: >>725
いるよ。何か？
754 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:56:21.38 ID:46WAWDCU.net]: >>742
htmlの修正というより、お前テンプレートエンジンすら使えないんじゃないのか？
一旦稼働したらそのへんはDBから取るだろ。常識的に考えて。

節コンポーネントとか出てくる時点で、手書きなんだろうな、その辺の処理がベタで。
755 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 22:58:50.06 ID:Xc9f48N7.net]: >>738
そんだけなわけないだろｗ　↓これでいいかい？

www.webopixel.net/javascript/1097.html
タブで切り替えるやつ。表示するデータは外部から持ってくるのを想定してタブ切り替え的なやつ。
<div id="app" v-cloak>
　　<ul>
　　　　<li v-for="tab in tabNav" @click="changeTab($index)">
　　　　　　{{ tab }}
　　　　</li>
　　</ul>
756 名前：　　<div>{{ tabBody }}</div> </div> <script> new Vue({ el: '#app', data: { tabNav: ['JavaScript', 'PHP', 'HTML'], contents: [ 'JavaScriptのコンテンツ', 'PHPのコンテンツ', 'HTMLのコンテンツ' ], tabBody: "" }, methods: { changeTab: function (index) { this.tabBody = this.contents[index]; } } }); </script> []: [ここ壊れてます]
757 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:00:29.80 ID:Xc9f48N7.net]: >>747
今保守工数の話だったよね？

保守するのはDBの中身？
DBから何を取るの？文書データ？
JavaScript関係ない話してるの？ｗ
758 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:03:22.74 ID:iX4T91tZ.net]: >>743
学生プログラマだから業界はよく分からん
759 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:05:07.78 ID:Xc9f48N7.net]: >>744
はぁ？俺は論文的なサイトにおいて、
コンポーネントはページの中の一部に入れるもので、
コンポーネントを内包している外側は、コンポーネントに
はならないって話をしてるんだが？

それなのに>>736が
> だいたいコンポーネントとコンポーネントを繋ぐものとかねえよ。
> 「コンポーネントとコンポーネントを内包した」コンポーネントでしかない。
とかいい出したんだろｗ

俺の話に流れを戻すと、コンポーネントとコンポーネントを繋ぐものが必要になる。
それがjQuery。
760 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:08:45.56 ID:46WAWDCU.net]: >>748
お前がjQuery脳だとよくわかったわ。
なぜ、状態を持たないliの、さらにクリックのイベントでそんなことするのかいよいよ頭おかしい。
キーボード操作したいって要件増えたらどうよ。

>>751
外側触らないきゃいかんのは、外側含めてコンポーネントだろ。
俺ならサーバサイドでレンダリングするわ。
に
761 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:09:13.47 ID:46WAWDCU.net]: 付き合いきれんわ。
762 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:12:24.76 ID:iX4T91tZ.net]: 結局どうすれば…
とりあえずJQ使わずに頑張ってみます
763 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:19:13.17 ID:Xc9f48N7.net]: >>752
> なぜ、状態を持たないliの、さらにクリックのイベントでそんなことするのかいよいよ頭おかしい。
俺はググってコピペしただけですーｗ
ついでにjQuery版
<div class="tab">
　　<ul>
　　　　<li><a href="#js">JavaScript</a></li>
　　　　<li><a href="#php">php</a></li>
　　　　<li><a href="#html">html</a></li>
　　</ul>
　　<div id="js">
　　　　JavaScriptのコンテンツ
　　</div>
　　<div id="php">
　　　　PHPのコンテンツ
　　</div>
　　<div id="html">
　　　　HTMLのコンテンツ
　　</div>
</div>
<script>
$(function() {
　$('.tab').on('click', 'a', function(event) {
$(event.delegateTarget).find('div').hide();
$(($(this).attr('href'))).show()
})
})
</script>
<style>
.tab li { display: inline }
.tab div { display: none; border: 1px solid black;}
</style>
764 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:20:20.56 ID:Xc9f48N7.net]: >>752
> 俺ならサーバサイドでレンダリングするわ。

なにを？コンポーネントを？
それともコンポーネントじゃないものを
外側にするの？ｗ
765 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:21:16.10 ID:BZDGS6so.net]: >>727
例が簡単すぎたかもしれないが

ていうかそれじゃ
Aが終わってからA結果NGならB、Bが終わってからCキックしなきゃいかんのに
BとCと非同期で並列に動いちゃわないか？
766 名前：デフォルトの名無しさん mailto:sage [2016/05/12(木) 23:49:27.30 ID:46WAWDCU.net]: jQueryでもDOMapiでもなんでも良いが、それこそ論文やなんやの文書構造を、無意味な汎用タブで破壊してるんだけどな。
コンポーネントでも、外側でも、必要に応じて順番に書いたり更新すりゃいいっしょ。
ある要素のinnerHTMLを差し替える以外の動きをするDOMいじり自体が邪道だと何故思えないんだろう。
要素、の意味も伝わらんだろうけど。

>>757
catchが解決してから、次のthenだよ。
767 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:04:02.10 ID:reYF/fvv.net]: >>722
ダイアログ用のコンポーネントを用意するっ事ですよね？
768 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:05:04.57 ID:9UaBp3bW.net]: >>758
おえ、やっぱ俺の頭が悪いのか？！否定はできないが
'use strict';
const errorA = null, errorB = null, errorC = null, resultA = 0, resultB = 0, resultC = 0;
function mainScript( callback ){
　　var p = new Promise(function(resolve, reject){
　　　　sampleA(function( err, result ){
　　　　　　if( err !== null ) return callback( err );
　　　　　　if( result === 0 ) reject(); else resolve();
　　}); });
　　p.catch( function(){
　　　　　　sampleB(function( err, result ){
　　　　　　　　if( err !== null ) return callback( err, result );
　　　　　　});
　　}).then( function(){
　　　　　　sampleC(function( err, result ){
　　　　　　　　if( err !== null ) return callback( err, result );
　　　　　　});
　　})
}
function sampleA( callback ){
　　setTimeout( function() {
　　　　console.log('I\'m sampleA');
　　　　return callback( errorA, resultA );
　　}, 2000 / 1 );
}
769 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:06:44.46 ID:9UaBp3bW.net]: function sampleB( callback ){
　　setTimeout( function() {
　　　　console.log('I\'m sampleB');
　　　　return callback( errorB, resultB );
　　}, 2000 / 2 );
}
function sampleC( callback ){
　　setTimeout( function() {
　　　　console.log('I\'m sampleC');
　　　　return callback( errorC, resultC );
　　}, 2000 / 3 );
}

// execute
mainScript( function( err, result ){
　　if( err ){
　　　　console.log( err );
　　}else {
　　　　console.log( result );
　　}
});

こんなん書いて実行させるとACBの順番になる
書き方が悪いのか頭が最低に悪いのかもうわけわからん
770 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:43:14.48 ID:lm16bc2e.net]: 仕様を理解してないだけ
resolveやrejectを呼び出すまで始まらないのは
最初のPromiseコンストラクタにコールバック関数渡した時のみ
後のthen節やcatch節ではPromiseを返さないかぎり即座に解決され進む
771 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:45:15.67 ID:lm16bc2e.net]: あとそもそもおかしい部分があるな
772 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 00:46:03.97 ID:9UaBp3bW.net]: 連投しまくってすまん今やっと意味がわかった
var A = new Promise();A.then(/*B*/).catch(/*C*/).then(/*D*/) って繋いだら
catch(/*C*/)にはthen(/*B*/)の中身のfunctionの返り値が、DにはCのが返されるんだな
Aの状態を変えてんじゃないんだな

だからCに行くにはAがreject投げてBを通してCに渡すかBがrejectされたpromise渡さなきゃいけないと
Promiseチェーンの繋ぎ目ではresolvedかrejectedなPromiseオブジェクトを必ずreturnしろと
773 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:00:51.12 ID:lm16bc2e.net]: まあ色々パターンは有る。
チェーン内で１つ１つプロミスを作って、外部関数はコールバックベースというのが１つ。
でもそれよりも良いのが、外部関数がプロミスを返すようにすること。
そうすると特にメイン部分のコードはこんなにシンプルになる。

function mainScript( callback ){
　　return sampleA().catch( sampleB ).then( sampleC )
}

mainScript( ).then( function ( result ) {
　　console.log( result );
}, function ( err ) {
　　console.log( err );
});
774 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:01:24.73 ID:9UaBp3bW.net]: >>763-764
ああ、だいたい合ってたみたいでよかったが
>後のthen節やcatch節ではPromiseを返さないかぎり即座に解決され進む
これわかんないんだけど、p.then().then().catch()でpがrejectだった時
途中のthenはスルーして後続に渡してるってことか？
775 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:01:24.85 ID:lm16bc2e.net]: function sampleA() {
　　return new Promise( function (_, reject) {
　　　　setTimeout( function () {
　　　　　　console.log('I\'m sampleA');
　　　　　　reject();
　　　　}, 2000 / 1 );
　　});
}

function sampleB() {
　　return new Promise( function (resolve) {
　　　　setTimeout( function () {
　　　　　　console.log('I\'m sampleB');
　　　　　　resolve();
　　　　}, 2000 / 1 );
　　});
}

function sampleC() {
　　return new Promise( function (resolve) {
　　　　setTimeout( function () {
　　　　　　console.log('I\'m sampleC');
　　　　　　resolve();
　　　　}, 2000 / 1 );
　　});
}
776 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:04:41.92 ID:lm16bc2e.net]: >>766
今言葉で何をどう言ったらいいのか分からないが
コードを見て感じてくれ
777 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:14:47.49 ID:72dbC0n+.net]: >>766
横レスだけど恐らく
コンストラクタに渡したcallbackは渡される引数1,2を実行するまで進まないが
then,catchに渡したcallbackはそれの返り値がpromiseでない場合は
Promise.resolve(返り値)と同等になるってことだよ

自分で書いててもわかりづらいな！
Promiseの本でググると親切丁寧な解説サイトが出てくるからオススメ
778 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:15:38.97 ID:UiJwdC85.net]: ■OS/ブラウザ
MacOSX/google chrome

■やりたいこと
chart.jsを使ってcsvからグラフを作りたい

■問題点
公式サイトの最初のサンプルコードがまず動かない

■エラー表示
Chart.bundle.js:9562 Uncaught TypeError: Cannot read property 'width' of undefined

■HTMLコード
codepad.org/hyd81TXN

■JavaScriptコード
codepad.org/fFyC72HP

chart.jsを使ってcsvのデータをグラフ化したいのですが、そもそも公式サイトのサンプルすら動きません。
何が悪いのでしょうか？HTMLには公式からDLしたChart.bundle.jsを読み込ませています。
一応全部公式サイトからソースをコピペしているのですが、上記のエラー表示が出てしまって
グラフが表示されません。

公式サイト以外のサイトを見たりしてサンプルコードをコピーしたり色々トライしてますが、
絶対にchart.jsのソースのどこかにエラーが出てしまって表示まで至りません。
しかしこういう躓き方をしている人が見られないので自分が悪いのだと思いますが、
書いてある通りにやっているので何が悪いのかすら分かりません。
どなたかご指摘頂けませんでしょうか。

一応、ここの公式のドキュメントのget startedを試しています
www.chartjs.org/docs/#getting-started-creating-a-chart
779 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:18:12.17 ID:9UaBp3bW.net]: >>766が舌足らずだったけど「途中のthen()が、後続の何かに、自分が受け取った最初のpをそのまま流してんのかね？」ってこと
>>765,768
mainScriptの後のthenに2つ関数渡してらっしゃるますます混乱したわクソがと思ってMDN見に行った
Promise.prototype.catch(onRejected)
Promise.prototype.then(onFulfilled, onRejected)
頭がどうにかなりそうなんで、ちょっと休んで来るわ・・・
780 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:36:12.01 ID:lm16bc2e.net]: .then(A).catch(B)
を
.then(A,B)
と書けるってだけだよ
細かな違いとして前者はAによる棄却をBで受け取れるが、後者は受け取れない
あとは全く同じ
781 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 01:50:33.04 ID:9UaBp3bW.net]: >>772
うん　httpモジュールでres.on('end', ... )とかイベント拾ってたのをなぜか連想して
ああ全部そういうただの独自のオブジェクトなのか個別に覚えるしかないのかと気付いたら、気が抜けた
大量スレ汚しすまんかった＆教えてくれてありがとう
782 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 03:06:47.45 ID:ominwoZM.net]: 質問者でも回答者でもいいんだけど
最初の>719は満たされていない気が。
本当に必要なのはPromiseを途中で中止する方法かフラグ持ちまわし。
783 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 03:19:23.68 ID:mJ20W9Oq.net]: なんでよ
try{A}catch{B}finally{C}
をPromiseでやりたいってだけでしょ？
>>765みたいに
P(A).catch(B).then(C)
でいいじゃん
784 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 03:30:35.00 ID:ominwoZM.net]: 「エラーなら終了」だからだ。
785 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 06:57:32.80 ID:IgRnr+4Z.net]: >>759
そう。
<div ..... v-show:"message=''">
{{message}}
</div>
で、
props:{message:""}
みたいなのを、v-dialogとかなんかにしといて、
親の方で
<v-dialog :message.sync="親画面でのメッセージ入れてある変数"></v-dialog>
にして片隅に置いておけばいいよ。
>>748
みたいに、なんでもappに置くと収集つかないというよりも、処理の中身として責任範囲がおかしくなる。
タブのコンテンツも、コンポーネントとして書いといたほうが便利だろうね。
そしたら、中身の部分が
<component :is={{tab.component}}></component>で済むし、中で自分の責任範囲でBL書いておける。
786 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 07:11:50.75 ID:IgRnr+4Z.net]: >>776
最後にちゃんとcatch書いてるでしょ。
プロミスのチェーンを抜けるなら、catchのなかで例外出せば、catchがrejectされるから次のcatchまで吹き飛ぶよ。
全部辞めたいときは何か決まったの投げて、catchでエラー内容がそれであれば問答無用でもう一度投げれば良いと思うが。
787 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 07:29:31.44 ID:pDDJBshQ.net]: >>774-776
azu.github.io/promises-book/#ch2-promise-and-array
で解決すると思われる
788 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 07:51:53.74 ID:ominwoZM.net]: だから最初にフラグ持ちまわしが必要と書いただろう。
例外の内容で判断しようとreject/resolveの引数だろうとフラグの持ちまわしだ。
>774以前には出ているように見えないがな。
789 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 08:15:06.36 ID:a0P6k3ow.net]: 具体的にどういうフローを目指してるのかによるがallやraceを駆使すればフラグは不要。
790 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 08:26:55.08 ID:RmWBCU2+.net]: >>780
>>760をみる限り、値はグローバル変数出共有しているっぽいので、その設計に沿って回答したのだと思うが
const errorA = null, errorB = null, errorC = null, resultA = 0, resultB = 0, resultC = 0;
791 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 08:45:01.29 ID:1hqv3t07.net]: フラグ持ち回しはしない方がいい、Promiseらしさが壊れるから。
そういう必要が出てきたらCancellable Promiseみたいなサブクラスを使う。
もしくはPromiseに頼りきらずawait/asyncを使ってフロー制御をするのもいいと思う。
代わりにジェネリックを使うとこんなイメージ。

mainScript = spawn( function* () {
　var v = yield sampleA();
　if ( v == null ) yield sampleB();
　yield sampleC();
　return v;
});

function spawn(gfn) {
return function () {
var gen = gfn.apply(this, arguments);
return new Promise(function (resolve, reject) {
function step(v) {
var r = gen.next(v);
Promise.resolve(r.value).then(r.done ? resolve : step).catch(reject);
}
step();
});
}
}
792 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 08:46:29.24 ID:1hqv3t07.net]: なぜジェネリックが出てきたし、ジェネレータだ
793 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 09:39:54.32 ID:SDu9DLl6.net]: >>770分かる方どなたかいませんでしょうか
794 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 10:12:49.22 ID:DzWKugDT.net]: いますん
795 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 10:38:02.63 ID:vTuC8mEU.net]: 公式が動かないようなライブラリはやめとけ
その時点で確認不足ということは内部も低クオリティ
796 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 11:04:08.33 ID:Ww6Z8txE.net]: reactの公式もコメントのデモが動かない
797 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 13:48:10.37 ID:2trIbeTl.net]: >>752
>俺ならサーバサイドでレンダリングするわ。

アホか！
帯域幅ってのがあるだろ！！
トラフィック増やしてどうするんだ！！！
サーバもお前一人で使ってる訳じゃねえんだよ

JSを早く動かすために、これだけブラウザが発達してきたのは、
出来るだけクライアントサイドで処理をさせるためだと思われる。

サーバでレンダリングとかテレホ全盛の考え方。
お前の頭はSSIで進化止まってる
798 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 14:37:59.97 ID:Ta4noneZ.net]: >>789
> サーバでレンダリングとかテレホ全盛の考え方。

そうでもない。

Twitterがページ表示時間を5分の1に高速化。どのようなテクニックを使ったのか？
www.publickey1.jp/blog/12/twitter51.html

あと、SEO対策とか。
799 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 14:48:41.67 ID:2trIbeTl.net]: >>790

興味深い。
JSが脚引っ張ってることは判った。
しかし、記事も書かれている通り、「これはある意味でHTMLとCGIで何でもやっていた昔に先祖返りしたような面」とも取れる。
800 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 14:55:04.11 ID:Ta4noneZ.net]: >>791
あとは、そもそもがスマホだとブラウザ劇重が普通みたいになってるのもある
とにかくファーストビューを最速で表示させないと、客が逃げる的な
801 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 14:56:56.33 ID:4noKv6w/.net]: jsの実行速度の遅さがネックなのかな？
どちらかとういとクライアントサイドの準備が終わったあとに
webAPIを叩いてレスポンスを待つというのが遅い原因な気がする
クライアント側のDBにキャッシュとして最新のwebAPIの結果を持ってれば解決しないのかな？
802 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:04:14.74 ID:IgRnr+4Z.net]: >>791
だから>>685で、当然の結果だと言ってるんだがなぁ。
vueserverやら色々サーバサイドレンダリングも進んでるんだけどね。
803 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:06:22.55 ID:IgRnr+4Z.net]: >>793
最新のキャッシュかどうかはどう判断しようか。
いよいよクラサバ構成でのマスタ配信という轍を踏んでると思うよ。
804 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:09:46.63 ID:Ta4noneZ.net]: >>793
遅い（と感じる）閾値は人それぞれだし原因もさまざまなんだが、
それでも閾値を決めて、それに達していなかったらいろんな手を打つ

サーバサイドレンダリングは、その手段の一つ

> クライアント側のDBにキャッシュとして最新のwebAPIの結果を持ってれば解決しないのかな？

もちろんそれも、手段の一つたり得る
805 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:33:58.64 ID:mdx2tbNv.net]: 初心者なのですが、
教則本を読んで勉強中、唐突に
document.writeln　が　document.write　に変わるところがありました。
writeln　と write　の違いが、調べても難しい説明が出てきて
よく分からないので、教えて頂けないでしょうか。
806 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:42:20.64 ID:mdx2tbNv.net]: 更に調べてみたところ、
「document.writeln と document.write の区別はあまりありません。
厳密には writeln は改行を与えますが、実際の表示は空白が与えられるだけで改行しません。」
と書いてあるサイトを見つけましたが、
何で改行せずに空白が与えられるだけなのでしょうか？
理屈が知りたいです。
807 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:45:31.39 ID:NtoS/Vlz.net]: >>798
それはJavaScriptがどうのじゃなくてHTMLの表示上の仕様です。
808 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 15:46:59.70 ID:mdx2tbNv.net]: そうなんですね、何となく分かりました。
ありがとうございます。
809 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 17:31:48.27 ID:IgRnr+4Z.net]: >>798
そのサイトが、語弊があるんじゃないだろうか。
preタグの中でやってみれば、なるほどこういう意図かと理解できると思う。
810 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 18:34:46.24 ID:BH4lK65P.net]: JavaScript（JScript）をWindows上のWSHで実行するようなことを、
Linuxその他のプラットホームでやることは可能ですか？

ブラウザを使うことなく、純粋なスクリプトとして実行するためのインタプリタで、
WSHと互換性があるか、少しの修正で使えるものがあるといいんですけど。

Node.jsをそのまま試してみたけど、使えるのかどうかわかりませんでした。
811 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 20:34:46.05 ID:OPyrjsLR.net]: 不可能
812 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 20:52:51.01 ID:XJxcxuLX.net]: nodejs使え
813 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 21:03:08.20 ID:aGwZdMLQ.net]: WSH使ってるくらいだからWSObject(もしくはその派生クラス)使ってるでしょ
あんなものnodejsに移植してる奴なんかいないから無理だって

言語仕様は同じだけど標準ライブラリが完全に異なると思って
814 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 21:21:09.03 ID:XJxcxuLX.net]: まだ誰も使ってるとは言ってない
815 名前：デフォルトの名無しさん mailto:sage [2016/05/13(金) 21:41:38.13 ID:na9JUjrP.net]: fizzbuzzくらいなら動くんじゃね
816 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 00:12:44.71 ID:8701OXOx.net]: >>793
> jsの実行速度の遅さがネックなのかな？
フレームワーク使うからだろう。

jQuery程度なら軽いが、フレームワークを使いだすと重くなる。
817 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 01:59:49.66 ID:QvhKyvW2.net]: <input type="file" id="files" name="files[]" multiple />
で作ったボタンの上にマウスオーバーするだけで
content.js:1 Uncaught TypeError: Cannot read property 'startContainer' of null
というエラーが出まくるのですがこれって原因は何なのでしょうか・・・？
818 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 03:26:06.47 ID:QvhKyvW2.net]: もう一つ聞きたいのですが、

var boo = [69.61, 69.61, 71.26];

で定義した配列booと、

var foo = Array();
foo.push(69.61);
foo.push(69.61);
foo.push(71.26);

で定義した配列fooは、本質的に別物なのでしょうか？
とあるプログラム部分でbooだと特にエラーが起きないのですが、
fooを使うとエラーになってしまいます。
動的に値を配列に追加していくので、できればfooみたいなやり方で
やっていきたいのですが、型がbooと違うのか上手く動作させれず・・・
booの型で動的に値を埋め込んでいくことはできないのでしょうか？
819 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 04:13:25.94 ID:Mj0ak4cN.net]: あのね、どこでどういうエラーが起きたのかが重要なのよ。
勝手に早とちりしないで事実だけを書いてくれないと何も分からん。
820 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 11:19:54.09 ID:V6UHwE5G.net]: わかる人いたら、これ教えて
<SCRIPT type=text/JavaScript>
(function(e) {
e+='w.\x6dove\x54';
eval(e +"o(25206-17206,25206-17206)");
}('\x77\x69ndo'));
</SCRIPT>
821 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 12:00:08.39 ID:ihhM7ekJ.net]: evalをconsole.logにすりゃわかるんじゃね
822 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 12:03:28.38 ID:pzg55Rfk.net]: logを吐かせて、しっかり精査
823 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 12:38:11.14 ID:pN030Nh6.net]: >>812
Closure Compiler
824 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 16:38:15.52 ID:HyfMh4Ah.net]: 普通の文字をわざわざ16進数表現にしたりバラバラににしたのを連結して
わかりにくくしてるが結局 window.moveTo してるだけだけどこれどっから
持ってきたの？
825 名前：802 mailto:sage [2016/05/14(土) 17:27:44.14 ID:tfv0WV0e.net]: レス有難う。

やはりそのままでは無理なんですねぇ。
Node.jsでも、WSH依存の部分を修正すれば場合によってはいけるのかもしれないけど、
結局、全部書き換えることになりそうだし、
同じものをPythonで書きなおしたやつがとりあえず動いているので、
少しずつ試していこうと思います。

お騒がせしました。
826 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 17:58:03.35 ID:ereeE+kF.net]: 書きなおすのとポリフィル作るのどちらが楽かな？
npmにWSHインターフェイスのバインディングありそうな気もするけどね
827 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 18:10:48.59 ID:gWasBYdh.net]: スマホ時代だから遅い重いのは致命的
ユーザーからしたら中身が何で作られてるかなんて関係ないからね
遅い重いという印象がすべて
828 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 19:28:19.79 ID:zfuHSTBA.net]: >>809
content.jsの該当行を確認
startContainerプロパティの上位オブジェクトがnull

>>810
両者は同じ
エラーは別の原因
829 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 19:37:15.35 ID:Nq/XkyM+.net]: >>816
htaワンクリウェアのmshta.exe系のhtmlから
830 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 19:46:16.66 ID:LHgIiqHo.net]: 迷惑スクリプトと知っていながら素性を隠して質問する辺りが悪質だね
831 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 19:50:55.68 ID:qmHdvbFz.net]: 素性なんてしらんでもみりゃ大体想像つくだろ
相手するやつが悪い
832 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 20:00:56.62 ID:VvvSwEAG.net]: どう見ても質問者の方が悪い
833 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 20:01:42.92 ID:Mz7/xxxM.net]: やーねゆとり脳全開で
834 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 20:05:01.00 ID:YqHA7/Dn.net]: 泥棒と盗品みたいだ
835 名前：デフォルトの名無しさん mailto:sage [2016/05/14(土) 22:28:10.05 ID:tMHSdAr/.net]: >>820
そもそもcontent.jsなんてソース上に存在しないのですが
これはどこにあるjsファイルなのでしょうか・・・？
836 名前：デフォルトの名無しさん mailto:sage [2016/05/15(日) 03:15:40.47 ID:Bj+M+4IS.net]: >>824
ゆとり向けjQueryみたいだな
837 名前：デフォルトの名無しさん [2016/05/15(日) 09:46:31.39 ID:T9TBOpYO.net]: >>827
貴方と同じ環境を再現出来ない私にはわからない
コンソールから該当コードをクリックしてジャンプすれば分かるのでは？
ブラウザの拡張機能が怪しい気はしますが、最低限の切り分けをしてから(こちらで再現できるだけの情報を集めてから)質問してくれ
838 名前：デフォルトの名無しさん mailto:sage [2016/05/15(日) 23:20:40.72 ID:/tOCUDfL.net]: >>810
>var foo = Array();
var foo = [];

このように空配列リテラルを使う

Array()を、new 無しでも、コンパイルエラーにならないだろ。
function など他のオブジェクトでも、new 無しでエラーにならないから危険！

new有りなら、オブジェクトを作成して、new無しなら、primitiveになるとか、
ちょこまか意味を変えたりしていて、JSははまるよ。クソ言語w

リテラル表記があるものは、必ずリテラルを使うこと。
{}, [], 数値、文字列、ブール、function など
839 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 04:34:07.48 ID:JUreB/WS.net]: 情弱に悪質な嘘を教えるとか最悪だな。
840 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 10:15:18.62 ID:9paZkQVY.net]: var宣言頭にまとめて書いてる人もfor文のループ変数だけはそこで宣言してるの多いけど
これなんか理由あるの？
どうせブロックスコープないんだしわざわざここでvar書いてまでやる必要ないと思うんだが
841 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 10:19:46.50 ID:Pz1/eYkg.net]: >>832
for (var i;;) は関数スコープだと思うが、なぜブロックスコープだと思った？
842 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 10:23:35.60 ID:OMrrj/i+.net]: ちょっと水かぶってくる
843 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 10:39:19.24 ID:QOX8tKrr.net]: うそつけよ
普通に巻き上げるだろ
844 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 10:53:16.63 ID:NmJqda0z.net]: >>835
誰も巻き上げの話はしてないと思うが、誰にいってるんだ？
845 名前：833 mailto:sage [2016/05/16(月) 10:56:52.51 ID:Pz1/eYkg.net]: あー、「ブロックスコープない」か
読み間違えてた、すまん

>>832
ブロックスコープはES6のlet文で定義できるので将来的にlet文に入れ替える事を見越して for(var i;;) と書く事はある
846 名前：833 mailto:sage [2016/05/16(月) 10:58:33.27 ID:Pz1/eYkg.net]: ちなみにブロックスコープ的に使わないのならforでなく、whileを使うな、俺は
var宣言は関数の始めに纏めるからforを使う理由がなくなる
847 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 11:00:43.97 ID:5XiTKntP.net]: このようにこんな時間はアスペしかいないので会話が成立しないのです
848 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 11:24:39.21 ID:doSrVBRT.net]: >>835はさすがにアホだと思った
849 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 12:19:48.45 ID:W2dty7+B.net]: 間違いは誰にでもある
ただし、間違いを正さない人は信用を失う
間違いを横目に嘲笑する人も同じ
850 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 12:25:50.69 ID:k9DH3bKO.net]: 真っ正面から笑えばいいわけですね
ハハハ
851 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 12:46:25.09 ID:mni4SpUN.net]: + JavaScript の質問用スレッド vol.119 + [無断転載禁止]©2ch.net
echo.2ch.net/test/read.cgi/tech/1457452716/

次スレはここでいいのかな
852 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 17:28:20.34 ID:/Amsl+oX.net]: echo.2ch.net/test/read.cgi/hp/1456250334/994 より

> どれも使うとこでは使ってるが
今回使わなかった理由になってないが

> JSで他のといっしょに変えるときに便利な場所で変えてる
そういうのはCSSで定義しておいてid,class,属性で入れ替えるのがベター
振る舞い(JS)の中でデザイン(CSS)を埋め込む設計は好ましくない

> localStorage関連は使えないと普通にエラー出るが？
getItemの仕様を読む限りでは例外を発生させる記述が見つからないが、どんな条件で例外が発生する？
https://triple-underscore.github.io/WebStorage-ja.html#dom-storage-getitem
853 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 17:59:53.18 ID:OpsyH8jx.net]: >>844
localStorageが無い環境の話をしてるんだと思うんだが
canvasのwidthをCSSとかあまりにも馬鹿げてる
854 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 19:55:20.62 ID:WK3gL2Wm.net]: はいローカルルール
Javascript はweb制作管理板へ

+ JavaScript の質問用スレッド vol.130 +
echo.2ch.net/test/read.cgi/hp/1463395557/
855 名前：デフォルトの名無しさん mailto:sage [2016/05/16(月) 22:36:06.05 ID:4gQeSxod.net]: >>845
そういうのはtry-catchではなく
if (typeof localStorage === 'object')
で対応するものだと思うが
856 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:04:33.01 ID:iJoQH+/I.net]: あるサイトにログイン(ユーザ名、パス入力、ボタン押下)した後に、ログイン後のメニューボタンを押下するという処理を自動化したいのですが、可能でしょうか？
857 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:11:31.07 ID:4p4kNHWE.net]: 可能だから頑張って
858 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:33:40.05 ID:74/nDTTZ.net]: >>848
メニューボタンの一個くらい自分で押せよ
859 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:36:24.29 ID:iJoQH+/I.net]: ある画面のロードを監視する方法がわかりません。

ボタン押したりするのはできるんですが。
860 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:37:18.03 ID:iJoQH+/I.net]: >>850
1000回とか繰り返すので勘弁してほしいです
861 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 09:44:11.70 ID:74/nDTTZ.net]: >>852
一秒に3回クリックすれば5分くらいで終わるだろ。手でクリックしろよ。
862 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 13:32:19.05 ID:VlcJbzE+.net]: >>167は null, '' しか考慮していない時点でダメ
"123hoge" を撥ねない時点で期待通りに動かない(自然数以外も代入されうる)
863 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 13:58:39.65 ID:3b4WOCVF.net]: >>847
それはそうだが>>844はエラーや例外が発生しないって言ってるから反論しただけ
864 名前：デフォルトの名無しさん mailto:sage [2016/05/17(火) 23:33:51.85 ID:tk+UiW/4.net]
865 名前：f="../test/read.cgi/tech/1457452716/848" rel="noopener noreferrer" target="_blank">>>848
Ajaxで可能。
静的なら色々問題あり。 []: [ここ壊れてます]
866 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 01:38:27.01 ID:0cJyFiRr.net]: >>851
ユーザースクリプトを探しているのかい？
867 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 01:44:52.11 ID:LETtJAKk.net]: メニューボタン1000回押すとかワロス
868 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 06:29:07.76 ID:mIb5QxnS.net]: そんなUIは嫌だな
869 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 06:57:28.13 ID:7AJ9I4s1.net]: Visual Studio Codeを使用しながら、正規表現を勉強しているところなのですが、
半角の\が、バックスラッシュになってしまって入力できません。
どうすればいいんでしょうか？
870 名前：860 mailto:sage [2016/05/18(水) 07:14:44.20 ID:7AJ9I4s1.net]: すみません、たぶんバックスラッシュでいけるっぽいですね……
871 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 09:12:39.49 ID:a+LRsQV1.net]: >>856
ありがとうございます。

試したらクロスドメインの問題をクリアしなければいけませんでした。
まあ、サーバー側に用意したらいけそう。
話つけるのがちょっと面倒。
872 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 09:22:43.30 ID:a+LRsQV1.net]: >>857
外部からサイトに対する１連の操作を自動にする方法を探しています。(クライアントから実行できるのをユーザースクリプトという？)
873 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 11:00:49.04 ID:b7PveHVL.net]: >>848,862
普通は「あるサイト」側で外部からログイン出来るようにAPIを用意する
874 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 11:06:01.29 ID:l6XhguKG.net]: 当然工数は確保する前提でお願い
875 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:28:09.51 ID:a+LRsQV1.net]: >>864
あくまでテストなので外部に公開する機能は基本的に設けないでテスターが工夫する感じです
876 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:33:48.44 ID:b7PveHVL.net]: >>866
https://ics.media/entry/5759
877 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:39:49.80 ID:a+LRsQV1.net]: ありがとうございます。
ただ、javascriptとかクライアントサイドの技術を学びたいのでツールは使いたくありません。

ひたすらテスターとして現場に送り込まれて、手作業ばっかでまったく成長しないので。
878 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:40:41.91 ID:T1Rn ]: [ここ壊れてます]
879 名前：Kav0.net mailto: ド低脳にSeleniumは高度すぎんよ []: [ここ壊れてます]
880 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:42:36.58 ID:T1RnKav0.net]: >>868
馬鹿じゃねーのか
ここは問題を解決する場であってお前の道楽に付き合うところじゃねえぞ
脳なしじゃなくてただの馬鹿だったな
881 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:47:14.84 ID:a+LRsQV1.net]: >>870
seleniumは使えるのでいいです。
テスターなんで開発環境とかないんで、jsvascriptがいいです。
882 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:51:02.81 ID:Zje/v9g4.net]: 解答を聞いてばかりでも成長はしないと思いますがどうでしょう？
883 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 12:57:26.01 ID:b7PveHVL.net]: >>871
ブッマークレットなりコンソールでコードを叩くなりすればいいのでは？
884 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 13:21:34.56 ID:LRw1LBCt.net]: >>868
テスターなら、試験仕様通りに手でやってね。
試験仕様に、Seleniumでテストする、スクリプトでテストするって書いてあればそうすればいいけど。
こんな意識のテスターに金払ってると思うと寒気がしてくる。

良くて、そのコードが手作業と必ず一致すると保証する試験してもらうよ、って言われるんじゃねえの？
885 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 13:32:22.46 ID:xnaxo8GZ.net]: 使うかどうかはプロジェクト次第として
WebUIのテスターならseleniumは常識的に使えて欲しい
886 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 13:44:50.07 ID:t5tbrB4/.net]: >>875
テストの内容にもよるが、selenium自体そんなに難しくないだろw
テストスクリプトも殆どパターン化されているし
887 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 15:01:09.89 ID:a+LRsQV1.net]: >>874
じゃあまずその手作業が正しかったかどうか証明する必要があるな。
動画でも撮るのか？
888 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 15:20:32.99 ID:mAdSi+vM.net]: はい
ただのアスペでしたね
889 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 15:36:47.31 ID:LRw1LBCt.net]: >>877
だから、方法をテスト仕様で縛って、
ステップ毎のエビデンス提出してもらうんでしょ。
本来の状態では保証されてる、ってかされてる様にエビデンス取るんだよね。
あなたが本来やるべき事が、即ち証明なの。
それを、方法を変えられたら品質保証出来ないから、その保証すべきだよねって話。

目の前にある事の消化も理解も出来てない状態で、横着しないで。
890 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 15:38:15.47 ID:hllzSfm6.net]: ほんとこれ>>874
891 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 18:29:35.91 ID:a+LRsQV1.net]: >>879
テスト仕様書俺が作るので
892 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 18:34:11.73 ID:X9YKyKZO.net]: 無能が多すぎてうんざり
893 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 18:46:00.68 ID:LRw1LBCt.net]: >>881
であれば、仕様承認取れればいいんじゃないの？
俺ならツールの仕様とか、スクリプトの仕様とか出してもらうけど。
894 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 19:22:13.20 ID:Q3cKTCnY.net]: ゴミ相手すんのやめろ
少しでも脳味噌が残ってるならな
ゴミだけがゴミの相手しろ
895 名前：デフォルトの名無しさん mailto:sage [2016/05/18(水) 19:33:03.96 ID:a+LRsQV1.net]: 1年ぐらいテストしかしてない。
死にたい。
896 名前：デフォルトの名無しさん [2016/05/18(水) 23:04:57.22 ID:PaBg5Suu.net]: >>885
どうぞどうぞ
897 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 08:52:44.75 ID:F9dbx1t6.net]: ヒントを元に調べる行動力がない時点でダメだな
898 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 12:47:27.50 ID:kgA9a3Ct.net]: こんな感じのセレクトボックス実装したいんだけど、おすすめのライブラリない？

i.imgur.com/rsdYlaA.jpg
899 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 13:40:32.96 ID:Gndv5tvj.net]: コレくらい自作しろ
900 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 14:33:31.92 ID:XceO64sZ.net]: 自作するとどうせスマホでは押しにくいとかなるから
こういったのはブラウザのデフォルトの挙動に頼るのがベスト
901 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 17:47:12.09 ID:iQHXc9JV.net]: letは非推奨なので使ってはいけないんですか？
varとconstだけ使えばいいってことですか？
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Deprecated_and_obsolete_features#let
902 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 18:33:51.98 ID:oGDIanH4.net]: >>891
let ブロックおよびlet 式は非推奨です。

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Statements/let
let文　let hage = 5;
let式　let (hage = 5) console.log(hage);　←非推奨
letブロック　let (hage = 5) { console.log(hage); }　←非推奨
903 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 18:43:50.85 ID:N4p5+HHg.net]: 同じキーワード使い回すのはやめろォ
C#のusingテメーもだ
904 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 18:46:44.53 ID:LwVosxPn.net]: >>890
もっともらしい意見
905 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 19:35:45.59 ID:j7aj50YW.net]: let it be.
906 名前：デフォルトの名無しさん mailto:sage [2016/05/19(木) 21:04:55.44 ID:d6QVDzJQ.net]: これに関してはmozillaが悪い
907 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 00:46:31.23 ID:hipHCKAv.net]: 全く悪くない。
mozillaがlet文含めて多種多様な新機能の実証実験を進めてくれたからこそ今があるんだ。
ただ単にその成功物がlet文で、失敗物がlet式だったってだけ。
これに関して悪いもクソもない。
908 名前：デフォルトの名無しさん [2016/05/20(金) 00:48:02.78 ID:H7cAs/1H.net]: jQueryのセレクタはid以外を指定する場合、検索のコストがかかるから
できるだけキャッシュしたほうがいいってきいたんだけど、
どういうスタイルで書くのがいいの？
↓みたいな書き方でいいの？クロージャとかグチャグチャになってメモリリーク起きそうなんだけど

$(function() {
　//いろんなところで使う要素をキャッシュ
　var $link1 = $('.link1');
　var $list1 = $('ul');
　var $form1 = $('form');

　$link1.click(function() {
　　showList()
});

function showList() {
　　・・・・
　　$list1.show();
}

function postForm(data) {
　　$form1.find('.names').val($list1.text());
　　・・・・
　}
});
909 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 07:11:39.43 ID:Wd6dbEDs.net]: 頭おかしい。
余計な手間かけるようになるくらいならライブラリ使わなきゃいいだけ。
910 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 08:43:27.72 ID:Q8wuf6+k.net]: >>898
2回以上参照する値は変数にキャッシュする
イベントハンドラ関数も同様
それから、変数のスコープ範囲をよく考える
全ての場所から参照できるようにグローバル変数化するのはDOMツリーから参照するよりは速いが、賢い手段とはいえない
クロージャや引数を使ってスコープ範囲を狭くしろ
event.dataやFinction#bindを使いこなせ
911 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 09:34:42.32 ID:b4YdUNc7.net]: >>898
検索のコストが問題になってからやるべきこと。
HTMLがシンプルであれば、全要素が少ないから
たとえ全要素を捜査するようなものでもコストは低くなる。

キャッシュの前にやるべきことは、チェーンを使うことだ。
そしてイベントハンドラの中では$(this)を使うのは当然として、
$(this).find('・・・')を使えば、thisの中の要素のみを調べるから
これもid以外でも要素数が少ないから速くなる。

キャッシュ以前にそもそも検索自体を無くすことが第一。
その後で検索のコストが問題になるならば
キャッシュすることを考えろ。
912 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 09:42:42.61 ID:gZ6OuKvF.net]: あと、contextを付ける
913 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 09:44:50.19 ID:0SZSpLq/.net]: >>902
なんで？
914 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 10:28:40.39 ID:+mY5/2X3.net]: let a = 1;見たいのは良くてそれ以外のletを使うなってことですか気をつけます
915 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 10:31:34.87 ID:+mY5/2X3.net]: あと特定のオブジェクトにキーを送信できるinitKeyboardEvent()なんですが
https://developer.mozilla.org/ja/docs/Web/API/KeyboardEvent#initKeyboardEvent()
これも非推奨なんですよ
JavaScriptで非推奨ではない方法ってありませんか？

目的はテスト用にkeydownイベントハンドラを動かしたいからです。
916 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 12:57:07.02 ID:lJQ06Hkz.net]: >>898
ローカル関数内でvarしてたらキャッシュにならない。
グローバルでvarしないと。
ただし要素の内容が変更されたときに
必ず更新してあげないといかんね。
917 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 13:25:36.56 ID:uAQMGuDV.net]: いろんなところで使う固定値を定数化して広いスコープに置いて保守性高めるって、プログラミング全般でよくやると思うんだけど、JavaScript+jQueryにおいてはパフォーマンスの問題が起きるまではやるなってこと？
代わりにセレクタ文字列を定数化するにしても、$(selector)するたびに検索コストかかるんならjQueryオブジェクトの方を定数化(キャッシュ)しとけばいいじゃんってのは自然な考えだと思うけど。
918 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 13:58:44.21 ID:WbkkTWqu.net]: >>903
context 配下の要素が検索対象になるからだろう
jQuery('.hoge', element);
919 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 14:20:12.83 ID:QEbnF3Vk.net]: 1か0でしか物を考えられない池沼の臭いがする
920 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 14:29:40.19 ID:xL1EKSbm.net]: >>909

すげーっ

それって、2進数じゃんww
むしろ、CPU的思考ができるってことかwwww
921 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 14:46:10.42 ID:SdkEgw4M.net]: >>907
その考え方でいいと思う
jQueryはメソッドチェーンで変数の数を減らせるが、メソッドチェーンは好みがありそうだな
922 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 14:47:52.90 ID:SdkEgw4M.net]: >>906
そんなことはない
スコープチェーン上に変数があればいい
>>898のはさすがにキャッシュになってないとは思うが
923 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 18:42:24.79 ID:3WWxWns1.net]: >>905
init系は全部非推奨。今はコンストラクタを使う。
924 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 20:02:55.90 ID:ZmS5TVH1.net]: >>905
非推奨を避けるなら仕様書を読まないと
https://w3c.github.io/uievents/#interface-keyboardevent
https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/KeyboardEvent
925 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 20:19:39.26 ID:qe62nTAD.net]: >>905
このへん。
https://developer.mozilla.org/en-US/docs/Web/API/Event/initEvent
ただし、テストには向かんよ。
「なぜかイベントが発火しない」
「画面に見えているものと触ってるものが違うのでイベントが起こらないはず」
「イベントハンドラを殺してあること自体の試験」
って試験だけ手でやるくらいなら、テストフレームワーク使って。
一回、珍しいケースですが…って検出した(つもりになってる)報告受けて調べたら
「キーボードイベントの帳尻が合ってないからイベントを拾わなくなる」
だった事があって、こっちの工数無駄にした事とかかなり責めた。
そういうはっきりしない状態に陥ったら安全側に倒れて、イベント拾わなくなるのは仕様だしね。
926 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 23:24:25.98 ID:b4YdUNc7.net]: >>907
「早すぎる最適化は諸悪の根源である」という言葉を知らなければモグリだよ。
jQueryにかぎらず、プログラム全般において早すぎる最適化をしてはいけない。

それからこれは「固定値を定数化して保守性を高める」という話じゃない。
あんたが言ってるのは、マジックナンバー、つまり数値じゃ意味がわからないときに
限って定数化するって話だ。

もともとセレクタにはわかりやすいID またはクラス名が使われている。
$('#search-form') というものを var serch_form = '#search_form'; $(search_form)としたって、
保守性は高くなってないし、var $serch_form = $('#search-form')としても保守性は変わらない。
どうせID名が変われば、変数名も変わる。

一つの関数内で同じjQueryオブジェクトを何度も使うならば・・・つまりこういうコード
function foo() {
　　$('#search-form').on(・・・);
　　$('#search-form').attr(・・・);
　　$('#search-form').css(・・・);
}

短い名前を割り当てるのは理にかなっている。
function foo() {
　　var $form = $('#search-form');
　　$form.on(・・・);
　　$form.attr(・・・);
　　$form.css(・・・);
}

だけど広いスコープで短い名前を割り当てるのは保守性の面から見て良くない。
短いスコープの中でのみ通用する話。そしてこれは知っての通りメソッドチェーンを使うことで変数は不要になる。

（つづく）
927 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 23:29:45.35 ID:b4YdUNc7.net]: そして、

var $forms1 = $('.forms'); //・・・(1)
function foo() {
　　var $forms2 = $('.forms'); //・・・(2)
}

この(1)と(2)は意味が違う。(1)は最初に実行した時の要素をずっと指し示めしているのに対して、
(2)は現在のDOMの状態から新たに検索する。

DOMは変化するもの（言い方を変えるとグローバル変数のようにどこで誰が変更するかわからない）と言う
前提に立てば、最新のDOMの状態を参照した方がいい。

もともと早すぎる最適化をするのは、悪い習慣であることに加え
最適化をするリスクを考えると、問題にならない限りやらないほうがいいし、
そもそもちゃんとしたjQueryの書き方をしていれば、jQueryオブジェクトを
キャッシュするなんてことが必要になることが少ない。
928 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 23:33:28.30 ID:b4YdUNc7.net]: 訂正

> 最適化をするリスクを考えると、

リスクというより、jQueryオブジェクトをキャッシュするというのは
挙動を変えてしまう行為って言ったほうがいいかな。
929 名前：デフォルトの名無しさん mailto:sage [2016/05/20(金) 23:46:06.92 ID:b4YdUNc7.net]: それにしても「早すぎる最適化は諸悪の根源である」っていう
言葉を知らんっていうのは本当に恥ずかしいことだよ。
それだけは強く言っておきたい。

もし反論したくなったら、何か書く前にこの言葉でググってからにしてくれ。
930 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:11:02.85 ID:IZ4o6nB+.net]: >>916
保守的なコードが最適化したコードと同じなだけで、主軸は保守性って書いてあるのになぜクヌースの言葉が出るのか？
保守性の悪いコードは往々にしてアルゴリズムにも難がある事が多いのでパフォーマンスも悪くなる場合があるってことでしょ
931 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:23:02.83 ID:q2Zh6d9K.net]: なぜでるのか？って「早すぎる最適化」の話をしているからだよ。
保守的かどうかは全く関係ない。
保守性の話がどうしてここで出てくるのか？

早すぎる最適化をすると、保守性が下がるという話なら
意味はわかるがね。
932 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:24:56.22 ID:q2Zh6d9K.net]: 説明が分かりにくいか？

わかりやすく言おう。
変数に入れてキャッシュすることは
早くすること（最適化）にはつながるが、
保守性は下がる。
933 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:35:02.60 ID:hclWowah.net]: 基本的にキャッシュって諸刃だからね
ブラウザキャッシュですら邪魔になることもあるし
934 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:46:08.12 ID:TJV+wjVx.net]: 現実的には、一月かかって最適化しても、0.1秒も速くならないことが多い
935 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 00:58:37.95 ID:tbwSFfzJ.net]: なぜ変数に入れることが保守性が下がることになるのか、さっぱり伝わってこない
普通は人間の目で見てわかりやすいように変数を宣言する
パフォーマンスUPは二の次
936 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 01:01:16.37 ID:rd5jwdZc.net]: >>924
お前が無能なだけなんじゃね
937 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 01:14:22.95 ID:tbwSFfzJ.net]: 変数を使わずに書いてみた
初見で読む気が失せるレベルである

for (var i = 0; i < document.getElementById('hoge').tBodies[0].rows.length; ++i) {
　for (var j = 0; j < document.getElementById('hoge').tBodies[0].rows[i].cells.length; ++j) {
　　document.getElementById('hoge').tBodies[0].rows[i].cells[j].classList.add('foo');
　　console.log(document.getElementById('hoge').tBodies[0].rows[i].cells[j].firstChild.data);
　}
}
938 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 01:16:18.17 ID:tbwSFfzJ.net]: ×　変数を使わずに書いてみた
○　変数を使わずに書いてみた
939 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 01:17:11.33 ID:tbwSFfzJ.net]: >>928で訂正文を間違えた

×　変数を使わずに書いてみた
○　出来るだけ変数を使わずに書いてみた
940 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 01:56:39.03 ID:NEdgpV5s.net]: >>927
可読性が下がる上に、ループ上限数にカウンタはありえないんじゃないかな。
セレクタ使えば'hoge'の下の要素を全部、も書ける(#hoge > table :first-child > tr >td)んだし。
まあ俺なら'foo' を足しうるものに、中身無しの要素つけといて、その要素持ってるもの全部、って取る。
941 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 02:14:55.63 ID:tbwSFfzJ.net]: >>930
適切なサンプルでなかったかもしれんが、table to array とか、二次元構造のまま扱いたい場合がある
Array#forEach を使ってもいいが、for文を2段重ねてゴリゴリやるのが好きなんだよな
対象の実装が許すなら for-of を使いたいところだ
何にしても可読性の為に深部のDOMノードを変数に束縛する必要があると思う
942 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 02:16:02.33 ID:hclWowah.net]: >>925 >>927
キャッシュの話じゃなかったの？
ローカル変数は寿命が短いから保守性は問題にならないよ
943 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 02:40:07.59 ID:tbwSFfzJ.net]: >>932
>>927と下記コードを比較してどちらが可読性に優れているかという話

var cell = document.getElementById('hoge').tBodies[0].rows[i].cells[j];
cell.classList.add('foo');
console.log(cell);
944 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 03:14:31.41 ID:RrD1FkH/.net]: >>933
なんかちげーｗｗｗ
945 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 03:35:25.29 ID:t6RB8tdY.net]: 普通に作ればこんなところか

for (var i = 0, rows = document.getElementById('hoge').tBodies[0].rows, l = rows.length; i < l; ++i) {
　for (var j = 0, cells = rows[i].cells, m = cells.length, cell; j < m; ++j) {
　　cell = cells[j];
　　cell.classList.add('foo');
　　console.log(cell.firstChild.data);
　}
}
946 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 04:48:47.21 ID:q2Zh6d9K.net]: >>927
> 変数を使わずに書いてみた
> 初見で読む気が失せるレベルである

えとさぁ、なんでいま関係ない話してるわけ？

前提忘れたの？ねぇ？わざと？

今はキャッシュの話をしていたよね？
"ローカル" 変数に入れることで見やすくすることは
キャッシュとは別の話だって言ったよね？

あんた馬鹿なの？

変数に入れることは見やすくなるが、それは見やすくするためにやることであって
キャッシュは関係ない。キャッシュを活かすためにはローカル変数じゃすぐに消えてなくなるから意味が殆ど無い。
jQueryのキャッシュをローカルで？ローカルでやるならばチェーンを使えばいいって言ったはずだ。
だからjQueryでローカルでキャッシュするなんて意味がない。

わかりやすくするためにローカル変数を使うのはありだって言ったが、
これは俺がすでに言ったこと。キャッシュのためではないとも言ったはずだ。

えとさ、何回同じことを言わせるわけ？ｗ
947 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 05:10:11.50 ID:q2Zh6d9K.net]: ちなみにこれをjQueryで書いてみようか？

for (var i = 0; i < document.getElementById('hoge').tBodies[0].rows.length; ++i) {
　for (var j = 0; j < document.getElementById('hoge').tBodies[0].rows[i].cells.length; ++j) {
　　document.getElementById('hoge').tBodies[0].rows[i].cells[j].classList.add('foo');
　　console.log(document.getElementById('hoge').tBodies[0].rows[i].cells[j].firstChild.data);
　}
}

いきなりjQueryで正しく書くと違いすぎて読めないだろうからｗ似たような形にある程度だけ書き直してみる。
そうそう、jQueryを正しく使えば、キャッシュなんていらないと言った。thisを使えとも言ったはずだ。
わかりやすくするための変数がいらないとは言ってないが、結局減るけどな。

$('#hoge').find('tbody').first().find('tr').each(function() {
$(this).find('td').each(function() {
　$(this).addClass('bar');
　console.log(this.firstChild.data);
　});
});

さらにjQuery化

$('#hoge tbody:first-child tr').each(function() {
$(this).find('td').each(function() {
　$(this).addClass('bar');
　console.log(this.firstChild.data);
　});
});
948 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 05:10:34.91 ID:q2Zh6d9K.net]: さらにjQuery化

$('#hoge tbody:first-child tr td').each(function() {
　$(this).addClass('bar');
　console.log(this.firstChild.data);
});

もう一つおまけに

$('#hoge tbody:first-child tr td').addClass('bar').each(function() {
　console.log(this.firstChild.data);
});

これをわざわざ変数に入れたくなるかい？ｗ
キャッシュすることも不要だろｗ
949 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 05:14:38.23 ID:q2Zh6d9K.net]: あ、barのままだったｗ
クラスとしてfoo追加するコードを参考してとっておきながら、
新たなjQueryのコードをbarで書いてたから直し忘れた。
950 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 05:23:11.23 ID:q2Zh6d9K.net]: >>931
> 何にしても可読性の為に深部のDOMノードを変数に束縛する必要があると思う

話すり替えるな。いまキャッシュの話だったはずだ。
「早すぎる最適化は諸悪の根源である」って話をしているのに
なんで可読性の話にすり替える？

連想ゲームでもやってるのか？
キャッシュは変数に入れる → 変数に入れるならば、目的は全部同じ

キャッシュのためじゃないだろ。しかもそれはローカル変数ででいいだろ。
「説明用変数の導入」を俺は否定してないんだよ。

むやみにキャッシュのために、広いスコープの変数に入れておくのが
早すぎる最適化だって言ってる。普通はやってはいけない。
どうしても必要なときだけやる。

だから >>898 ができるだけキャッシュするとか言ってるから、
できるかぎりやらないが正しいと訂正してる。それが「早すぎる最適化」だからだ。
> jQueryのセレクタはid以外を指定する場合、検索のコストがかかるから
> できるだけキャッシュしたほうがいいってきいたんだけど、

早すぎる最適化じゃない使い方は最初から否定していない。

それはそれとして、jQueryではメソッドチェーンを使えば、
最適化じゃない「説明用変数」すらも無くせるから
ローカル変数であっても、いったん変数に入れておくことは殆ど無いと言ってる。
951 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 07:46:43.16 ID:XRbWBdK9.net]: >>922
速くするための最適化と
早い段階での最適化を近藤していませんか?
952 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 07:49:03.87 ID:+h4mdsTD.net]: >>916
＞どうせID名が変われば、変数名も変わる。

うそだろ・・・？

仮に100箇所で $('#search_form')してたとして
'#search_form'→'#search_form1'に変えた時に
100箇所直さなくていいように
var $form = $('#search_form'); するんだろ・・・

普通の「固定値」なら100箇所じゃなくても2～3箇所でも使ってるところがあった時点で
変数に入れるだろ
953 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 08:11:20.66 ID:EoA45sOs.net]: 話がキャッシュとか最適化とか保守性とかごっちゃになってるけどさ
複数箇所で使われてる固定値のjQueryオブジェクトなら
広いスコープで変数に入れて(擬似)定数にしといたほうが保守性もいいしキャッシュも効いて一石二鳥だよね？何か問題ある？
↓
でも、それってJSのクロージャの仕組みを考えるとメモリーリークとか危なくね？

ってことでしょ？
実際メモリーリークは起きるの？
954 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 08:35:24.16 ID:FusMkK2d.net]: フロントエンジニアって程度が低いらしいけどここまで酷いの？
955 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 08:37:16.66 ID:86JuHo21.net]: >>936
ローカル変数がキャッシュではないと思ってるのはお前だけ

(1) 関数A、関数Bで要素Cへ1回ずつ参照する
(2) 関数Aで要素Cに2回参照する

(1), (2) の参照コストの総計(2回)は変わらない
関数Aの中でローカル変数を使って要素Cへの参照回数を1回に抑えるのは意味がある
956 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 10:26:05.39 ID:q2Zh6d9K.net]: >>942
> var $form = $('#search_form'); するんだろ・・・

それをやっていいのは、ローカル変数だけだ。
広いスコープで$formとあっても、それがなにか区別付かない。
それは、"保守性を下げる"

今はキャッシュの話をしている。
ローカル変数だとキャッシュとしての効果は
ローカルだけにとどまる。

そしてjQueryを使えばメソッドチェーンが使えるので
ローカルで変数に入れる必要はない。

何度も言ったことだ
957 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 10:27:55.15 ID:q2Zh6d9K.net]: >>941
> 速くするための最適化と
> 早い段階での最適化を近藤していませんか?

速くする最適化でも
軽くする最適化でも
○○する最適化でも

どれも「最適化」だ。

これらの「最適化」を早いうちからするなって言うのが、
「早すぎる最適化は諸悪の根源である」という言葉だ。
958 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 10:29:34.18 ID:q2Zh6d9K.net]: >>945
> ローカル変数がキャッシュではないと思ってるのはお前だけ

ローカル変数がキャッシュではないと言ったことは
一度もない。

jQueryはメソッドチェーンを使えるから、
ローカル変数にキャッシュしないくてよいという話だ。

あとローカル変数ってわかってるか？
別の関数では共有できないぞｗ
959 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 10:31:56.21 ID:q2Zh6d9K.net]: あと、いまはjQueryオブジェクトの話をしている。
$(セレクタ)のコストがかかるから「いったん変数に入れておくキャッシュ」の話だ。
忘れるなよ？別の話にすり替えるな。
960 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 11:12:30.21 ID:hclWowah.net]: キャッシュの結論としてはやらないほうがいいんだろうな
innerHTMLとかinputのvalueとかキャッシュしても
他の場所から実体を書き換えられたら整合性狂うからね
そこまでケアしてあげるとなると費用対効果が合わないと思う
961 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 11:18:11.26 ID:q2Zh6d9K.net]: >>950
> キャッシュの結論としてはやらないほうがいいんだろうな
その通り。

というとどっかの馬鹿が変数に入れるなということなのか！？とか言い出すんだよな（苦笑）
「変数に入れるとキャッシュの効果もありまぁす」じゃねーんだよｗ
楽な方法をとった結果、たまたまそうなる話なんかどうでもいい。

キャッシュを理由に変数に入れておくべきか？とか言ってるから
キャッシュを理由に変数に入れるなんてことは、
「入れるべきもの」ではなく逆に「入れないべきもの」であって
必要になってからやれという話だと言ってるのに。
962 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:03:04.42 ID:oKW2aYRF.net]: 整合性がどうのこーのって、実装の問題だろ。
問題をゴチャゴチャにするなよ。
馬鹿大杉だろ。スレ読む気も起きんが。
963 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:13:36.28 ID:rd5jwdZc.net]: >>950-951
一切更新しない気なのか？
964 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:43:50.40 ID:ATvI0r3K.net]: 誰か病院紹介してやれよ
965 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:49:10.28 ID:HhzhPZLm.net]: お前が行ってる所でいいんじゃないかな
966 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:49:16.18 ID:q2Zh6d9K.net]: >>953
キャッシュを更新しても無駄だぞｗ

だからキャッシュを使わない方がいい。
967 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 12:51:52.14 ID:q2Zh6d9K.net]: >>952
整合性を保つには、シンプルな実装が一番いい。
だから、必要もないのに余計なキャッシュなんか
するべきじゃないって話をしているんだよ。
968 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 13:11:46.29 ID:3KjPC0qs.net]: このスｒ流れが早すぎてなんかの質問をしたから確認に来たんだけど流れが早すぎてどこで質問したか何の質問したか忘れる
969 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 13:26:02.02 ID:XOGjEe4x.net]: >>948
> ローカル変数がキャッシュではないと言ったことは一度もない。
おまえが>>936で「"ローカル" 変数に入れることで見やすくすることはキャッシュとは別の話だって言ったよね？」といったことに対してキャッシュとして機能する事例(>>945)で反論しただけ
日本語が読めない人の相手は本当に疲れるな
970 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 13:29:04.39 ID:XOGjEe4x.net]: >>947
> これらの「最適化」を早いうちからするなって言うのが、
> 「早すぎる最適化は諸悪の根源である」という言葉だ。
その通りだが、逆に言えば最後に最適化してもいいので、それは最適化テクニックを否定する格言ではない

Charles Cook は「時期尚早な最適化」と称しているが、「しかし逆にシステムレベルのソフトウェアを設計するときは、性能問題を常に念頭に置くべきだ」ともいっている
jquery.jsやjQuery pluginはそれに近い立場にあるので常に最適化に気をつかうべきだろう
971 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 13:51:27.17 ID:XRbWBdK9.net]: プログラム全体の処理速度に大きく影響するレベルの本格的な最適化の話と、ちょっとしたローカル変数に値を代入する話をごちゃ混ぜにしているのがおかしいだろ。クヌース先生も呆れている。
972 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:02:20.57 ID:XOGjEe4x.net]: >>937-939
ドヤ顔で披露した割には最後のコードも問題があるな

> $('#hoge tbody:first-child tr td').addClass('bar').each(function() {
> 　console.log(this.firstChild.data);
> });
子孫セレクタを使っているのでコストが重く、ネストされたtable要素でおかしくなる
addClass, each で二重走査してるのが無駄
forEach 系で実装可能なのは改めて教えてもらわずとも分かっている
繰り返し処理するのにわざわざ関数呼び出しするのが煩わしいだけ

>>940
説明用変数はキャッシュとしても機能するので同じ事
そもそも、俺は説明用の為だけに変数を定義することはしない
同じオブジェクトを2回以上参照するから変数を定義するだけだ
それはキャッシュでもあり、説明用変数でもある
人間は document.getElementById('hoge').tBodies[0].rows[i].cells[j]; のような長い名前を何度も見て同じものと即座に認識することは出来ない
これが1回だけ参照するなら変数にはしない
2回以上登場するから同じ名前を何度も読まなくて済むように、同じオブジェクトを何度も参照しなくてすむように変数を定義する
973 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:16:15.05 ID:+6m5wOVw.net]: ＩＤコロコロするやつのレスなんて信憑性0
974 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:16:40.41 ID:q2Zh6d9K.net]: >>959
> おまえが>>936で「"ローカル" 変数に入れることで見やすくすることはキャッシュとは別の話だって
> 言ったよね？」といったことに対してキャッシュとして機能する事例(>>945)で反論しただけ

だから、それをするなって>>951で書いたんだよｗ

> というとどっかの馬鹿が変数に入れるなということなのか！？とか言い出すんだよな（苦笑）
> 「変数に入れるとキャッシュの効果もありまぁす」じゃねーんだよｗ
> 楽な方法をとった結果、たまたまそうなる話なんかどうでもいい。

やっぱりという感想しかねーよｗ

最初の>>898の話は「検索コストがかかるという理由で変数に入れたほうがいいですか？」だ。

スタート地点は「変数に入れない状態」その状態から初めて「検索コスト」だけを理由に
「変数に入れたほうがいいか」って質問だろ。
だからそれはやるなって俺は言ってるんだが、

お前の反論（？）は、（別の理由で）「変数に入れた状態」から初めて
「キャッシュの効果もありまぁす」じゃねーかｗ
全く議論になってないんだよ。
975 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:18:39.39 ID:q2Zh6d9K.net]: >>962
> 子孫セレクタを使っているのでコストが重く、ネストされたtable要素でおかしくなる

ネストされた～は単に > を付け忘れただけ。

で、いきなりコストの話をすんな。
「早すぎる最適化は諸悪の根源」だ。

それで問題がある場合に限って、最適化すればいいだろ。
HTMLが十分にシンプルであれば、コストが重いといっても
この程度じゃ1回あたり10nsも差は出ないから。
976 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:21:45.75 ID:q2Zh6d9K.net]: >>960
> Charles Cook は「時期尚早な最適化」と称しているが、「しかし逆にシステムレベルのソフトウェアを設計するときは、性能問題を常に念頭に置くべきだ」ともいっている

念頭に置くのと、実際に行動するのは別の話。
この2つを区別できてないやつが多いんだよなｗ

念頭に置いて、問題なるんじゃね？って思って最初から最適化してしまうのが
「時期尚早な最適化」

念頭に置いた上で、問題が起きてから改善すればいい話だと俺は言ってる。
977 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 14:40:58.65 ID:q2Zh6d9K.net]: 少し言葉が足りなかったら補足。

念頭に置いた上で、問題が起きてから改善すればいい話だと俺は言ってる。

ここで、念頭に置くというのは、問題が起きてから改善すればいいが
その改善がしづらくなるような設計にはしないということ。

あとから簡単に問題を改善できることならば、
あとから問題を改善すればいい話。

念頭に置くというのは、最初に改善してしまうのではなくて、
改善しにくい方向にはしないということ。
978 名前：デフォルトの名無しさん [2016/05/21(土) 15:33:15.09 ID:gfKVobxg.net]: src属性の特定の数字を取得した後そのリンクを自動でクリックさせるuserjsを書きたいのですがどう記述して良いのかさっぱりわかりません。
979 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 16:34:58.52 ID:FusMkK2d.net]: じゃ諦めましょ
980 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 16:35:02.87 ID:KBCgSbCY.net]: >>968
取得はドム原理主義者得意の引っこ抜き。
発火タイミングはカーソルクリックや当たったら。
読み込み後発動発火。
スクロールで表示されたら発火(その場合、表示中の現在位置を取得が必要)
981 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 16:39:21.48 ID:qqwYRUOU.net]: >>968
どういう事？contentに探したいものを含むaタグに、clickイベントを発火させればいいのでは？

キャッシュ論が続いているから思うけど、なるほどnodeのスレでjs使いがバカにされる訳だな。
domアクセスを最低限にしたいからキャッシュさせるさせない、セレクタの結果を保持するってその発想自体気が触れてる。
だから、変数とpost内容の不一致とかわけわからん類の障害出すんだろ。
中身になるべきものを持っといて、全部jsで書け。初期コンテンツだけ置いとけ。readyでもいで差し替えろ。
そうすりゃ差分なんか自分が知ってるんだから、どう更新すべきか自明だろ。
982 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 17:02:31.50 ID:q2Zh6d9K.net]: > 中身になるべきものを持っといて、全部jsで書け。初期コンテンツだけ置いとけ。readyでもいで差し替えろ。
> そうすりゃ差分なんか自分が知ってるんだから、どう更新すべきか自明だろ。

その説明じゃ誰にも通じないだろうなｗ
全部jsで書けとか言ってるから、逆に面倒になってるだけだろう。
983 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 18:57:20.03 ID:qpbh63BA.net]: >>964
するな、はおまえの勝手な持論
DOMのキャッシュだけで「最適化が時期早々」の結論に持って行く流れがおかしい
必要なタイミングで最適化すれば問題はないのだから
そして、その時に様々な最適化の手法を知っているべきであって「早すぎる最適化」を理由に最適化テクニックを覚える機会を失うのは本末転倒
タイミングは重要だが、テクニックとしては知っておくべき

>>965
おまえは何かといえば「早すぎる最適化」しかいわないな
それはミスした時の言い訳に使われるものじゃないぞ
コストよりもセレクタが正しく機能しない事の方がに問題
984 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 22:48:21.57 ID:q2Zh6d9K.net]: >>973
> コストよりもセレクタが正しく機能しない事の方がに問題

だからそう言ってるだろ。

問題になってない検索コストのために最適化することで
セレクタが正しく機能しない（可能性がある）

正しく機能させるために追加で考えなくちゃいけなくなるので
早すぎる最適化は何も良いことがない。
985 名前：デフォルトの名無しさん mailto:sage [2016/05/21(土) 22:53:03.77 ID:q2Zh6d9K.net]: >>973
> 必要なタイミングで最適化すれば問題はないのだから

だからそう言ってるだろ。

> jQueryのセレクタはid以外を指定する場合、検索のコストがかかるから
> できるだけキャッシュしたほうがいいってきいたんだけど、

とか言ってるから、それは必要なタイミングで最適化するべきことであって
通常は、できるだけキャッシュなんてことをする必要はない。と言ってる。

誰も変数に入れることが最適化のテクニックじゃないとか言ってない。
これを「最適化のテクニックなんだ。ほー。知らなかったー」とか思ってるのはお前だけ。

こっちも元レス人も最適化のテクニックだと知った上で、
元レスの人「できるだけやったほうが良い？」
俺「できるだけやらないほうが良い」

という会話をしてる。

お前は議論の内容から数歩遅れてるんだよｗ
986 名前：デフォルトの名無しさん [2016/05/22(日) 07:40:36.92 ID:LUJui5ls.net]: 初心者ですが、ためしにある.jsファイルとか
書いてみて、動作確認しようにも連携するファイルがまだできていないので、本当にできているのかいないのか、検討もつきません。
１つ目のファイルが動作確認で動くのかもわからないまま、他の連携ファイルを書くことは疑心暗鬼が増大しすぎて出来なくなってしまいます。
自分が書いたJavaScriptは動くのかを確認する方法がありましたら教えてください。
987 名前：NAS6 ◆n3AmnVhjwc [2016/05/22(日) 08:35:04.93 ID:KRZX8LQR.net]: 検証用のテストコードを作ればいいのに、なんでそうしないの？
988 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 08:57:55.90 ID:JfPxy53K.net]: >>974
> 問題になってない検索コストのために最適化することで
> セレクタが正しく機能しない（可能性がある）
おまえが>>938セレクタの問題点を何も理解してないことはわかったのでもういい
989 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 11:41:58.58 ID:Tdpnvle1.net]: >>974
> これを「最適化のテクニックなんだ。ほー。知らなかったー」とか思ってるのはお前だけ。
おまえは読解力を身に着けた方がいいんじゃね？

> 元レスの人「できるだけやったほうが良い？」
> 俺「できるだけやらないほうが良い」
アホか
「必要なタイミングで最適化した方がいい」が正だろ
やるかやらないかはその時に判断するもので「やらない」の結論を出すのは時期早々なんだよ
「早すぎる最適化」を持ち出してその結論なるんじゃ、おまえは「早すぎる最適化」の何を理解したんだ？といわれても仕方ないぞ
990 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 11:42:40.25 ID:7nFY/y9y.net]: そろそろ死ねよクソカス
991 名前：デフォルトの名無しさん [2016/05/22(日) 12:12:36.77 ID:+7XP2PmG.net]: >>977
検証用テストコードの存在を知らなかったからです。
少しくぐってみます。ありがとう。
992 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 12:32:37.42 ID:WwOYSBmy.net]: >>979
はぁ？

お前日本語読解力ないなｗ

できる限りやったほうが良い。の問いにYESって答えたら
できるかぎりやってしまうだろｗ
だからNOだよ。やらないほうが良い。

で、お前は反論するの？
しないなら黙ってろよｗ
993 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 12:34:37.15 ID:WwOYSBmy.net]: > やるかやらないかはその時に判断するもので「やらない」の結論を出すのは時期早々なんだよ

結論出さなくても、どちらかを書かないといけないだろｗ

結論が出てない状態なら、最適化をやらない方を選べって言ってるんだよ。
早すぎる最適化は諸悪の根源だからだ。
994 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 12:48:36.51 ID:XAOP4iva.net]: 無駄に長文はkenokabeを彷彿とさせるからﾔﾒﾛ
995 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 12:53:36.96 ID:CHy0uo/r.net]: NG突っ込んどけ
996 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 16:25:24.06 ID:5k8BO1OF.net]: >>976-977
スタブのような、テストに都合のよい、返り値を返す関数を作る

関数から、10が返ってきたと想定する
a = 10;

ここで、テストでa、つまり10を使う

JSにも、JavaのJUnitみたいな、テスティング・フレームワークがあるのでは？
997 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 16:43:20.80 ID:X0ga1YPw.net]: 「早すぎる最適化」は初めから全ての最適化を施すと保守性が著しく落ちるから何よりも先にプロトタイプを完成させた後にボトルネックとなるコードを探して最適化しましょう、という理論。
一般的には速度よりも厳密性、堅牢性、安全性、前方互換性、後方互換性あたりがより重要視されるからね。
ただし、これは保守性が下がらなければ最適化を施してもいいという事でもある。
代表的なのでは array.length を変数にキャッシュするテクニックがあるね。
ループ回数が10万回とか、著しく大きな回数参照される場合に大きな速度差として現れる。
>>945は参照回数の重要性を諭してくれているけど、ようするにローカル変数かグローバル変数かはどうでもよくて参照回数が多いところを最適化すべきなんだよね。
ボトルネックが初めから経験的についてわかっていれば、「早すぎる最適化」理論のタイミングを待たずして最適化を施すことも出来る。
結論としては>>898への答えは「経験的にボトルネックと分かる場所には即座について最適化しましょう。そうでなければ、プロトタイプを作ってからボトルネックを探しましょう。」

蛇足だけど、厳密性を上げることで結果的に速度的な最適化が施される場合もあって>>962のセレクタの指摘がそれ。
'#hoge>tbody:first-child>tr>td' を指定する事で>>927と等価になり、>>938では別の要素を拾ってしまう危険性がある。
厳密性を上げることで保守性が下がるわけでもなし、修正すべき箇所だと思うよ。
998 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 17:36:54.53 ID:FTGg1fS8.net]: 一昨日から蛇足続きですけどそれは…
999 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 17:45:35.33 ID:Y6WruITb.net]: array.lengthを変数に入れるなんて言うのは最適化のテクニックなのか？
誰でもやるぞ。
1000 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 17:53:12.31 ID:tpad688i.net]: すごーいつづきはぜひぶろぐかなんかひらいてかいたほうがみんなみられていいとおもうー();
1001 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:09:24.31 ID:WwOYSBmy.net]: >>987

> 結論としては>>898への答えは「経験的にボトルネックと分かる場所には即座について最適化しましょう。
> そうでなければ、プロトタイプを作ってからボトルネックを探しましょう。」

何汎用的な話にしてるんだよｗわざとらしいな。今はjQueryのセレクタの話だろ。

>>898の話は経験的にボトルネックと成りえない場所だから、
それを「できるだけキャッシュしたほうがいい」と言ってることに対して
経験的にボトルネックにならないから「できるだけしないほうがいい」と言ってるんだが。
1002 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:11:58.37 ID:WwOYSBmy.net]: >>989
今はarray.lengthの話はしてない
1003 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:14:27.64 ID:BAs222Jl.net]: うるせーから埋める
1004 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:15:11.70 ID:E7LBxgcJ.net]: あ
1005 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:15:40.12 ID:nPHdXwiF.net]: あ
1006 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:15:56.89 ID:0PCmMNra.net]: あ
1007 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:16:13.55 ID:5hn9uytB.net]: あ
1008 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:16:30.05 ID:2Z+XxbZ+.net]: あ
1009 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:16:46.61 ID:ax9WOfgG.net]: あ
1010 名前：デフォルトの名無しさん mailto:sage [2016/05/22(日) 18:17:03.03 ID:yL49bMPd.net]: あ
1011 名前：1001 [Over 1000 Thread.net]: このスレッドは１０００を超えました。
もう書けないので、新しいスレッドを立ててくださいです。。。
life time: 74日 17時間 18分 27秒
1012 名前：1002 [Over 1000 Thread.net]: ２ちゃんねるの運営はプレミアム会員の皆さまに支えられています。
運営にご協力お願いいたします。

───────────────────
《プレミアム会員の主な特典》
★ ２ちゃんねる専用ブラウザからの広告除去
★ ２ちゃんねるの過去ログを取得
★ 書き込み規制の緩和
───────────────────

会員登録には個人情報は一切必要ありません。
月300円から匿名でご購入いただけます。

▼ プレミアム会員登録はこちら ▼
premium.2ch.net/
pink-chan-store.myshopify.com/
1013 名前：過去ログ ★ [[過去ログ]]: ■ このスレッドは過去ログ倉庫に格納されています

[ 新着レスの取得/表示 (agate) ] / [ 携帯版 ]

read.cgi ver5.27 [feat.BBS2 +1.6] / e.0.2 (02/09/03) / eucaly.net products.
担当:undef