16/05/12 00:54:32.46 8vh2YrlZ.net
>>682
適材適所が出来ない無能だからこそ
何かと理由を付けてキャパシティの低さをカバーするのよ
694:デフォルトの名無しさん
16/05/12 01:36:10.90 WDa8o6L5.net
jQueryの勉強がめんどいって誰も主張してなかったと思うけど、何かと理由をつけて反論したいのね
695:デフォルトの名無しさん
16/05/12 01:59:28.76 9Y0usIRW.net
jqueryをちょっと練習してます。
サイトを見たんですが、なぜクロージャで実行するのでしょうか？
function内だけを実行しても同じ挙動に見えます。
$(function(){
$("#text1").css('color','red');
});
$にfunctionを渡すとどうなるのでしょうか？
696:デフォルトの名無しさん
16/05/12 02:36:00.78 WDa8o6L5.net
>>688
下記コードとほぼ等価
document.addEventListener('DOMContentLoaded', function () {
$("#text1").css('color','red');
}.bind(this, jQuery), false);
697:デフォルトの名無しさん
16/05/12 02:39:56.36 Xc9f48N7.net
やっぱりjQueryを使わないと長くなるなｗ
698:デフォルトの名無しさん
16/05/12 02:43:56.98 Xc9f48N7.net
>>685
Reactは高品質な（準）標準UIコンポーネントが作られれば普及すると思うよ。
そういう世の中になったら、jQueryを嫌がるのと同じように
○○コンポーネントは使うな自作しろとか言うやつが出てきそうだけどｗ
で、UIコンポーネントが出来た後は、ウェブアプリをポトペタで作れるようになって、
そしてUIコンポーネント同士を連携させるのにjQueryがやっぱり便利じゃね？って
言われるようになる。
699:デフォルトの名無しさん
16/05/12 08:01:45.83 RFqkT9TF.net
>>691
標準コンポーネント要らなくない？reactなら。
ポトペタでコンポーネントを置いて、結局コンポーネント間の操作をjQueryでやるのはまず破綻すると思うが。
良きひとつの別解としてでもDOMから離れて行くと思うよ。
操作したいのはDOMではなく、コンポーネントだからね。
今までは、DOM≒コンポーネントだっただけで。
700:デフォルトの名無しさん
16/05/12 08:12:03.13 ffZfaRCN.net
jQuery以外を知らず井の中の蛙となってる奴に何言っても無駄。
皆が新設でこれだけ教えてあげようとしてるのにムキになるだけだしどうしようもないクズだね。
701:デフォルトの名無しさん
16/05/12 09:11:36.25 VZ0ffw6x.net
蛙に失礼だろ
702:デフォルトの名無しさん
16/05/12 09:16:41.78 6wLBo9DQ.net
とりあえず今からjs始めようとするのにjQueryを触るのはなしだってことだよね。
703:デフォルトの名無しさん
16/05/12 09:29:20.27 pPHDojvh.net
「JS」を始めようとするのには無し
でもWebデザイン中心の入門としては学習資産があるからね
704:デフォルトの名無しさん
16/05/12 09:30:41.67 Xc9f48N7.net
>>695
DOM APIを触らないのであればそのとおりだけど。
DOM APIを沢山触るのであれば、
それをjQueryに置き換えると遥かに効率が上がる。
705:デフォルトの名無しさん
16/05/12 09:37:11.92 cWhHAzov.net
そりゃJavaを始めるのに面倒だからScalaで書いて呼び出すみたいなもの
いつかは触らないといけないのなら最初からDOMを勉強した方がいい
この先月に１回未満くらいしかJSをに触れる必要が無いのなら選択肢としてあり得る
706:デフォルトの名無しさん
16/05/12 09:52:19.65 lQiQw1tJ.net
必要なら$(elem)[0]を参照すれば済む
707:デフォルトの名無しさん
16/05/12 10:09:14.52 cWhHAzov.net
id振ってりゃその名前で直にアクセスできるけどね
708:デフォルトの名無しさん
16/05/12 10:15:36.21 RFqkT9TF.net
ID振るとか正気かわからん。
ページで、一意にしなきゃならんのだぞ。
「コントロールの中に幾つかのコントロールがある」コントロールを幾つか置いたらもう考えるのが面倒くさいし、状態変数(サーバで持ってるかクライアントで持ってるかに関わらず)との乖離が酷くなっていくじゃん。
709:デフォルトの名無しさん
16/05/12 10:30:08.78 cWhHAzov.net
それこそjQueryで扱う状況じゃないな
別にjQueryは抽象的だとか相対的な関係を扱うのに長けてるわけでもなく、
ただ「短く書ける」程度のものなのだから、
標準DOM APIで困難でフレームワークを使うような必要性が有るときは
それはjQueryにだって不向きな場面であるのは自明
jQueryの様々な付加価値、AnimationとかFetchとかPromiseも時代遅れの仕様だし
最早document.querySelectorAllを$と短く書ける以上のシロモノじゃない
いかに中途半端で役に立たないシロモノか分かったね？
710:デフォルトの名無しさん
16/05/12 10:33:36.37 gnZrQsyk.net
>>701
jQueryだって平に見て何かをする以上のことはできない。
ShadowDOMとか使ってコンポーネント化したり高度なこととは折り合いがつかない。
711:デフォルトの名無しさん
16/05/12 12:22:57.19 8PwOpBF8.net
だから相手すんなっての
lodashの啓蒙（）で延々と荒らされた状態から何も進歩してねえ
712:デフォルトの名無しさん
16/05/12 12:49:57.46 RFqkT9TF.net
>>703
だから、jQueryでID指定でどうのとか、DOMapiでとかそういう発想じゃなくて、
ちゃんとコンポーネントとして考えようねって話だよ。
713:デフォルトの名無しさん
16/05/12 13:39:59.81 zeyNygYO.net
enchant.js 用のマップエディタを、jQuery UI で作って、公開している人がいる
jQueryは、ちょっとしたアプリにはいい。
こんなのDOMでは、面倒くさくて作れない
714:デフォルトの名無しさん
16/05/12 14:33:59.41 QFbK3hrX.net
jQuery MobileとjQuery UIはjQueryとは別物
一緒に語るな
715:デフォルトの名無しさん
16/05/12 16:19:45.56 iX4T91tZ.net
SPAを作るのに、SPA用FWを使いたいのですが、JQUIも使いたいです
組み合わせて使うのは、可能でしょうか？また、一般的な方法でしょうか？
716:デフォルトの名無しさん
16/05/12 16:46:03.41 RFqkT9TF.net
>>708
SPA用フレームワークが何かによる
717:デフォルトの名無しさん
16/05/12 16:56:38.45 iX4T91tZ.net
>>709
迷っているところです
VuaやAngular2などがあるみたいですが、おすすめはありますか？
718:デフォルトの名無しさん
16/05/12 16:59:58.81 3OjnTRaH.net
>>708
spaって何よ？
719:デフォルトの名無しさん
16/05/12 17:03:19.84 iX4T91tZ.net
>>711
シングルページアプリケーション
720:デフォルトの名無しさん
16/05/12 17:37:38.25 RFqkT9TF.net
>>710
vue.js使ってるけど、今までで一番感動した。
今はjQuery一切使ってないよ。
viewとモデルに専念してくれるから、あんまりお作法とか無いし。
721:デフォルトの名無しさん
16/05/12 17:46:16.47 iX4T91tZ.net
>>713
Angular2は複雑みたいですね
vue.jsの方が覚えやすいですかね？
722:デフォルトの名無しさん
16/05/12 17:49:42.18 aiv+0stS.net
>>693
jQueryは三下のやるゴッコだから許してやれ
723:デフォルトの名無しさん
16/05/12 18:23:11.34 gjMSeNc+.net
>>714
ライブラリ(フレームワーク)の選び方
コミュニティの大きい方
rc版とか論外
vueもag2も無い
724:デフォルトの名無しさん
16/05/12 18:42:57.19 iX4T91tZ.net
>>716
バインド以外使いたい機能特にないんですが、vueじゃ駄目ですかね？
UIはJQUIで作る予定ですが
725:デフォルトの名無しさん
16/05/12 19:53:00.09 RFqkT9TF.net
>>714
覚えやすいよ。
>>716
もうstable何度も出てるよ。トップページのボタン見て思ったんだろうけど。
コミュニティは大きいに越したことは無いけど。
>>717
UIは何でjQuery UI使うの？
アニメーションとかの為なら、vueでも出来るよ。
それこそバインドしておけば勝手に。
726:デフォルトの名無しさん
16/05/12 20:08:26.12 BZDGS6so.net
非同期な関数A、B、Cがあったとして
Aを実行、callbackでエラーと結果を受け取る
エラーなら終了
Aの結果がまずけりゃBを実行、cal（ｒｙ
エラーなら終了
その後Cを実行
Aの結果がまずくなけりゃそのままCを実行
なんて流れで書きたいときCを実行するコード2回書かなきゃいかんの
それとも超クールな書き方あるの
727:デフォルトの名無しさん
16/05/12 20:09:48.05 iX4T91tZ.net
>>718
タブとダイアログを使いんですが、自分で実装出来ますかね？
728:デフォルトの名無しさん
16/05/12 20:58:00.22 bBgG4/I/.net
idすら一意に管理できないようなのはエンジニアやめたほうがいい
729:デフォルトの名無しさん
16/05/12 21:03:34.87 RFqkT9TF.net
>>720
タブは瞬殺。
チェックボックスの状態と、タブページのdisplayをバインドするだけ。
チェックボックスはcssでタブ耳みたいにしておく。
(チェックボックス自体は見えなくして、label forにスタイル当てるととても楽)
ダイアログもほぼ瞬殺。ダイアログの中身はslotで書いとけばいい。
背景を暗くするためのdivと、その上に置くdivのdisplayを、ダイアログメッセージ!=""にバインドしとけば、
ダイアログメッセージに文字列入れるだけ。
730:デフォルトの名無しさん
16/05/12 21:09:40.37 8TSCgVOi.net
>>719
超クールに書けますよ。そうJQueryならね
731:デフォルトの名無しさん
16/05/12 21:19:35.09 BZDGS6so.net
>>723
いやマジで
ぜんっぜんわかんねえ
promiseも細かい分岐書こうとしたらなんかresolve地獄になった
732:デフォルトの名無しさん
16/05/12 21:26:53.32 hY0jzmnf.net
>>711
まだこんなのがいるんだな
733:デフォルトの名無しさん
16/05/12 22:06:37.95 5wVtNAV4.net
インスタント麺だろ
知ってるよ
734:デフォルトの名無しさん
16/05/12 22:33:10.83 RFqkT9TF.net
p=new Promise(function(res,rej){res()});
p.then(a).
.catch(b)
.then(c)
.then(/*全部終わった*/)
.catch(/*cで死んだ*/)
ではいかん理由があるのだろうか。
735:デフォルトの名無しさん
16/05/12 22:34:03.31 lH3ZGyQp.net
たらこがない
736:デフォルトの名無しさん
16/05/12 22:34:57.59 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:デフォルトの名無しさん
16/05/12 22:36:45.62 Xc9f48N7.net
>>725
> まだこんなのがいるんだな
そりゃそうだろｗ
例えばWordPressのようなブログサイトをSPAで作るとかありえない。
用途で使うものは変わってくるんだよ。
ネイティブアプリのようなウェアプリを作るならば、フレームワーク（DOM APIは使わない）
ブログのようなウェブサイトを作るならば、jQuery（DOM APIは使わない）
738:デフォルトの名無しさん
16/05/12 22:38:32.41 Xc9f48N7.net
>>723
> 超クールに書けますよ。そうJQueryならね
言葉が足りない。
超クールに書けますよ。そうJQueryならね。
なぜなら、Promiseに近い仕様のDeferredを持っているから。
そしてjQuery 3.0からはDeferredはPromiseと互換性があるものになる。
739:デフォルトの名無しさん
16/05/12 22:39:13.51 HUbJz6nz.net
カルボナーラもないじゃないじゃないか
740:デフォルトの名無しさん
16/05/12 22:39:52.59 GBRI772U.net
ありえなくは無いだろ
モバイルサイトでは一時期流行ったし
741:デフォルトの名無しさん
16/05/12 22:41:31.51 46WAWDCU.net
>>729
気でも狂ってるのか、文盲なのか。
明示的にDOMを触るんじゃなくて、DOMのいじりはフレームワークに任せるんだよ。
お前もしかして、jQueryしか知らないんじゃないか？
742:デフォルトの名無しさん
16/05/12 22:41:59.44 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:デフォルトの名無しさん
16/05/12 22:42:27.84 46WAWDCU.net
だいたいコンポーネントとコンポーネントを繋ぐものとかねえよ。
「コンポーネントとコンポーネントを内包した」コンポーネントでしかない。
744:デフォルトの名無しさん
16/05/12 22:44:09.19 Xc9f48N7.net
>>734
> 明示的にDOMを触るんじゃなくて、DOMのいじりはフレームワークに任せるんだよ。
明示的にDOMを触るんじゃなくて、DOMのいじりはjQueryに任せるんだよ。
だからこういうことだろ？
フレームワーク VS jQuery
DOM APIは（直接）使わない。（どちらも内部で使うのは当たり前）
あとは作るものが、開発コストが高いフレームワークを
導入するレベルものかどうかで、フレームワーク か jQuery かを
選べば良い。
745:デフォルトの名無しさん
16/05/12 22:48:09.87 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:デフォルトの名無しさん
16/05/12 22:49:25.89 46WAWDCU.net
>>737
そりゃ、明示的にDOMをいじってるんだよ。
vsじゃない。
ハサミとカッターナイフみたいなもん。
開発工数以外に、保守工数も考えて喋れよ…
747:デフォルトの名無しさん
16/05/12 22:50:04.64 Xc9f48N7.net
>>736
HTMLはそもそも文書を書くものなわけで。
例えば論文だと思えばいいよ。
第一章、第二章、第一節、第二節なんてがあるような。
そういう論文形式のウェブページをコンポーネントにするのがおかしい。
論文ページコンポーネントがあって、一章コンポーネントがあって
その中に一節コンポーネント、二節コンポーネントがあるとかやる気かねｗ
ネットはこのような論文やブログ形式のサイトが多いわけで
そういったページをSPAにしたりフレームワークを導入するのは
目的に対して使う道具が間違ってる。
そういうサイトにはフレームワークではなくjQueryが適している。
748:デフォルトの名無しさん
16/05/12 22:50:33.86 46WAWDCU.net
>>738
思いっきり間違えた。radioだな。
749:デフォルトの名無しさん
16/05/12 22:51:14.28 Xc9f48N7.net
>>739
> 開発工数以外に、保守工数も考えて喋れよ…
論文サイトの保守工数って何？
HTMLの修正がメインなんだけどｗ
750:デフォルトの名無しさん
16/05/12 22:53:36.72 3OjnTRaH.net
>>712
業界ではそう訳すのが普通なのか。
751:デフォルトの名無しさん
16/05/12 22:54:07.93 46WAWDCU.net
>>740
写真と、図のキャプションは、まとめて、「figure 1」だよな。
figureなんとかの塊と、文字と、グラフで出来たものが、節であり、節が集まり章になり、論文になるでしょ。
第二節コンポーネントとか筋悪すぎるだろ。さすがjQuery使いだとしか思えん。
節コンポーネント。
節コンポーネントの配列を持つものが、章コンポーネント。
お前アホだろ。
752:デフォルトの名無しさん
16/05/12 22:55:09.86 3OjnTRaH.net
>>719
cを関数で書けよ
753:デフォルトの名無しさん
16/05/12 22:56:13.29 3OjnTRaH.net
>>725
いるよ。何か？
754:デフォルトの名無しさん
16/05/12 22:56:21.38 46WAWDCU.net
>>742
htmlの修正というより、お前テンプレートエンジンすら使えないんじゃないのか？
一旦稼働したらそのへんはDBから取るだろ。常識的に考えて。
節コンポーネントとか出てくる時点で、手書きなんだろうな、その辺の処理がベタで。
755:デフォルトの名無しさん
16/05/12 22:58:50.06 Xc9f48N7.net
>>738
そんだけなわけないだろｗ ↓これでいいかい？
URLﾘﾝｸ(www.webopixel.net)
タブで切り替えるやつ。表示するデータは外部から持ってくるのを想定してタブ切り替え的なやつ。
<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:デフォルトの名無しさん
16/05/12 23:00:29.80 Xc9f48N7.net
>>747
今保守工数の話だったよね？
保守するのはDBの中身？
DBから何を取るの？文書データ？
JavaScript関係ない話してるの？ｗ
758:デフォルトの名無しさん
16/05/12 23:03:22.74 iX4T91tZ.net
>>743
学生プログラマだから業界はよく分からん
759:デフォルトの名無しさん
16/05/12 23:05:07.78 Xc9f48N7.net
>>744
はぁ？ 俺は論文的なサイトにおいて、
コンポーネントはページの中の一部に入れるもので、
コンポーネントを内包している外側は、コンポーネントに
はならないって話をしてるんだが？
それなのに>>736が
> だいたいコンポーネントとコンポーネントを繋ぐものとかねえよ。
> 「コンポーネントとコンポーネントを内包した」コンポーネントでしかない。
とかいい出したんだろｗ
俺の話に流れを戻すと、コンポーネントとコンポーネントを繋ぐものが必要になる。
それがjQuery。
760:デフォルトの名無しさん
16/05/12 23:08:45.56 46WAWDCU.net
>>748
お前がjQuery脳だとよくわかったわ。
なぜ、状態を持たないliの、さらにクリックのイベントでそんなことするのかいよいよ頭おかしい。
キーボード操作したいって要件増えたらどうよ。
>>751
外側触らないきゃいかんのは、外側含めてコンポーネントだろ。
俺ならサーバサイドでレンダリングするわ。
に
761:デフォルトの名無しさん
16/05/12 23:09:13.47 46WAWDCU.net
付き合いきれんわ。
762:デフォルトの名無しさん
16/05/12 23:12:24.76 iX4T91tZ.net
結局どうすれば…
とりあえずJQ使わずに頑張ってみます
763:デフォルトの名無しさん
16/05/12 23:19:13.17 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:デフォルトの名無しさん
16/05/12 23:20:20.56 Xc9f48N7.net
>>752
> 俺ならサーバサイドでレンダリングするわ。
なにを？ コンポーネントを？
それともコンポーネントじゃないものを
外側にするの？ｗ
765:デフォルトの名無しさん
16/05/12 23:21:16.10 BZDGS6so.net
>>727
例が簡単すぎたかもしれないが
ていうかそれじゃ
Aが終わってからA結果NGならB、Bが終わってからCキックしなきゃいかんのに
BとCと非同期で並列に動いちゃわないか？
766:デフォルトの名無しさん
16/05/12 23:49:27.30 46WAWDCU.net
jQueryでもDOMapiでもなんでも良いが、それこそ論文やなんやの文書構造を、無意味な汎用タブで破壊してるんだけどな。
コンポーネントでも、外側でも、必要に応じて順番に書いたり更新すりゃいいっしょ。
ある要素のinnerHTMLを差し替える以外の動きをするDOMいじり自体が邪道だと何故思えないんだろう。
要素、の意味も伝わらんだろうけど。
>>757
catchが解決してから、次のthenだよ。
767:デフォルトの名無しさん
16/05/13 00:04:02.10 reYF/fvv.net
>>722
ダイアログ用のコンポーネントを用意するっ事ですよね？
768:デフォルトの名無しさん
16/05/13 00:05:04.57 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:デフォルトの名無しさん
16/05/13 00:06:44.46 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:デフォルトの名無しさん
16/05/13 00:43:14.48 lm16bc2e.net
仕様を理解してないだけ
resolveやrejectを呼び出すまで始まらないのは
最初のPromiseコンストラクタにコールバック関数渡した時のみ
後のthen節やcatch節ではPromiseを返さないかぎり即座に解決され進む
771:デフォルトの名無しさん
16/05/13 00:45:15.67 lm16bc2e.net
あとそもそもおかしい部分があるな
772:デフォルトの名無しさん
16/05/13 00:46:03.97 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:デフォルトの名無しさん
16/05/13 01:00:51.12 lm16bc2e.net
まあ色々パターンは有る。
チェーン内で１つ１つプロミスを作って、外部関数はコールバックベースというのが１つ。
でもそれよりも良いのが、外部関数がプロミスを返すようにすること。
そうすると特にメイン部分のコードはこんなにシンプルになる。
function mainScript( callback ){
return sampleA().catch( sampleB ).then( sampleC )
}
mainScript( ).then( function ( result ) {
console.log( result );
}, function ( err ) {
console.log( err );
});
774:デフォルトの名無しさん
16/05/13 01:01:24.73 9UaBp3bW.net
>>763-764
ああ、だいたい合ってたみたいでよかったが
>後のthen節やcatch節ではPromiseを返さないかぎり即座に解決され進む
これわかんないんだけど、p.then().then().catch()でpがrejectだった時
途中のthenはスルーして後続に渡してるってことか？
775:デフォルトの名無しさん
16/05/13 01:01:24.85 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:デフォルトの名無しさん
16/05/13 01:04:41.92 lm16bc2e.net
>>766
今言葉で何をどう言ったらいいのか分からないが
コードを見て感じてくれ
777:デフォルトの名無しさん
16/05/13 01:14:47.49 72dbC0n+.net
>>766
横レスだけど恐らく
コンストラクタに渡したcallbackは渡される引数1,2を実行するまで進まないが
then,catchに渡したcallbackはそれの返り値がpromiseでない場合は
Promise.resolve(返り値)と同等になるってことだよ
自分で書いててもわかりづらいな！
Promiseの本でググると親切丁寧な解説サイトが出てくるからオススメ
778:デフォルトの名無しさん
16/05/13 01:15:38.97 UiJwdC85.net
■OS/ブラウザ
MacOSX/google chrome
■やりたいこと
chart.jsを使ってcsvからグラフを作りたい
■問題点
公式サイトの最初のサンプルコードがまず動かない
■エラー表示
Chart.bundle.js:9562 Uncaught TypeError: Cannot read property 'width' of undefined
■HTMLコード
URLﾘﾝｸ(codepad.org)
■JavaScriptコード
URLﾘﾝｸ(codepad.org)
chart.jsを使ってcsvのデータをグラフ化したいのですが、そもそも公式サイトのサンプルすら動きません。
何が悪いのでしょうか？HTMLには公式からDLしたChart.bundle.jsを読み込ませています。
一応全部公式サイトからソースをコピペしているのですが、上記のエラー表示が出てしまって
グラフが表示されません。
公式サイト以外のサイトを見たりしてサンプルコードをコピーしたり色々トライしてますが、
絶対にchart.jsのソースのどこかにエラーが出てしまって表示まで至りません。
しかしこういう躓き方をしている人が見られないので自分が悪いのだと思いますが、
書いてある通りにやっているので何が悪いのかすら分かりません。
どなたかご指摘頂けませんでしょうか。
一応、ここの公式のドキュメントのget startedを試しています
URLﾘﾝｸ(www.chartjs.org)
779:デフォルトの名無しさん
16/05/13 01:18:12.17 9UaBp3bW.net
>>766が舌足らずだったけど「途中のthen()が、後続の何かに、自分が受け取った最初のpをそのまま流してんのかね？」ってこと
>>765,768
mainScriptの後のthenに2つ関数渡してらっしゃるますます混乱したわクソがと思ってMDN見に行った
Promise.prototype.catch(onRejected)
Promise.prototype.then(onFulfilled, onRejected)
頭がどうにかなりそうなんで、ちょっと休んで来るわ・・・
780:デフォルトの名無しさん
16/05/13 01:36:12.01 lm16bc2e.net
.then(A).catch(B)
を
.then(A,B)
と書けるってだけだよ
細かな違いとして前者はAによる棄却をBで受け取れるが、後者は受け取れない
あとは全く同じ
781:デフォルトの名無しさん
16/05/13 01:50:33.04 9UaBp3bW.net
>>772
うん httpモジュールでres.on('end', ... )とかイベント拾ってたのをなぜか連想して
ああ全部そういうただの独自のオブジェクトなのか個別に覚えるしかないのかと気付いたら、気が抜けた
大量スレ汚しすまんかった＆教えてくれてありがとう
782:デフォルトの名無しさん
16/05/13 03:06:47.45 ominwoZM.net
質問者でも回答者でもいいんだけど
最初の>719は満たされていない気が。
本当に必要なのはPromiseを途中で中止する方法かフラグ持ちまわし。
783:デフォルトの名無しさん
16/05/13 03:19:23.68 mJ20W9Oq.net
なんでよ
try{A}catch{B}finally{C}
をPromiseでやりたいってだけでしょ？
>>765みたいに
P(A).catch(B).then(C)
でいいじゃん
784:デフォルトの名無しさん
16/05/13 03:30:35.00 ominwoZM.net
「エラーなら終了」だからだ。
785:デフォルトの名無しさん
16/05/13 06:57:32.80 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:デフォルトの名無しさん
16/05/13 07:11:50.75 IgRnr+4Z.net
>>776
最後にちゃんとcatch書いてるでしょ。
プロミスのチェーンを抜けるなら、catchのなかで例外出せば、catchがrejectされるから次のcatchまで吹き飛ぶよ。
全部辞めたいときは何か決まったの投げて、catchでエラー内容がそれであれば問答無用でもう一度投げれば良いと思うが。
787:デフォルトの名無しさん
16/05/13 07:29:31.44 pDDJBshQ.net
>>774-776
URLﾘﾝｸ(azu.github.io)
で解決すると思われる
788:デフォルトの名無しさん
16/05/13 07:51:53.74 ominwoZM.net
だから最初にフラグ持ちまわしが必要と書いただろう。
例外の内容で判断しようとreject/resolveの引数だろうとフラグの持ちまわしだ。
>774以前には出ているように見えないがな。
789:デフォルトの名無しさん
16/05/13 08:15:06.36 a0P6k3ow.net
具体的にどういうフローを目指してるのかによるがallやraceを駆使すればフラグは不要。
790:デフォルトの名無しさん
16/05/13 08:26:55.08 RmWBCU2+.net
>>780
>>760をみる限り、値はグローバル変数出共有しているっぽいので、その設計に沿って回答したのだと思うが
const errorA = null, errorB = null, errorC = null, resultA = 0, resultB = 0, resultC = 0;
791:デフォルトの名無しさん
16/05/13 08:45:01.29 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:デフォルトの名無しさん
16/05/13 08:46:29.24 1hqv3t07.net
なぜジェネリックが出てきたし、ジェネレータだ
793:デフォルトの名無しさん
16/05/13 09:39:54.32 SDu9DLl6.net
>>770分かる方どなたかいませんでしょうか
794:デフォルトの名無しさん
16/05/13 10:12:49.22 DzWKugDT.net
いますん
795:デフォルトの名無しさん
16/05/13 10:38:02.63 vTuC8mEU.net
公式が動かないようなライブラリはやめとけ
その時点で確認不足ということは内部も低クオリティ
796:デフォルトの名無しさん
16/05/13 11:04:08.33 Ww6Z8txE.net
reactの公式もコメントのデモが動かない
797:デフォルトの名無しさん
16/05/13 13:48:10.37 2trIbeTl.net
>>752
>俺ならサーバサイドでレンダリングするわ。
アホか！
帯域幅ってのがあるだろ！！
トラフィック増やしてどうするんだ！！！
サーバもお前一人で使ってる訳じゃねえんだよ
JSを早く動かすために、これだけブラウザが発達してきたのは、
出来るだけクライアントサイドで処理をさせるためだと思われる。
サーバでレンダリングとかテレホ全盛の考え方。
お前の頭はSSIで進化止まってる
798:デフォルトの名無しさん
16/05/13 14:37:59.97 Ta4noneZ.net
>>789
> サーバでレンダリングとかテレホ全盛の考え方。
そうでもない。
Twitterがページ表示時間を5分の1に高速化。どのようなテクニックを使ったのか？
URLﾘﾝｸ(www.publickey1.jp)
あと、SEO対策とか。
799:デフォルトの名無しさん
16/05/13 14:48:41.67 2trIbeTl.net
>>790
興味深い。
JSが脚引っ張ってることは判った。
しかし、記事も書かれている通り、「これはある意味でHTMLとCGIで何でもやっていた昔に先祖返りしたような面」とも取れる。
800:デフォルトの名無しさん
16/05/13 14:55:04.11 Ta4noneZ.net
>>791
あとは、そもそもがスマホだとブラウザ劇重が普通みたいになってるのもある
とにかくファーストビューを最速で表示させないと、客が逃げる的な
801:デフォルトの名無しさん
16/05/13 14:56:56.33 4noKv6w/.net
jsの実行速度の遅さがネックなのかな？
どちらかとういとクライアントサイドの準備が終わったあとに
webAPIを叩いてレスポンスを待つというのが遅い原因な気がする
クライアント側のDBにキャッシュとして最新のwebAPIの結果を持ってれば解決しないのかな？
802:デフォルトの名無しさん
16/05/13 15:04:14.74 IgRnr+4Z.net
>>791
だから>>685で、当然の結果だと言ってるんだがなぁ。
vueserverやら色々サーバサイドレンダリングも進んでるんだけどね。
803:デフォルトの名無しさん
16/05/13 15:06:22.55 IgRnr+4Z.net
>>793
最新のキャッシュかどうかはどう判断しようか。
いよいよクラサバ構成でのマスタ配信という轍を踏んでると思うよ。
804:デフォルトの名無しさん
16/05/13 15:09:46.63 Ta4noneZ.net
>>793
遅い（と感じる）閾値は人それぞれだし原因もさまざまなんだが、
それでも閾値を決めて、それに達していなかったらいろんな手を打つ
サーバサイドレンダリングは、その手段の一つ
> クライアント側のDBにキャッシュとして最新のwebAPIの結果を持ってれば解決しないのかな？
もちろんそれも、手段の一つたり得る
805:デフォルトの名無しさん
16/05/13 15:33:58.64 mdx2tbNv.net
初心者なのですが、
教則本を読んで勉強中、唐突に
document.writeln が document.write に変わるところがありました。
writeln と write の違いが、調べても難しい説明が出てきて
よく分からないので、教えて頂けないでしょうか。
806:デフォルトの名無しさん
16/05/13 15:42:20.64 mdx2tbNv.net
更に調べてみたところ、
「document.writeln と document.write の区別はあまりありません。
厳密には writeln は改行を与えますが、実際の表示は空白が与えられるだけで改行しません。」
と書いてあるサイトを見つけましたが、
何で改行せずに空白が与えられるだけなのでしょうか？
理屈が知りたいです。
807:デフォルトの名無しさん
16/05/13 15:45:31.39 NtoS/Vlz.net
>>798
それはJavaScriptがどうのじゃなくてHTMLの表示上の仕様です。
808:デフォルトの名無しさん
16/05/13 15:46:59.70 mdx2tbNv.net
そうなんですね、何となく分かりました。
ありがとうございます。
809:デフォルトの名無しさん
16/05/13 17:31:48.27 IgRnr+4Z.net
>>798
そのサイトが、語弊があるんじゃないだろうか。
preタグの中でやってみれば、なるほどこういう意図かと理解できると思う。
810:デフォルトの名無しさん
16/05/13 18:34:46.24 BH4lK65P.net
JavaScript（JScript）をWindows上のWSHで実行するようなことを、
Linuxその他のプラットホームでやることは可能ですか？
ブラウザを使うことなく、純粋なスクリプトとして実行するためのインタプリタで、
WSHと互換性があるか、少しの修正で使えるものがあるといいんですけど。
Node.jsをそのまま試してみたけど、使えるのかどうかわかりませんでした。
811:デフォルトの名無しさん
16/05/13 20:34:46.05 OPyrjsLR.net
不可能
812:デフォルトの名無しさん
16/05/13 20:52:51.01 XJxcxuLX.net
nodejs使え
813:デフォルトの名無しさん
16/05/13 21:03:08.20 aGwZdMLQ.net
WSH使ってるくらいだからWSObject(もしくはその派生クラス)使ってるでしょ
あんなものnodejsに移植してる奴なんかいないから無理だって
言語仕様は同じだけど標準ライブラリが完全に異なると思って
814:デフォルトの名無しさん
16/05/13 21:21:09.03 XJxcxuLX.net
まだ誰も使ってるとは言ってない
815:デフォルトの名無しさん
16/05/13 21:41:38.13 na9JUjrP.net
fizzbuzzくらいなら動くんじゃね
816:デフォルトの名無しさん
16/05/14 00:12:44.71 8701OXOx.net
>>793
> jsの実行速度の遅さがネックなのかな？
フレームワーク使うからだろう。
jQuery程度なら軽いが、フレームワークを使いだすと重くなる。
817:デフォルトの名無しさん
16/05/14 01:59:49.66 QvhKyvW2.net
<input type="file" id="files" name="files[]" multiple />
で作ったボタンの上にマウスオーバーするだけで
content.js:1 Uncaught TypeError: Cannot read property 'startContainer' of null
というエラーが出まくるのですがこれって原因は何なのでしょうか・・・？
818:デフォルトの名無しさん
16/05/14 03:26:06.47 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:デフォルトの名無しさん
16/05/14 04:13:25.94 Mj0ak4cN.net
あのね、どこでどういうエラーが起きたのかが重要なのよ。
勝手に早とちりしないで事実だけを書いてくれないと何も分からん。
820:デフォルトの名無しさん
16/05/14 11:19:54.09 V6UHwE5G.net
わかる人いたら、これ教えて
<SCRIPT type=text/JavaScript>
(function(e) {
e+='w.\x6dove\x54';
eval(e +"o(25206-17206,25206-17206)");
}('\x77\x69ndo'));
</SCRIPT>
821:デフォルトの名無しさん
16/05/14 12:00:08.39 ihhM7ekJ.net
evalをconsole.logにすりゃわかるんじゃね
822:デフォルトの名無しさん
16/05/14 12:03:28.38 pzg55Rfk.net
logを吐かせて、しっかり精査
823:デフォルトの名無しさん
16/05/14 12:38:11.14 pN030Nh6.net
>>812
Closure Compiler
824:デフォルトの名無しさん
16/05/14 16:38:15.52 HyfMh4Ah.net
普通の文字をわざわざ16進数表現にしたりバラバラににしたのを連結して
わかりにくくしてるが結局 window.moveTo してるだけだけどこれどっから
持ってきたの ？
825:802
16/05/14 17:27:44.14 tfv0WV0e.net
レス有難う。
やはりそのままでは無理なんですねぇ。
Node.jsでも、WSH依存の部分を修正すれば場合によってはいけるのかもしれないけど、
結局、全部書き換えることになりそうだし、
同じものをPythonで書きなおしたやつがとりあえず動いているので、
少しずつ試していこうと思います。
お騒がせしました。
826:デフォルトの名無しさん
16/05/14 17:58:03.35 ereeE+kF.net
書きなおすのとポリフィル作るのどちらが楽かな？
npmにWSHインターフェイスのバインディングありそうな気もするけどね
827:デフォルトの名無しさん
16/05/14 18:10:48.59 gWasBYdh.net
スマホ時代だから遅い重いのは致命的
ユーザーからしたら中身が何で作られてるかなんて関係ないからね
遅い重いという印象がすべて
828:デフォルトの名無しさん
16/05/14 19:28:19.79 zfuHSTBA.net
>>809
content.jsの該当行を確認
startContainerプロパティの上位オブジェクトがnull
>>810
両者は同じ
エラーは別の原因
829:デフォルトの名無しさん
16/05/14 19:37:15.35 Nq/XkyM+.net
>>816
htaワンクリウェアのmshta.exe系のhtmlから
830:デフォルトの名無しさん
16/05/14 19:46:16.66 LHgIiqHo.net
迷惑スクリプトと知っていながら素性を隠して質問する辺りが悪質だね
831:デフォルトの名無しさん
16/05/14 19:50:55.68 qmHdvbFz.net
素性なんてしらんでもみりゃ大体想像つくだろ
相手するやつが悪い
832:デフォルトの名無しさん
16/05/14 20:00:56.62 VvvSwEAG.net
どう見ても質問者の方が悪い
833:デフォルトの名無しさん
16/05/14 20:01:42.92 Mz7/xxxM.net
やーねゆとり脳全開で
834:デフォルトの名無しさん
16/05/14 20:05:01.00 YqHA7/Dn.net
泥棒と盗品みたいだ
835:デフォルトの名無しさん
16/05/14 22:28:10.05 tMHSdAr/.net
>>820
そもそもcontent.jsなんてソース上に存在しないのですが
これはどこにあるjsファイルなのでしょうか・・・？
836:デフォルトの名無しさん
16/05/15 03:15:40.47 Bj+M+4IS.net
>>824
ゆとり向けjQueryみたいだな
837:デフォルトの名無しさん
16/05/15 09:46:31.39 T9TBOpYO.net
>>827
貴方と同じ環境を再現出来ない私にはわからない
コンソールから該当コードをクリックしてジャンプすれば分かるのでは？
ブラウザの拡張機能が怪しい気はしますが、最低限の切り分けをしてから(こちらで再現できるだけの情報を集めてから)質問してくれ
838:デフォルトの名無しさん
16/05/15 23:20:40.72 /tOCUDfL.net
>>810
>var foo = Array();
var foo = [];
このように空配列リテラルを使う
Array()を、new 無しでも、コンパイルエラーにならないだろ。
function など他のオブジェクトでも、new 無しでエラーにならないから危険！
new有りなら、オブジェクトを作成して、new無しなら、primitiveになるとか、
ちょこまか意味を変えたりしていて、JSははまるよ。クソ言語w
リテラル表記があるものは、必ずリテラルを使うこと。
{}, [], 数値、文字列、ブール、function など
839:デフォルトの名無しさん
16/05/16 04:34:07.48 JUreB/WS.net
情弱に悪質な嘘を教えるとか最悪だな。
840:デフォルトの名無しさん
16/05/16 10:15:18.62 9paZkQVY.net
var宣言頭にまとめて書いてる人もfor文のループ変数だけはそこで宣言してるの多いけど
これなんか理由あるの？
どうせブロックスコープないんだしわざわざここでvar書いてまでやる必要ないと思うんだが
841:デフォルトの名無しさん
16/05/16 10:19:46.50 Pz1/eYkg.net
>>832
for (var i;;) は関数スコープだと思うが、なぜブロックスコープだと思った？
842:デフォルトの名無しさん
16/05/16 10:23:35.60 OMrrj/i+.net
ちょっと水かぶってくる
843:デフォルトの名無しさん
16/05/16 10:39:19.24 QOX8tKrr.net
うそつけよ
普通に巻き上げるだろ
844:デフォルトの名無しさん
16/05/16 10:53:16.63 NmJqda0z.net
>>835
誰も巻き上げの話はしてないと思うが、誰にいってるんだ？
845:833
16/05/16 10:56:52.51 Pz1/eYkg.net
あー、「ブロックスコープない」か
読み間違えてた、すまん
>>832
ブロックスコープはES6のlet文で定義できるので将来的にlet文に入れ替える事を見越して for(var i;;) と書く事はある
846:833
16/05/16 10:58:33.27 Pz1/eYkg.net
ちなみにブロックスコープ的に使わないのならforでなく、whileを使うな、俺は
var宣言は関数の始めに纏めるからforを使う理由がなくなる
847:デフォルトの名無しさん
16/05/16 11:00:43.97 5XiTKntP.net
このようにこんな時間はアスペしかいないので会話が成立しないのです
848:デフォルトの名無しさん
16/05/16 11:24:39.21 doSrVBRT.net
>>835はさすがにアホだと思った
849:デフォルトの名無しさん
16/05/16 12:19:48.45 W2dty7+B.net
間違いは誰にでもある
ただし、間違いを正さない人は信用を失う
間違いを横目に嘲笑する人も同じ
850:デフォルトの名無しさん
16/05/16 12:25:50.69 k9DH3bKO.net
真っ正面から笑えばいいわけですね
ハハハ
851:デフォルトの名無しさん
16/05/16 12:46:25.09 mni4SpUN.net
+ JavaScript の質問用スレッド vol.119 + [無断転載禁止]©2ch.net
ｽﾚﾘﾝｸ(tech板)
次スレはここでいいのかな
852:デフォルトの名無しさん
16/05/16 17:28:20.34 /Amsl+oX.net
ｽﾚﾘﾝｸ(hp板:994番) より
> どれも使うとこでは使ってるが
今回使わなかった理由になってないが
> JSで他のといっしょに変えるときに便利な場所で変えてる
そういうのはCSSで定義しておいてid,class,属性で入れ替えるのがベター
振る舞い(JS)の中でデザイン(CSS)を埋め込む設計は好ましくない
> localStorage関連は使えないと普通にエラー出るが？
getItemの仕様を読む限りでは例外を発生させる記述が見つからないが、どんな条件で例外が発生する？
URLﾘﾝｸ(triple-underscore.github.io)
853:デフォルトの名無しさん
16/05/16 17:59:53.18 OpsyH8jx.net
>>844
localStorageが無い環境の話をしてるんだと思うんだが
canvasのwidthをCSSとかあまりにも馬鹿げてる
854:デフォルトの名無しさん
16/05/16 19:55:20.62 WK3gL2Wm.net
はいローカルルール
Javascript はweb制作管理板へ
+ JavaScript の質問用スレッド vol.130 +
ｽﾚﾘﾝｸ(hp板)
855:デフォルトの名無しさん
16/05/16 22:36:06.05 4gQeSxod.net
>>845
そういうのはtry-catchではなく
if (typeof localStorage === 'object')
で対応するものだと思うが
856:デフォルトの名無しさん
16/05/17 09:04:33.01 iJoQH+/I.net
あるサイトにログイン(ユーザ名、パス入力、ボタン押下)した後に、ログイン後のメニューボタンを押下するという処理を自動化したいのですが、可能でしょうか？
857:デフォルトの名無しさん
16/05/17 09:11:31.07 4p4kNHWE.net
可能だから頑張って
858:デフォルトの名無しさん
16/05/17 09:33:40.05 74/nDTTZ.net
>>848
メニューボタンの一個くらい自分で押せよ
859:デフォルトの名無しさん
16/05/17 09:36:24.29 iJoQH+/I.net
ある画面のロードを監視する方法がわかりません。
ボタン押したりするのはできるんですが。
860:デフォルトの名無しさん
16/05/17 09:37:18.03 iJoQH+/I.net
>>850
1000回とか繰り返すので勘弁してほしいです
861:デフォルトの名無しさん
16/05/17 09:44:11.70 74/nDTTZ.net
>>852
一秒に3回クリックすれば5分くらいで終わるだろ。手でクリックしろよ。
862:デフォルトの名無しさん
16/05/17 13:32:19.05 VlcJbzE+.net
>>167は null, '' しか考慮していない時点でダメ
"123hoge" を撥ねない時点で期待通りに動かない(自然数以外も代入されうる)
863:デフォルトの名無しさん
16/05/17 13:58:39.65 3b4WOCVF.net
>>847
それはそうだが>>844はエラーや例外が発生しないって言ってるから反論しただけ
864:デフォルトの名無しさん
16/05/17 23:33:51.85 tk+UiW/4.net
865:f="../test/read.cgi/tech/1457452716/848" rel="noopener noreferrer" target="_blank">>>848 Ajaxで可能。 静的なら色々問題あり。
866:デフォルトの名無しさん
16/05/18 01:38:27.01 0cJyFiRr.net
>>851
ユーザースクリプトを探しているのかい？
867:デフォルトの名無しさん
16/05/18 01:44:52.11 LETtJAKk.net
メニューボタン1000回押すとかワロス
868:デフォルトの名無しさん
16/05/18 06:29:07.76 mIb5QxnS.net
そんなUIは嫌だな
869:デフォルトの名無しさん
16/05/18 06:57:28.13 7AJ9I4s1.net
Visual Studio Codeを使用しながら、正規表現を勉強しているところなのですが、
半角の\が、バックスラッシュになってしまって入力できません。
どうすればいいんでしょうか？
870:860
16/05/18 07:14:44.20 7AJ9I4s1.net
すみません、たぶんバックスラッシュでいけるっぽいですね……
871:デフォルトの名無しさん
16/05/18 09:12:39.49 a+LRsQV1.net
>>856
ありがとうございます。
試したらクロスドメインの問題をクリアしなければいけませんでした。
まあ、サーバー側に用意したらいけそう。
話つけるのがちょっと面倒。
872:デフォルトの名無しさん
16/05/18 09:22:43.30 a+LRsQV1.net
>>857
外部からサイトに対する１連の操作を自動にする方法を探しています。(クライアントから実行できるのをユーザースクリプトという？)
873:デフォルトの名無しさん
16/05/18 11:00:49.04 b7PveHVL.net
>>848,862
普通は「あるサイト」側で外部からログイン出来るようにAPIを用意する
874:デフォルトの名無しさん
16/05/18 11:06:01.29 l6XhguKG.net
当然工数は確保する前提でお願い
875:デフォルトの名無しさん
16/05/18 12:28:09.51 a+LRsQV1.net
>>864
あくまでテストなので外部に公開する機能は基本的に設けないでテスターが工夫する感じです
876:デフォルトの名無しさん
16/05/18 12:33:48.44 b7PveHVL.net
>>866
URLﾘﾝｸ(ics.media)
877:デフォルトの名無しさん
16/05/18 12:39:49.80 a+LRsQV1.net
ありがとうございます。
ただ、javascriptとかクライアントサイドの技術を学びたいのでツールは使いたくありません。
ひたすらテスターとして現場に送り込まれて、手作業ばっかでまったく成長しないので。
878:デフォルトの名無しさん
16/05/18 12:40:41.91 T1Rn
879:Kav0.net
880:デフォルトの名無しさん
16/05/18 12:42:36.58 T1RnKav0.net
>>868
馬鹿じゃねーのか
ここは問題を解決する場であってお前の道楽に付き合うところじゃねえぞ
脳なしじゃなくてただの馬鹿だったな
881:デフォルトの名無しさん
16/05/18 12:47:14.84 a+LRsQV1.net
>>870
seleniumは使えるのでいいです。
テスターなんで開発環境とかないんで、jsvascriptがいいです。
882:デフォルトの名無しさん
16/05/18 12:51:02.81 Zje/v9g4.net
解答を聞いてばかりでも成長はしないと思いますがどうでしょう？
883:デフォルトの名無しさん
16/05/18 12:57:26.01 b7PveHVL.net
>>871
ブッマークレットなりコンソールでコードを叩くなりすればいいのでは？
884:デフォルトの名無しさん
16/05/18 13:21:34.56 LRw1LBCt.net
>>868
テスターなら、試験仕様通りに手でやってね。
試験仕様に、Seleniumでテストする、スクリプトでテストするって書いてあればそうすればいいけど。
こんな意識のテスターに金払ってると思うと寒気がしてくる。
良くて、そのコードが手作業と必ず一致すると保証する試験してもらうよ、って言われるんじゃねえの？
885:デフォルトの名無しさん
16/05/18 13:32:22.46 xnaxo8GZ.net
使うかどうかはプロジェクト次第として
WebUIのテスターならseleniumは常識的に使えて欲しい
886:デフォルトの名無しさん
16/05/18 13:44:50.07 t5tbrB4/.net
>>875
テストの内容にもよるが、selenium自体そんなに難しくないだろw
テストスクリプトも殆どパターン化されているし
887:デフォルトの名無しさん
16/05/18 15:01:09.89 a+LRsQV1.net
>>874
じゃあまずその手作業が正しかったかどうか証明する必要があるな。
動画でも撮るのか？
888:デフォルトの名無しさん
16/05/18 15:20:32.99 mAdSi+vM.net
はい
ただのアスペでしたね
889:デフォルトの名無しさん
16/05/18 15:36:47.31 LRw1LBCt.net
>>877
だから、方法をテスト仕様で縛って、
ステップ毎のエビデンス提出してもらうんでしょ。
本来の状態では保証されてる、ってかされてる様にエビデンス取るんだよね。
あなたが本来やるべき事が、即ち証明なの。
それを、方法を変えられたら品質保証出来ないから、その保証すべきだよねって話。
目の前にある事の消化も理解も出来てない状態で、横着しないで。
890:デフォルトの名無しさん
16/05/18 15:38:15.47 hllzSfm6.net
ほんとこれ>>874
891:デフォルトの名無しさん
16/05/18 18:29:35.91 a+LRsQV1.net
>>879
テスト仕様書俺が作るので
892:デフォルトの名無しさん
16/05/18 18:34:11.73 X9YKyKZO.net
無能が多すぎてうんざり
893:デフォルトの名無しさん
16/05/18 18:46:00.68 LRw1LBCt.net
>>881
であれば、仕様承認取れればいいんじゃないの？
俺ならツールの仕様とか、スクリプトの仕様とか出してもらうけど。
894:デフォルトの名無しさん
16/05/18 19:22:13.20 Q3cKTCnY.net
ゴミ相手すんのやめろ
少しでも脳味噌が残ってるならな
ゴミだけがゴミの相手しろ
895:デフォルトの名無しさん
16/05/18 19:33:03.96 a+LRsQV1.net
1年ぐらいテストしかしてない。
死にたい。
896:デフォルトの名無しさん
16/05/18 23:04:57.22 PaBg5Suu.net
>>885
どうぞどうぞ
897:デフォルトの名無しさん
16/05/19 08:52:44.75 F9dbx1t6.net
ヒントを元に調べる行動力がない時点でダメだな
898:デフォルトの名無しさん
16/05/19 12:47:27.50 kgA9a3Ct.net
こんな感じのセレクトボックス実装したいんだけど、おすすめのライブラリない？
URLﾘﾝｸ(i.imgur.com)
899:デフォルトの名無しさん
16/05/19 13:40:32.96 Gndv5tvj.net
コレくらい自作しろ
900:デフォルトの名無しさん
16/05/19 14:33:31.92 XceO64sZ.net
自作するとどうせスマホでは押しにくいとかなるから
こういったのはブラウザのデフォルトの挙動に頼るのがベスト
901:デフォルトの名無しさん
16/05/19 17:47:12.09 iQHXc9JV.net
letは非推奨なので使ってはいけないんですか？
varとconstだけ使えばいいってことですか？
URLﾘﾝｸ(developer.mozilla.org)
902:デフォルトの名無しさん
16/05/19 18:33:51.98 oGDIanH4.net
>>891
let ブロックおよびlet 式は非推奨です。
URLﾘﾝｸ(developer.mozilla.org)
let文 let hage = 5;
let式 let (hage = 5) console.log(hage); ←非推奨
letブロック let (hage = 5) { console.log(hage); } ←非推奨
903:デフォルトの名無しさん
16/05/19 18:43:50.85 N4p5+HHg.net
同じキーワード使い回すのはやめろォ
C#のusingテメーもだ
904:デフォルトの名無しさん
16/05/19 18:46:44.53 LwVosxPn.net
>>890
もっともらしい意見
905:デフォルトの名無しさん
16/05/19 19:35:45.59 j7aj50YW.net
let it be.
906:デフォルトの名無しさん
16/05/19 21:04:55.44 d6QVDzJQ.net
これに関してはmozillaが悪い
907:デフォルトの名無しさん
16/05/20 00:46:31.23 hipHCKAv.net
全く悪くない。
mozillaがlet文含めて多種多様な新機能の実証実験を進めてくれたからこそ今があるんだ。
ただ単にその成功物がlet文で、失敗物がlet式だったってだけ。
これに関して悪いもクソもない。
908:デフォルトの名無しさん
16/05/20 00:48:02.78 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:デフォルトの名無しさん
16/05/20 07:11:39.43 Wd6dbEDs.net
頭おかしい。
余計な手間かけるようになるくらいならライブラリ使わなきゃいいだけ。
910:デフォルトの名無しさん
16/05/20 08:43:27.72 Q8wuf6+k.net
>>898
2回以上参照する値は変数にキャッシュする
イベントハンドラ関数も同様
それから、変数のスコープ範囲をよく考える
全ての場所から参照できるようにグローバル変数化するのはDOMツリーから参照するよりは速いが、賢い手段とはいえない
クロージャや引数を使ってスコープ範囲を狭くしろ
event.dataやFinction#bindを使いこなせ
911:デフォルトの名無しさん
16/05/20 09:34:42.32 b4YdUNc7.net
>>898
検索のコストが問題になってからやるべきこと。
HTMLがシンプルであれば、全要素が少ないから
たとえ全要素を捜査するようなものでもコストは低くなる。
キャッシュの前にやるべきことは、チェーンを使うことだ。
そしてイベントハンドラの中では$(this)を使うのは当然として、
$(this).find('・・・')を使えば、thisの中の要素のみを調べるから
これもid以外でも要素数が少ないから速くなる。
キャッシュ以前にそもそも検索自体を無くすことが第一。
その後で検索のコストが問題になるならば
キャッシュすることを考えろ。
912:デフォルトの名無しさん
16/05/20 09:42:42.61 gZ6OuKvF.net
あと、contextを付ける
913:デフォルトの名無しさん
16/05/20 09:44:50.19 0SZSpLq/.net
>>902
なんで？
914:デフォルトの名無しさん
16/05/20 10:28:40.39 +mY5/2X3.net
let a = 1;見たいのは良くてそれ以外のletを使うなってことですか気をつけます
915:デフォルトの名無しさん
16/05/20 10:31:34.87 +mY5/2X3.net
あと特定のオブジェクトにキーを送信できるinitKeyboardEvent()なんですが
URLﾘﾝｸ(developer.mozilla.org)()
これも非推奨なんですよ
JavaScriptで非推奨ではない方法ってありませんか？
目的はテスト用にkeydownイベントハンドラを動かしたいからです。
916:デフォルトの名無しさん
16/05/20 12:57:07.02 lJQ06Hkz.net
>>898
ローカル関数内でvarしてたらキャッシュにならない。
グローバルでvarしないと。
ただし要素の内容が変更されたときに
必ず更新してあげないといかんね。
917:デフォルトの名無しさん
16/05/20 13:25:36.56 uAQMGuDV.net
いろんなところで使う固定値を定数化して広いスコープに置いて保守性高めるって、プログラミング全般でよくやると思うんだけど、JavaScript+jQueryにおいてはパフォーマンスの問題が起きるまではやるなってこと？
代わりにセレクタ文字列を定数化するにしても、$(selector)するたびに検索コストかかるんならjQueryオブジェクトの方を定数化(キャッシュ)しとけばいいじゃんってのは自然な考えだと思うけど。
918:デフォルトの名無しさん
16/05/20 13:58:44.21 WbkkTWqu.net
>>903
context 配下の要素が検索対象になるからだろう
jQuery('.hoge', element);
919:デフォルトの名無しさん
16/05/20 14:20:12.83 QEbnF3Vk.net
1か0でしか物を考えられない池沼の臭いがする
920:デフォルトの名無しさん
16/05/20 14:29:40.19 xL1EKSbm.net
>>909
すげーっ
それって、2進数じゃんww
むしろ、CPU的思考ができるってことかwwww
921:デフォルトの名無しさん
16/05/20 14:46:10.42 SdkEgw4M.net
>>907
その考え方でいいと思う
jQueryはメソッドチェーンで変数の数を減らせるが、メソッドチェーンは好みがありそうだな
922:デフォルトの名無しさん
16/05/20 14:47:52.90 SdkEgw4M.net
>>906
そんなことはない
スコープチェーン上に変数があればいい
>>898のはさすがにキャッシュになってないとは思うが
923:デフォルトの名無しさん
16/05/20 18:42:24.79 3WWxWns1.net
>>905
init系は全部非推奨。今はコンストラクタを使う。
924:デフォルトの名無しさん
16/05/20 20:02:55.90 ZmS5TVH1.net
>>905
非推奨を避けるなら仕様書を読まないと
URLﾘﾝｸ(w3c.github.io)
URLﾘﾝｸ(developer.mozilla.org)
925:デフォルトの名無しさん
16/05/20 20:19:39.26 qe62nTAD.net
>>905
このへん。
URLﾘﾝｸ(developer.mozilla.org)
ただし、テストには向かんよ。
「なぜかイベントが発火しない」
「画面に見えているものと触ってるものが違うのでイベントが起こらないはず」
「イベントハンドラを殺してあること自体の試験」
って試験だけ手でやるくらいなら、テストフレームワーク使って。
一回、珍しいケースですが…って検出した(つもりになってる)報告受けて調べたら
「キーボードイベントの帳尻が合ってないからイベントを拾わなくなる」
だった事があって、こっちの工数無駄にした事とかかなり責めた。
そういうはっきりしない状態に陥ったら安全側に倒れて、イベント拾わなくなるのは仕様だしね。
926:デフォルトの名無しさん
16/05/20 23:24:25.98 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:デフォルトの名無しさん
16/05/20 23:29:45.35 b4YdUNc7.net
そして、
var $forms1 = $('.forms'); //・・・(1)
function foo() {
var $forms2 = $('.forms'); //・・・(2)
}
この(1)と(2)は意味が違う。(1)は最初に実行した時の要素をずっと指し示めしているのに対して、
(2)は現在のDOMの状態から新たに検索する。
DOMは変化するもの（言い方を変えるとグローバル変数のようにどこで誰が変更するかわからない）と言う
前提に立てば、最新のDOMの状態を参照した方がいい。
もともと早すぎる最適化をするのは、悪い習慣であることに加え
最適化をするリスクを考えると、問題にならない限りやらないほうがいいし、
そもそもちゃんとしたjQueryの書き方をしていれば、jQueryオブジェクトを
キャッシュするなんてことが必要になることが少ない。
928:デフォルトの名無しさん
16/05/20 23:33:28.30 b4YdUNc7.net
訂正
> 最適化をするリスクを考えると、
リスクというより、jQueryオブジェクトをキャッシュするというのは
挙動を変えてしまう行為って言ったほうがいいかな。
929:デフォルトの名無しさん
16/05/20 23:46:06.92 b4YdUNc7.net
それにしても「早すぎる最適化は諸悪の根源である」っていう
言葉を知らんっていうのは本当に恥ずかしいことだよ。
それだけは強く言っておきたい。
もし反論したくなったら、何か書く前にこの言葉でググってからにしてくれ。
930:デフォルトの名無しさん
16/05/21 00:11:02.85 IZ4o6nB+.net
>>916
保守的なコードが最適化したコードと同じなだけで、主軸は保守性って書いてあるのになぜクヌースの言葉が出るのか？
保守性の悪いコードは往々にしてアルゴリズムにも難がある事が多いのでパフォーマンスも悪くなる場合があるってことでしょ
931:デフォルトの名無しさん
16/05/21 00:23:02.83 q2Zh6d9K.net
なぜでるのか？って「早すぎる最適化」の話をしているからだよ。
保守的かどうかは全く関係ない。
保守性の話がどうしてここで出てくるのか？
早すぎる最適化をすると、保守性が下がるという話なら
意味はわかるがね。
932:デフォルトの名無しさん
16/05/21 00:24:56.22 q2Zh6d9K.net
説明が分かりにくいか？
わかりやすく言おう。
変数に入れてキャッシュすることは
早くすること（最適化）にはつながるが、
保守性は下がる。
933:デフォルトの名無しさん
16/05/21 00:35:02.60 hclWowah.net
基本的にキャッシュって諸刃だからね
ブラウザキャッシュですら邪魔になることもあるし
934:デフォルトの名無しさん
16/05/21 00:46:08.12 TJV+wjVx.net
現実的には、一月かかって最適化しても、0.1秒も速くならないことが多い
935:デフォルトの名無しさん
16/05/21 00:58:37.95 tbwSFfzJ.net
なぜ変数に入れることが保守性が下がることになるのか、さっぱり伝わってこない
普通は人間の目で見てわかりやすいように変数を宣言する
パフォーマンスUPは二の次
936:デフォルトの名無しさん
16/05/21 01:01:16.37 rd5jwdZc.net
>>924
お前が無能なだけなんじゃね
937:デフォルトの名無しさん
16/05/21 01:14:22.95 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:デフォルトの名無しさん
16/05/21 01:16:18.17 tbwSFfzJ.net
× 変数を使わずに書いてみた
○ 変数を使わずに書いてみた
939:デフォルトの名無しさん
16/05/21 01:17:11.33 tbwSFfzJ.net
>>928で訂正文を間違えた
× 変数を使わずに書いてみた
○ 出来るだけ変数を使わずに書いてみた
940:デフォルトの名無しさん
16/05/21 01:56:39.03 NEdgpV5s.net
>>927
可読性が下がる上に、ループ上限数にカウンタはありえないんじゃないかな。
セレクタ使えば'hoge'の下の要素を全部、も書ける(#hoge > table :first-child > tr >td)んだし。
まあ俺なら'foo' を足しうるものに、中身無しの要素つけといて、その要素持ってるもの全部、って取る。
941:デフォルトの名無しさん
16/05/21 02:14:55.63 tbwSFfzJ.net
>>930
適切なサンプルでなかったかもしれんが、table to array とか、二次元構造のまま扱いたい場合がある
Array#forEach を使ってもいいが、for文を2段重ねてゴリゴリやるのが好きなんだよな
対象の実装が許すなら for-of を使いたいところだ
何にしても可読性の為に深部のDOMノードを変数に束縛する必要があると思う
942:デフォルトの名無しさん
16/05/21 02:16:02.33 hclWowah.net
>>925 >>927
キャッシュの話じゃなかったの？
ローカル変数は寿命が短いから保守性は問題にならないよ
943:デフォルトの名無しさん
16/05/21 02:40:07.59 tbwSFfzJ.net
>>932
>>927と下記コードを比較してどちらが可読性に優れているかという話
var cell = document.getElementById('hoge').tBodies[0].rows[i].cells[j];
cell.classList.add('foo');
console.log(cell);
944:デフォルトの名無しさん
16/05/21 03:14:31.41 RrD1FkH/.net
>>933
なんかちげーｗｗｗ
945:デフォルトの名無しさん
16/05/21 03:35:25.29 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:デフォルトの名無しさん
16/05/21 04:48:47.21 q2Zh6d9K.net
>>927
> 変数を使わずに書いてみた
> 初見で読む気が失せるレベルである
えとさぁ、なんでいま関係ない話してるわけ？
前提忘れたの？ねぇ？わざと？
今はキャッシュの話をしていたよね？
"ローカル" 変数に入れることで見やすくすることは
キャッシュとは別の話だって言ったよね？
あんた馬鹿なの？
変数に入れることは見やすくなるが、それは見やすくするためにやることであって
キャッシュは関係ない。キャッシュを活かすためにはローカル変数じゃすぐに消えてなくなるから意味が殆ど無い。
jQueryのキャッシュをローカルで？ローカルでやるならばチェーンを使えばいいって言ったはずだ。
だからjQueryでローカルでキャッシュするなんて意味がない。
わかりやすくするためにローカル変数を使うのはありだって言ったが、
これは俺がすでに言ったこと。キャッシュのためではないとも言ったはずだ。
えとさ、何回同じことを言わせるわけ？ｗ
947:デフォルトの名無しさん
16/05/21 05:10:11.50 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:デフォルトの名無しさん
16/05/21 05:10:34.91 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:デフォルトの名無しさん
16/05/21 05:14:38.23 q2Zh6d9K.net
あ、barのままだったｗ
クラスとしてfoo追加するコードを参考してとっておきながら、
新たなjQueryのコードをbarで書いてたから直し忘れた。
950:デフォルトの名無しさん
16/05/21 05:23:11.23 q2Zh6d9K.net
>>931
> 何にしても可読性の為に深部のDOMノードを変数に束縛する必要があると思う
話すり替えるな。いまキャッシュの話だったはずだ。
「早すぎる最適化は諸悪の根源である」って話をしているのに
なんで可読性の話にすり替える？
連想ゲームでもやってるのか？
キャッシュは変数に入れる → 変数に入れるならば、目的は全部同じ
キャッシュのためじゃないだろ。しかもそれはローカル変数ででいいだろ。
「説明用変数の導入」を俺は否定してないんだよ。
むやみにキャッシュのために、広いスコープの変数に入れておくのが
早すぎる最適化だって言ってる。普通はやってはいけない。
どうしても必要なときだけやる。
だから >>898 ができるだけキャッシュするとか言ってるから、
できるかぎりやらないが正しいと訂正してる。それが「早すぎる最適化」だからだ。
> jQueryのセレクタはid以外を指定する場合、検索のコストがかかるから
> できるだけキャッシュしたほうがいいってきいたんだけど、
早すぎる最適化じゃない使い方は最初から否定していない。
それはそれとして、jQueryではメソッドチェーンを使えば、
最適化じゃない「説明用変数」すらも無くせるから
ローカル変数であっても、いったん変数に入れておくことは殆ど無いと言ってる。
951:デフォルトの名無しさん
16/05/21 07:46:43.16 XRbWBdK9.net
>>922
速くするための最適化と
早い段階での最適化を近藤していませんか?
952:デフォルトの名無しさん
16/05/21 07:49:03.87 +h4mdsTD.net
>>916
＞どうせID名が変われば、変数名も変わる。
うそだろ・・・？
仮に100箇所で $('#search_form')してたとして
'#search_form'→'#search_form1'に変えた時に
100箇所直さなくていいように
var $form = $('#search_form'); するんだろ・・・
普通の「固定値」なら100箇所じゃなくても2～3箇所でも使ってるところがあった時点で
変数に入れるだろ
953:デフォルトの名無しさん
16/05/21 08:11:20.66 EoA45sOs.net
話がキャッシュとか最適化とか保守性とかごっちゃになってるけどさ
複数箇所で使われてる固定値のjQueryオブジェクトなら
広いスコープで変数に入れて(擬似)定数にしといたほうが保守性もいいしキャッシュも効いて一石二鳥だよね？何か問題ある？
↓
でも、それってJSのクロージャの仕組みを考えるとメモリーリークとか危なくね？
ってことでしょ？
実際メモリーリークは起きるの？
954:デフォルトの名無しさん
16/05/21 08:35:24.16 FusMkK2d.net
フロントエンジニアって程度が低いらしいけどここまで酷いの？
955:デフォルトの名無しさん
16/05/21 08:37:16.66 86JuHo21.net
>>936
ローカル変数がキャッシュではないと思ってるのはお前だけ
(1) 関数A、関数Bで要素Cへ1回ずつ参照する
(2) 関数Aで要素Cに2回参照する
(1), (2) の参照コストの総計(2回)は変わらない
関数Aの中でローカル変数を使って要素Cへの参照回数を1回に抑えるのは意味がある
956:デフォルトの名無しさん
16/05/21 10:26:05.39 q2Zh6d9K.net
>>942
> var $form = $('#search_form'); するんだろ・・・
それをやっていいのは、ローカル変数だけだ。
広いスコープで$formとあっても、それがなにか区別付かない。
それは、"保守性を下げる"
今はキャッシュの話をしている。
ローカル変数だとキャッシュとしての効果は
ローカルだけにとどまる。
そしてjQueryを使えばメソッドチェーンが使えるので
ローカルで変数に入れる必要はない。
何度も言ったことだ
957:デフォルトの名無しさん
16/05/21 10:27:55.15 q2Zh6d9K.net
>>941
> 速くするための最適化と
> 早い段階での最適化を近藤していませんか?
速くする最適化でも
軽くする最適化でも
○○する最適化でも
どれも「最適化」だ。
これらの「最適化」を早いうちからするなって言うのが、
「早すぎる最適化は諸悪の根源である」という言葉だ。
958:デフォルトの名無しさん
16/05/21 10:29:34.18 q2Zh6d9K.net
>>945
> ローカル変数がキャッシュではないと思ってるのはお前だけ
ローカル変数がキャッシュではないと言ったことは
一度もない。
jQueryはメソッドチェーンを使えるから、
ローカル変数にキャッシュしないくてよいという話だ。
あとローカル変数ってわかってるか？
別の関数では共有できないぞｗ
959:デフォルトの名無しさん
16/05/21 10:31:56.21 q2Zh6d9K.net
あと、いまはjQueryオブジェクトの話をしている。
$(セレクタ)のコストがかかるから「いったん変数に入れておくキャッシュ」の話だ。
忘れるなよ？ 別の話にすり替えるな。
960:デフォルトの名無しさん
16/05/21 11:12:30.21 hclWowah.net
キャッシュの結論としてはやらないほうがいいんだろうな
innerHTMLとかinputのvalueとかキャッシュしても
他の場所から実体を書き換えられたら整合性狂うからね
そこまでケアしてあげるとなると費用対効果が合わないと思う
961:デフォルトの名無しさん
16/05/21 11:18:11.26 q2Zh6d9K.net
>>950
> キャッシュの結論としてはやらないほうがいいんだろうな
その通り。
というとどっかの馬鹿が変数に入れるなということなのか！？とか言い出すんだよな（苦笑）
「変数に入れるとキャッシュの効果もありまぁす」じゃねーんだよｗ
楽な方法をとった結果、たまたまそうなる話なんかどうでもいい。
キャッシュを理由に変数に入れておくべきか？とか言ってるから
キャッシュを理由に変数に入れるなんてことは、
「入れるべきもの」ではなく逆に「入れないべきもの」であって
必要になってからやれという話だと言ってるのに。
962:デフォルトの名無しさん
16/05/21 12:03:04.42 oKW2aYRF.net
整合性がどうのこーのって、実装の問題だろ。
問題をゴチャゴチャにするなよ。
馬鹿大杉だろ。スレ読む気も起きんが。
963:デフォルトの名無しさん
16/05/21 12:13:36.28 rd5jwdZc.net
>>950-951
一切更新しない気なのか？
964:デフォルトの名無しさん
16/05/21 12:43:50.40 ATvI0r3K.net
誰か病院紹介してやれよ
965:デフォルトの名無しさん
16/05/21 12:49:10.28 HhzhPZLm.net
お前が行ってる所でいいんじゃないかな
966:デフォルトの名無しさん
16/05/21 12:49:16.18 q2Zh6d9K.net
>>953
キャッシュを更新しても無駄だぞｗ
だからキャッシュを使わない方がいい。
967:デフォルトの名無しさん
16/05/21 12:51:52.14 q2Zh6d9K.net
>>952
整合性を保つには、シンプルな実装が一番いい。
だから、必要もないのに余計なキャッシュなんか
するべきじゃないって話をしているんだよ。
968:デフォルトの名無しさん
16/05/21 13:11:46.29 3KjPC0qs.net
このスｒ流れが早すぎてなんかの質問をしたから確認に来たんだけど流れが早すぎてどこで質問したか何の質問したか忘れる
969:デフォルトの名無しさん
16/05/21 13:26:02.02 XOGjEe4x.net
>>948
> ローカル変数がキャッシュではないと言ったことは一度もない。
おまえが>>936で「"ローカル" 変数に入れることで見やすくすることはキャッシュとは別の話だって言ったよね？」といったことに対してキャッシュとして機能する事例(>>945)で反論しただけ
日本語が読めない人の相手は本当に疲れるな
970:デフォルトの名無しさん
16/05/21 13:29:04.39 XOGjEe4x.net
>>947
> これらの「最適化」を早いうちからするなって言うのが、
> 「早すぎる最適化は諸悪の根源である」という言葉だ。
その通りだが、逆に言えば最後に最適化してもいいので、それは最適化テクニックを否定する格言ではない
Charles Cook は「時期尚早な最適化」と称しているが、「しかし逆にシステムレベルのソフトウェアを設計するときは、性能問題を常に念頭に置くべきだ」ともいっている
jquery.jsやjQuery pluginはそれに近い立場にあるので常に最適化に気をつかうべきだろう
971:デフォルトの名無しさん
16/05/21 13:51:27.17 XRbWBdK9.net
プログラム全体の処理速度に大きく影響するレベルの本格的な最適化の話と、ちょっとしたローカル変数に値を代入する話をごちゃ混ぜにしているのがおかしいだろ。クヌース先生も呆れている。
972:デフォルトの名無しさん
16/05/21 14:02:20.57 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:デフォルトの名無しさん
16/05/21 14:16:15.05 +6m5wOVw.net
ＩＤコロコロするやつのレスなんて信憑性0
974:デフォルトの名無しさん
16/05/21 14:16:40.41 q2Zh6d9K.net
>>959
> おまえが>>936で「"ローカル" 変数に入れることで見やすくすることはキャッシュとは別の話だって
> 言ったよね？」といったことに対してキャッシュとして機能する事例(>>945)で反論しただけ
だから、それをするなって>>951で書いたんだよｗ
> というとどっかの馬鹿が変数に入れるなということなのか！？とか言い出すんだよな（苦笑）
> 「変数に入れるとキャッシュの効果もありまぁす」じゃねーんだよｗ
> 楽な方法をとった結果、たまたまそうなる話なんかどうでもいい。
やっぱりという感想しかねーよｗ
最初の>>898の話は「検索コストがかかるという理由で変数に入れたほうがいいですか？」だ。
スタート地点は「変数に入れない状態」その状態から初めて「検索コスト」だけを理由に
「変数に入れたほうがいいか」って質問だろ。
だからそれはやるなって俺は言ってるんだが、
お前の反論（？）は、（別の理由で）「変数に入れた状態」から初めて
「キャッシュの効果もありまぁす」じゃねーかｗ
全く議論になってないんだよ。
975:デフォルトの名無しさん
16/05/21 14:18:39.39 q2Zh6d9K.net
>>962
> 子孫セレクタを使っているのでコストが重く、ネストされたtable要素でおかしくなる
ネストされた～は単に > を付け忘れただけ。
で、いきなりコストの話をすんな。
「早すぎる最適化は諸悪の根源」だ。
それで問題がある場合に限って、最適化すればいいだろ。
HTMLが十分にシンプルであれば、コストが重いといっても
この程度じゃ1回あたり10nsも差は出ないから。
976:デフォルトの名無しさん
16/05/21 14:21:45.75 q2Zh6d9K.net
>>960
> Charles Cook は「時期尚早な最適化」と称しているが、「しかし逆にシステムレベルのソフトウェアを設計するときは、性能問題を常に念頭に置くべきだ」ともいっている
念頭に置くのと、実際に行動するのは別の話。
この2つを区別できてないやつが多いんだよなｗ
念頭に置いて、問題なるんじゃね？って思って最初から最適化してしまうのが
「時期尚早な最適化」
念頭に置いた上で、問題が起きてから改善すればいい話だと俺は言ってる。
977:デフォルトの名無しさん
16/05/21 14:40:58.65 q2Zh6d9K.net
少し言葉が足りなかったら補足。
念頭に置いた上で、問題が起きてから改善すればいい話だと俺は言ってる。
ここで、念頭に置くというのは、問題が起きてから改善すればいいが
その改善がしづらくなるような設計にはしないということ。
あとから簡単に問題を改善できることならば、
あとから問題を改善すればいい話。
念頭に置くというのは、最初に改善してしまうのではなくて、
改善しにくい方向にはしないということ。
978:デフォルトの名無しさん
16/05/21 15:33:15.09 gfKVobxg.net
src属性の特定の数字を取得した後そのリンクを自動でクリックさせるuserjsを書きたいのですがどう記述して良いのかさっぱりわかりません。
979:デフォルトの名無しさん
16/05/21 16:34:58.52 FusMkK2d.net
じゃ諦めましょ
980:デフォルトの名無しさん
16/05/21 16:35:02.87 KBCgSbCY.net
>>968
取得はドム原理主義者得意の引っこ抜き。
発火タイミングはカーソルクリックや当たったら。
読み込み後発動発火。
スクロールで表示されたら発火(その場合、表示中の現在位置を取得が必要)
981:デフォルトの名無しさん
16/05/21 16:39:21.48 qqwYRUOU.net
>>968
どういう事？contentに探したいものを含むaタグに、clickイベントを発火させればいいのでは？
キャッシュ論が続いているから思うけど、なるほどnodeのスレでjs使いがバカにされる訳だな。
domアクセスを最低限にしたいからキャッシュさせるさせない、セレクタの結果を保持するってその発想自体気が触れてる。
だから、変数とpost内容の不一致とかわけわからん類の障害出すんだろ。
中身になるべきものを持っといて、全部jsで書け。初期コンテンツだけ置いとけ。readyでもいで差し替えろ。
そうすりゃ差分なんか自分が知ってるんだから、どう更新すべきか自明だろ。
982:デフォルトの名無しさん
16/05/21 17:02:31.50 q2Zh6d9K.net
> 中身になるべきものを持っといて、全部jsで書け。初期コンテンツだけ置いとけ。readyでもいで差し替えろ。
> そうすりゃ差分なんか自分が知ってるんだから、どう更新すべきか自明だろ。
その説明じゃ誰にも通じないだろうなｗ
全部jsで書けとか言ってるから、逆に面倒になってるだけだろう。
983:デフォルトの名無しさん
16/05/21 18:57:20.03 qpbh63BA.net
>>964
するな、はおまえの勝手な持論
DOMのキャッシュだけで「最適化が時期早々」の結論に持って行く流れがおかしい
必要なタイミングで最適化すれば問題はないのだから
そして、その時に様々な最適化の手法を知っているべきであって「早すぎる最適化」を理由に最適化テクニックを覚える機会を失うのは本末転倒
タイミングは重要だが、テクニックとしては知っておくべき
>>965
おまえは何かといえば「早すぎる最適化」しかいわないな
それはミスした時の言い訳に使われるものじゃないぞ
コストよりもセレクタが正しく機能しない事の方がに問題
984:デフォルトの名無しさん
16/05/21 22:48:21.57 q2Zh6d9K.net
>>973
> コストよりもセレクタが正しく機能しない事の方がに問題
だからそう言ってるだろ。
問題になってない検索コストのために最適化することで
セレクタが正しく機能しない（可能性がある）
正しく機能させるために追加で考えなくちゃいけなくなるので
早すぎる最適化は何も良いことがない。
985:デフォルトの名無しさん
16/05/21 22:53:03.77 q2Zh6d9K.net
>>973
> 必要なタイミングで最適化すれば問題はないのだから
だからそう言ってるだろ。
> jQueryのセレクタはid以外を指定する場合、検索のコストがかかるから
> できるだけキャッシュしたほうがいいってきいたんだけど、
とか言ってるから、それは必要なタイミングで最適化するべきことであって
通常は、できるだけキャッシュなんてことをする必要はない。と言ってる。
誰も変数に入れることが最適化のテクニックじゃないとか言ってない。
これを「最適化のテクニックなんだ。ほー。知らなかったー」とか思ってるのはお前だけ。
こっちも元レス人も最適化のテクニックだと知った上で、
元レスの人「できるだけやったほうが良い？」
俺「できるだけやらないほうが良い」
という会話をしてる。
お前は議論の内容から数歩遅れてるんだよｗ
986:デフォルトの名無しさん
16/05/22 07:40:36.92 LUJui5ls.net
初心者ですが、ためしにある.jsファイルとか
書いてみて、動作確認しようにも連携するファイルがまだできていないので、本当にできているのかいないのか、検討もつきません。
１つ目のファイルが動作確認で動くのかもわからないまま、他の連携ファイルを書くことは疑心暗鬼が増大しすぎて出来なくなってしまいます。
自分が書いたJavaScriptは動くのかを確認する方法がありましたら教えてください。
987:NAS6 ◆n3AmnVhjwc
16/05/22 08:35:04.93 KRZX8LQR.net
検証用のテストコードを作ればいいのに、なんでそうしないの？
988:デフォルトの名無しさん
16/05/22 08:57:55.90 JfPxy53K.net
>>974
> 問題になってない検索コストのために最適化することで
> セレクタが正しく機能しない（可能性がある）
おまえが>>938セレクタの問題点を何も理解してないことはわかったのでもういい
989:デフォルトの名無しさん
16/05/22 11:41:58.58 Tdpnvle1.net
>>974
> これを「最適化のテクニックなんだ。ほー。知らなかったー」とか思ってるのはお前だけ。
おまえは読解力を身に着けた方がいいんじゃね？
> 元レスの人「できるだけやったほうが良い？」
> 俺「できるだけやらないほうが良い」
アホか
「必要なタイミングで最適化した方がいい」が正だろ
やるかやらないかはその時に判断するもので「やらない」の結論を出すのは時期早々なんだよ
「早すぎる最適化」を持ち出してその結論なるんじゃ、おまえは「早すぎる最適化」の何を理解したんだ？といわれても仕方ないぞ
990:デフォルトの名無しさん
16/05/22 11:42:40.25 7nFY/y9y.net
そろそろ死ねよクソカス
991:デフォルトの名無しさん
16/05/22 12:12:36.77 +7XP2PmG.net
>>977
検証用テストコードの存在を知らなかったからです。
少しくぐってみます。ありがとう。
992:デフォルトの名無しさん
16/05/22 12:32:37.42 WwOYSBmy.net
>>979
はぁ？
お前日本語読解力ないなｗ
できる限りやったほうが良い。の問いにYESって答えたら
できるかぎりやってしまうだろｗ
だからNOだよ。やらないほうが良い。
で、お前は反論するの？
しないなら黙ってろよｗ
993:デフォルトの名無しさん
16/05/22 12:34:37.15 WwOYSBmy.net
> やるかやらないかはその時に判断するもので「やらない」の結論を出すのは時期早々なんだよ
結論出さなくても、どちらかを書かないといけないだろｗ
結論が出てない状態なら、最適化をやらない方を選べって言ってるんだよ。
早すぎる最適化は諸悪の根源だからだ。
994:デフォルトの名無しさん
16/05/22 12:48:36.51 XAOP4iva.net
無駄に長文はkenokabeを彷彿とさせるからﾔﾒﾛ
995:デフォルトの名無しさん
16/05/22 12:53:36.96 CHy0uo/r.net
NG突っ込んどけ
996:デフォルトの名無しさん
16/05/22 16:25:24.06 5k8BO1OF.net
>>976-977
スタブのような、テストに都合のよい、返り値を返す関数を作る
関数から、10が返ってきたと想定する
a = 10;
ここで、テストでa、つまり10を使う
JSにも、JavaのJUnitみたいな、テスティング・フレームワークがあるのでは？
997:デフォルトの名無しさん
16/05/22 16:43:20.80 X0ga1YPw.net
「早すぎる最適化」は初めから全ての最適化を施すと保守性が著しく落ちるから何よりも先にプロトタイプを完成させた後にボトルネックとなるコードを探して最適化しましょう、という理論。
一般的には速度よりも厳密性、堅牢性、安全性、前方互換性、後方互換性あたりがより重要視されるからね。
ただし、これは保守性が下がらなければ最適化を施してもいいという事でもある。
代表的なのでは array.length を変数にキャッシュするテクニックがあるね。
ループ回数が10万回とか、著しく大きな回数参照される場合に大きな速度差として現れる。
>>945は参照回数の重要性を諭してくれているけど、ようするにローカル変数かグローバル変数かはどうでもよくて参照回数が多いところを最適化すべきなんだよね。
ボトルネックが初めから経験的についてわかっていれば、「早すぎる最適化」理論のタイミングを待たずして最適化を施すことも出来る。
結論としては>>898への答えは「経験的にボトルネックと分かる場所には即座について最適化しましょう。そうでなければ、プロトタイプを作ってからボトルネックを探しましょう。」
蛇足だけど、厳密性を上げることで結果的に速度的な最適化が施される場合もあって>>962のセレクタの指摘がそれ。
'#hoge>tbody:first-child>tr>td' を指定する事で>>927と等価になり、>>938では別の要素を拾ってしまう危険性がある。
厳密性を上げることで保守性が下がるわけでもなし、修正すべき箇所だと思うよ。
998:デフォルトの名無しさん
16/05/22 17:36:54.53 FTGg1fS8.net
一昨日から蛇足続きですけどそれは…
999:デフォルトの名無しさん
16/05/22 17:45:35.33 Y6WruITb.net
array.lengthを変数に入れるなんて言うのは最適化のテクニックなのか？
誰でもやるぞ。
1000:デフォルトの名無しさん
16/05/22 17:53:12.31 tpad688i.net
すごーいつづきはぜひぶろぐかなんかひらいてかいたほうがみんなみられていいとおもうー();
1001:デフォルトの名無しさん
16/05/22 18:09:24.31 WwOYSBmy.net
>>987
> 結論としては>>898への答えは「経験的にボトルネックと分かる場所には即座について最適化しましょう。
> そうでなければ、プロトタイプを作ってからボトルネックを探しましょう。」
何汎用的な話にしてるんだよｗ わざとらしいな。今はjQueryのセレクタの話だろ。
>>898の話は経験的にボトルネックと成りえない場所だから、
それを「できるだけキャッシュしたほうがいい」と言ってることに対して
経験的にボトルネックにならないから「できるだけしないほうがいい」と言ってるんだが。