16/04/26 22:56:43.65 7RJVkgnK.net
というか、リサイズ時にアニメーションって
一体なんのこと言ってるの?
522:デフォルトの名無しさん
16/04/26 23:08:56.30 A0x7AT0j.net
>>517
多分、>>493が指摘した問題への対策じゃないかな
slideToggle で隠れた要素がウインドウを481px以上にリサイズした時に表示する手段がなくなるので予め隠れた要素をアニメーションで表示させておく
と思ったけど、「リサイズなんてするわけねーだろ」の人だったね
ホント何なんだろ
523:デフォルトの名無しさん
16/04/26 23:15:10.53 m+yPBzkk.net
「480px以下にリサイズ後に.toggleをclick時にアニメーション」を省略して「リサイズ時にアニメーション」と説明したんじゃない?
日本語が不自由なだけな気がする
524:デフォルトの名無しさん
16/04/26 23:25:48.62 oZATkmH1.net
日本語が不自由といえば>>501もわけがわからんかったな
> アホか。追加で良いんだよ。
「何が」追加で良いのか分からん
「resize時にclickイベントハンドラが追加で良い」なら要件を満たせてないのであり得ない
「URLリンク(jsfiddle.net) のjQuery#onが追加で良い」なら後半のhover云々の説明との整合性がとれん
jQuery(element).on('click', handler);
jQuery(element).on('click', handler);
jQuery(element).on('click', handler);
element.addEventListner('click', handler, false);
element.addEventListner('click', handler, false);
element.addEventListner('click', handler, false);
イベントハンドラが3回追加されて便利な状況がさっぱりわからん
こんなことやるならhandlerの中で3回繰り返した方がよっぽどいい
525:デフォルトの名無しさん
16/04/26 23:48:56.02 swW8g96r.net
>>514
> それとも、あなたは「ウインドウを全画面から2画面に分割」する動作をしないといいたいのかな
そりゃすることぐらいあるだろう。
だが、2画面に分割したいと思った時に、
それがたまたま、お前のページである可能性は極めて少ない。
そんなマイナーなアクションのためにアニメーションを付けるのが
無駄だと言ってるの。
思い返してみ? 今日お前が2画面に分割した回数を。
526:デフォルトの名無しさん
16/04/26 23:52:46.47 7RJVkgnK.net
ウインドウをリサイズした後に特定の要素をclickすると
window.innerWidthが480px以下ならメニュー?をslideToggle
ってことだよね?
リサイズ時にアニメーションって関係ないじゃんw
527:デフォルトの名無しさん
16/04/26 23:58:16.87 Bi6OX6KX.net
>>521
ブラウザとテキストエディタを2画面分割で開いてブラウザのページ内容をコピーしてテキストエディタにペーストするのは良くある事なんだけど
ブラウザを見ながらテキスト入力できるのはマルチウインドウの最大のメリットでしょ
「自分がしないから他の人もしないだろう」って思い込みは色々危険だよ
528:デフォルトの名無しさん
16/04/27 00:26:39.16 mjPz9hpH.net
スマホの横持ち、縦持ちを切り替えることはしょっちゅう起こるよ
529:デフォルトの名無しさん
16/04/27 04:38:04.23 ymPBswSy.net
>>524
同じページを表示したまま、縦横に何度も持ち帰るんか?
その時画面のアニメーションを見たいんか?
530:デフォルトの名無しさん
16/04/27 05:07:52.00 iS2uJpqo.net
要は、主目的は画面全体のアニメーション表示ではなく、画面が広いときはメニューを横並びに表示させて
画面が狭いときはメニューをクリック/タップで展開/収納のトグル動作させたい、
ということと思われる
そうでなければ画面の幅に応じてイベントを追加する意味がない
531:デフォルトの名無しさん
16/04/27 08:44:26.76 tEogpAYP.net
>>520
要件はどうでも良くて、api仕様はそれで良いと言ってるんだよ。
その後、once使えと言ってるじゃないか。
532:デフォルトの名無しさん
16/04/27 09:22:32.44 9uyPVyt/.net
>>526
メニューというか特定の要素をclickした場合
画面サイズで何だかの振り分けをしたいんじゃないの?
何れにしてもリサイズをアニメーションって意味不明
単なる持論だよ
533:デフォルトの名無しさん
16/04/27 11:46:48.06 VeDPJalk.net
>>527
API仕様がそれで良い理由が明確でない
しかも、once()で解決しないだろ
534:デフォルトの名無しさん
16/04/27 12:04:54.36 x1DYS/Nj.net
>>527
once()のAPIが見つからないけど、one()の事?
one()を使ったらクリックして閉じた後にウインドウリサイズしないと開けなくなったんだけど
URLリンク(jsfiddle.net)
535:デフォルトの名無しさん
16/04/27 12:21:41.01 PwdWdDII.net
offしてからonすればいいんじゃね?
536:デフォルトの名無しさん
16/04/27 13:01:52.49 x1DYS/Nj.net
>>531
その辺りは>>493で全て答えが出てるから
>>499-500がドヤ顔で解説しているのも既出だし、何がしたいんだか
537:デフォルトの名無しさん
16/04/27 15:19:37.97 BFKJgt+J.net
>>523
オナニーにしか使わないからresizeは必要ない派には、何を言っても理解できないよ。
538:デフォルトの名無しさん
16/04/29 10:29:51.62 Zpx1WpIM.net
>>533
そんなこと言ってるやついないけど、
むしろ、自分の都合のいいように
書き換えるお前には理解できないだろうよw
539:デフォルトの名無しさん
16/04/29 11:58:35.72 2UzU1Fa0.net
URLリンク(i.imgur.com)
URLリンク(i.imgur.com)
指定した商品のキーワードとカラーが現れると自動クリックするメソッドがurlが乱数対策で書き換えられたので使えなくなりました。
他の要素から検索する場合、どう書き直せばいいのでしょうか?
540:デフォルトの名無しさん
16/04/29 12:28:51.15 Z5nc+wFx.net
>>535
そのソースだけでは理解不能だと思う
window.location で検索して学習するれば解決するじゃないかな?
541:デフォルトの名無しさん
16/04/29 14:50:02.78 FtHCzag5.net
ブラウザ操作の自動化は、Firefoxで、SeleniumIDE を使って出来ないか?
または、Selenium WebDriver を使って、プログラムするとか
Seleniumデザインパターン&ベストプラクティス、2015
OSSのブラウザ自動テストツール、Selenium WebDriver を使って、
Rubyでテストを書いた本
542:デフォルトの名無しさん
16/04/29 15:12:10.79 npmLXJBi.net
>>535
自動でクリックすると何の役に立つの?
543:デフォルトの名無しさん
16/04/29 15:13:47.73 JN3HPUnt.net
転売厨だろどうせ
544:デフォルトの名無しさん
16/04/30 14:09:13.13 uVz81x78.net
GitHubで匿名通信(Tor、i2p等)ができるBitComet(トラッカーサイト不要でDHTだけで日本語検索可能)
みたいな、BitTorrentがオープンソースで開発されています
言語は何でも大丈夫だそうなので、P2P書きたい!って人居ませんか?
Covenantの作者(Lyrise)がそういう人と話したいそうなので、よろしければツイートお願いします
URLリンク(twitter.com)
ちなみにオイラはCovenant(純粋P2Pのファイル共有ソフト)の完成が待ち遠しいプログラミングできないアスペルガーw
545:デフォルトの名無しさん
16/04/30 19:08:39.84 HhSXq6WP.net
>>537
いまどきIDEはねーよ
546:デフォルトの名無しさん
16/05/01 16:53:27.97 sgiYXWIX.net
JavaScriptの文法をひととおり勉強し�
547:Iわったんですが コード書くにはどのIDE使うのが標準ですか? いまはわざわざメモ帳使ってます。(まあそれほど本格的にはやってない段階ですが、しかし将来は本格的にする予定なので。) JavaならEclopse、 VisualC#やVisualBasicならVisualStudio、 AndroidならAndroidStudio がそれぞれ標準みたいになってるじゃないですか。 JavaScriptはそのへんどうなってますか?
548:デフォルトの名無しさん
16/05/01 17:24:58.87 avBwiD/Q.net
>>542
Atomとか
549:デフォルトの名無しさん
16/05/01 17:42:02.88 sgiYXWIX.net
>>543
ありがとうございます
Atom試してみます
ところでAtomは他言語も標準的IDEになってる言語はありますか?
あまりマスターすべきIDEの数を増やしたくないのでJavaScriptをEclipseやVisualStudioでもできるようならそのほうが理想的なのですが。
550:デフォルトの名無しさん
16/05/01 18:12:07.05 t8gRHm+a.net
>>544
JavaScriptに標準IDEはありません
主にシンタックスのカラーリングや補完機能あればいいと思う
自分の好みでいいんですよ
551:デフォルトの名無しさん
16/05/01 19:03:40.53 6DCl83u4.net
「JavaScript」の標準にIDEはMozillaが作ってるだろ
つまらん嘘つくなよ
552:デフォルトの名無しさん
16/05/01 19:54:17.33 IEJxz53a.net
インテリセンス最強のエディタは?
今の所VSが強い印象だけど対抗馬いるか?
553:デフォルトの名無しさん
16/05/02 01:55:39.31 T+iaWOtl.net
>>544
本格的にやるなら、サーバーでの編集用にVimかEmacsを覚えるというのも手だが、言語の練習と同時には覚えるの辛いだろうな・・・
554:デフォルトの名無しさん
16/05/02 14:30:45.71 5BTmw4JC.net
VSCode
555:デフォルトの名無しさん
16/05/02 19:09:21.56 Fa0O9xkC.net
質問です。
JavaScript で、
var data = 'Price1080';
var Price = data.match( /^(Price|Kakaku)(\d+)/ );
if ( Price[2] == 1080) { 【←エラーが発生する行】
alert('1080円です');
}
とした場合には正常に動作しますが、data に 正規表現でマッチングしない文字列が与えられていた場合、例えば、
var data = 'PriceNashi'
だったときには、
Firefox 最新版の場合 TypeError: Price is null
Chrome 最新版の場合 Uncaught TypeError: Cannot read property '2' of null(anonymous function)
といったエラーがエラーコンソールに流れてしまいます。
Price[2] が null なのは分かるのですが、こういった変数が null の場合にもエラーを発生させない方法はないでしょうか?
(Price[2] が null なら、単にif文の中身を実行しないようにしたいです)
if ( Price[2] != null ) でチェックしようとしても、同様に「TypeError: Price is null」が発生してしまうので困っています。
ご教示お願いいたします。
556:デフォルトの名無しさん
16/05/02 19:22:45.64 vIuKkp7F.net
if (Price!==null)
557:デフォルトの名無しさん
16/05/02 19:50:52.07 86Jgi2PX.net
if ( Price && Price[2] != 1080 )
558:デフォルトの名無しさん
16/05/02 21:22:42.79 nFATBe9U.net
var Price = data.replace(/Price|Kakaku/, '');
if (Price == '1080')
559:デフォルトの名無しさん
16/05/02 21:47:19.59 58IGANjT.net
それ頭にpriceは書かなきゃいけないの?
なくして数値型で判定した方が確実だと思うけど
560:550
16/05/02 21:56:37.86 Fa0O9xkC.net
>>551-552
ありがとうございます。
教えていただいた方法で試してみたところ、エラーは発生しませんでした。解決です。
if文で配列全体の存在を確認する分にはエラーは発生しないけど、
配列内の要素の存在を確認した場合、その配列自体が存在しないとエラーになっちゃうようですね。
>>553-554
色々な解放があるようですね。
ありがとうございます。
561:デフォルトの名無しさん
16/05/03 04:50:38.58 1U/0N7SV.net
>var Price = data.match( /^(Price|Kakaku)(\d+)/ );
>if ( Price[2] == 1080) { 【←エラーが発生する行】
普通、1行目の後に、いきなり2行目を書かない。
論理的につながっていない
1行目の後には、少なくとも1つでも、一致したかどうかの判断が必要
そして一致していれば、2行目の処理へ進む。
一致するものが無ければ、2行目へ進まない
562:デフォルトの名無しさん
16/05/03 08:47:51.21 65DdW2hV.net
var num = Price ? Price[2] : null;
if (num == '1080')
563:デフォルトの名無しさん
16/05/03 15:41:32.16 6WBArbcg.net
JS的には普通はこう
var price = +( data.match( /^(Price|Kakaku)(\d+)/ ) || [] )[2]
if ( price == 1080) {
判定をするのはJSらしくない
暗黙の型変換を利用し値を早い段階で確定させていくのが正しい動的型付けの手法
564:デフォルトの名無しさん
16/05/03 16:12:55.52 64Up/wnd.net
書き方が悪くないか?正規表現なら
replace(/^.*(Price|Kakaku)([0-9.]+).*$/g,'\\1')-0
かなんかして、1080と比較したら確実じゃないの?
565:デフォルトの名無しさん
16/05/03 16:13:50.36 64Up/wnd.net
あ、リロードしてなかった。すまん。
566:デフォルトの名無しさん
16/05/03 17:09:50.29 2ApUtfSZ.net
^(?:(Price|Kakaku)(\d+))?
と、全体は一致するようにするとか
replaceするやつは '1080' でもマッチしてしまいそう
567:デフォルトの名無しさん
16/05/03 17:14:00.54 65DdW2hV.net
Price || Kakakuの他にも異なった文字列が
存在する、しないで変わってくるね
568:デフォルトの名無しさん
16/05/03 17:29:30.46 IJoN7jmc.net
とりあえずIEでもChromeでも
そこに書いてあるJavaScriptのコードを少しだけ改変/追加したいのですが
簡単にコードエディットする方法はありますか?
インテリセンスだけがついてあれば充分です。
現状はメモ帳にコードを貼り付けてやってるのでものすごく効率が悪い。
ちなみにJavaScriptはまだかなりの初心者です。
569:デフォルトの名無しさん
16/05/03 17:49:40.27 YTE1L/l3.net
おまえごときその辺のテキストエディタで十分
570:デフォルトの名無しさん
16/05/03 17:54:18.04 64Up/wnd.net
>>559
自己レスで間違えてた。
\\2に置換すると、Priceに続く数字だけ残る。
571:デフォルトの名無しさん
16/05/03 17:55:12.59 G4OBLQ5I.net
ブラウザのコンソールからファイル編集して保存できるよ
メモ帳すらいらん
572:デフォルトの名無しさん
16/05/03 18:55:05.50 IJoN7jmc.net
>>564
あまりわたしを怒らせないほうがいいぞ。
わたしは真剣に聞いているのだからな。
573:デフォルトの名無しさん
16/05/03 19:00:51.75 mbDp1eZa.net
昨今のテキストエディタは優秀だから騙されたと思って拾ってこいや
てめえにゃもったいないくらいのサポートしてくれるっての
574:デフォルトの名無しさん
16/05/03 19:01:38.06 IJoN7jmc.net
>>568
たとえばどれでしょうか?
575:デフォルトの名無しさん
16/05/03 19:43:50.15 G9XEXQGe.net
匿名通信(Tor、i2p等)ができるファイル共有ソフトBitComet(ビットコメット)みたいな、
BitTorrent(Covenant)が活発な情報交換・交流コミュニティでオープンソース開発されています(プログラマー募集中)
言語は何でも大丈夫だそうなので、P2P書きたい!って人居ませんか?
Covenantの作者(Lyrise氏)がそういう人と話したいそうなので、よろしければツイートお願いします<(_ _)>
URLリンク(twitter.com)
ちなみにオイラはCovenantの完成が待ち遠しいプログラミングできない情報発信好きアスペルガーw
The Covenant Project
概要
Covenantは、純粋P2Pのファイル共有ソフトです
目的
インターネットにおける権力による抑圧を排除することが最終的な目標です。 そのためにCovenantでは、中央に依存しない、高効率で検索能力の高いファイル共有の機能をユーザーに提供します
特徴
Covenant = Bittorrent + Abstract Network + DHT + (Search = WoT +
576:PoW) 接続は抽象化されているので、I2P, Tor, TCP, Proxy, その他を利用可能です DHTにはKademlia + コネクションプールを使用します UPnPによってポートを解放することができますが、Port0でも利用可能です(接続数は少なくなります) 検索リクエスト、アップロード、ダウンロードなどのすべての通信はDHT的に分散され、特定のサーバーに依存しません 8
577:デフォルトの名無しさん
16/05/04 06:10:29.02 0hExvDHP.net
>>563,569
URLリンク(atom.io)
URLリンク(www.sublimetext.com)
578:デフォルトの名無しさん
16/05/04 09:13:01.47 bRkFYhVs.net
>>563
MSDNの、IE11・F12 開発者ツールの使い方を参照
579:デフォルトの名無しさん
16/05/05 10:19:03.70 ydt/wr9U.net
>>567
真面目に聞いてる人が放置するのか
580:デフォルトの名無しさん
16/05/05 10:44:15.30 fknk/t2B.net
最強のエディタはVSと相場は決まっておる
他のエディタはロクなインテリセンスのないゴミばかりだよ
581:デフォルトの名無しさん
16/05/05 11:52:59.62 SMfsRko8.net
notepad 最強伝説
582:デフォルトの名無しさん
16/05/05 11:57:07.40 F9EaZa1N.net
自己満足が最強
583:デフォルトの名無しさん
16/05/06 00:24:25.24 4boKzuh/.net
エディタなら秀丸一択だろうが
4200円するけどそれだけの価値はある
584:デフォルトの名無しさん
16/05/06 08:25:56.04 wkAp2vOU.net
否
秀丸は世界的でなくDTDを採用していたりと外も中も古臭く拡張を作りづらく
JSのように日進月歩で絶賛進化中の言語情勢に全くついてこれていない
585:デフォルトの名無しさん
16/05/06 10:19:44.07 XipIUMCb.net
chrome developertoolコンソール
インテリセンスもあるし
586:デフォルトの名無しさん
16/05/06 10:22:17.38 SIBOz9L4.net
秀丸はもうだいぶレガシーになってしまったな
少し前はNotepad++だったけどそれも過去になった
今のところAtomがいいけど
ちょっと重いんでVS Codeに期待
587:デフォルトの名無しさん
16/05/06 12:30:06.56 QA9WXQLh.net
禿丸って、ちゃんとインテリセンスある?
588:デフォルトの名無しさん
16/05/06 13:06:16.77 b+5YqGKq.net
秀丸ってまだ存在してたんだ
589:デフォルトの名無しさん
16/05/06 14:17:41.74 G4Kxj38O.net
4200円ていつの時代の話だよ
590:デフォルトの名無しさん
16/05/06 19:01:56.63 tQEExFw/.net
ternjsさえのれば、どの環境でもだいたいおなじくらいのインテリセンスなのかなあと思った
それ以上はTypeScript使わないかぎりしんどい気がする
591:デフォルトの名無しさん
16/05/06 21:49:21.53 qd0GNKqW.net
みなさん、javascriptってこの先生き残ると思いますか?
592:デフォルトの名無しさん
16/05/06 22:08:01.20 zDXbuI6Z.net
ブラウザで動く言語としてはJavaScriptは確実に生き残るだろう。
その他のaltJSは殆どが死滅するはず。JavaScriptの上位互換といえるような
TypeScriptだけがMSの興味を引いている限り生き残る。
COBOLが生き残ってることからもわかるように、
特定の分野で多く使われた言語は長く生き残るものだよ。
言語仕様の良し悪しじゃない。
死滅した言語っていうのはVBやDelphiだけど、
これは開発元が開発をやめたか大幅に縮小したため。
逆に言えば開発元が開発をやめない限り使い続けられる。
そしてJavaScriptの開発元はどこか?MS、Google、Mozilla、他
このように複数あるから開発を一斉にやめるってことがまず考えられない。
加えて改良が進められているから辞めようって声も上がらない。
辞めるぐらいなら改良すればいいわけだからね。
593:デフォルトの名無しさん
16/05/06 22:49:31.18 HS1krX3+.net
>>586
Delphiとか当時は革新的だったよなぁC++Builderとかとともにお世話になった。
その中の人が今はc#やtypeScript作ってるんだよね。
594:デフォルトの名無しさん
16/05/07 00:27:39.35 H9AjK5sV.net
FileReaderで画像の複数読み込みを行って、画像とファイル名を対に表示したいのだけど、非同期ゆえ一致しない場合がでてくるのですが、何か良い方法はないでしょうか?
var name = new Array();
var data = new Array();
$('#images').on('change', function (event) {
var files = $(this).prop('files');
var fileReader = new Array();
for (var i = 0; i < files.length; i++) {
name[name.length] = files[i].name;
fileReader[i] = new FileReader();
fileReader[i].onload = function (event) {
var n = data.length;
data[n] = event.target.result;
$('body').html($('body').html() + '<div>' + name[n] + '<img src="' + data[n] + '"></div>');
};
fileReader[i].readAsDataURL(files[i]);
}
});
595:デフォルトの名無しさん
16/05/07 01:25:28.41 R3j+TLGo.net
jQueryって毎回スクリプトタグ書かないと動かないんですか?
596:デフォルトの名無しさん
16/05/07 04:30:24.07 S68KOTjs.net
jqueryでreplaceする時にreplace(/test/g,'test2')みたいなコードみたんだが、検索文字列をなぜクォーテーションで囲ってないのだ?
このトークンはどういう扱いになっているの?
当方、javasctipt初心者です。
597:デフォルトの名無しさん
16/05/07 04:45:54.23 S68KOTjs.net
正規表現オブジェクトというのね。
自己完結しました。
598:デフォルトの名無しさん
16/05/07 08:19:51.56 nYaS7NzX.net
>>589
jQueryに限らず、外部スクリプト化したいなら<script>を書かなければならない
onclick属性やonload属性等のイベントハンドラ属性だけで完結できるならこの限りではない
599:デフォルトの名無しさん
16/05/07 08:44:10.25 nYaS7NzX.net
>>588
画像とファイル名は同時に表示出来ているのでは?
それよりも document.body を上書きしていたり、jQueryを使っているにも関わらずfileReader[i].onload のような素のJavaScriptコードが見られたり、HTML出力でfilesと同じ順序を保証していない事が気になる
600:デフォルトの名無しさん
16/05/07 11:48:23.84 98qiMegf.net
>>589
JavaScriptのこういう所は何とかして欲しいよ
コードのモジュール化、再利用がめんどくさすぎる
未だにブラウザ間で最低限の互換性すら取れてないし
IT業界の最前線で使われている言語とは思えない
601:デフォルトの名無しさん
16/05/07 12:11:46.43 7m+gJQ3f.net
何言ってだこいつ
602:デフォルトの名無しさん
16/05/07 12:22:16.57 //iuahhd.net
頭悪いんだろうからほっとけよ
603:デフォルトの名無しさん
16/05/07 12:40:50.09 98qiMegf.net
いやいやこれに同意できないって相当毒されてるぞ
JS以外の言語触った事無いのか?
604:デフォルトの名無しさん
16/05/07 12:47:05.73 bc2M0je5.net
あなたこそ梅毒でも煩ってるの?
ここよりお医者に行くべきだよ
605:デフォルトの名無しさん
16/05/07 12:58:07.39 H9AjK5sV.net
>>593
コードに関しては、非同期部分の問題となってる部分をチェックしていただける方がおられた場合に簡単にテストできるよう、
ポイントに絞ったものとなってますので、最終的にはファイル名ソートもしくは入力順に表示するつもりですし、もちろんdocument.bodyの上書きなど行うこともありません
ですので問題定義以外の部分でのコードの粗はご了承ください
さて、このコード、確かに画像と名前は同時に表示されますが、「filesと同じ順序を保証していない」とご理解いただけてるように、
nameはfiles順に代入されていきますが、dataは読み込み完了時に代入され、書き出しもそのタイミングです
1:サイズ大
2:サイズ中
3:サイズ小
と、あった場合、nameは1,2,3、dataは概ね小、中、大と代入されていき、対になって表示されることは保障されていません
606:デフォルトの名無しさん
16/05/07 12:59:41.90 98qiMegf.net
>>598
可哀想なやつだな
まあ生き方は人それぞれか
607:デフォルトの名無しさん
16/05/07 13:07:53.42 HCFqFuTE.net
>>594,597
多分、あなたがいっているJavaScriptはクライアントサイドスクリプトの事だろうが、クライアント側の環境に依存するから簡単に後方互換性を捨てることが出来ない
Node.jsなら十分可能だから
クライアントサイドスクリプトは製作側の環境だけ整えても仕方ないのだから言語の問題というよりもユーザのリテラシーや古い環境に固執すユーザの考え方の問題
ES6でモジュール管理機能が追加されているから古いブラウザを切り捨てる気があるなら可能
現状ではAltJSを使うなり、Babelでトランスコンパイルするのが妥協点
608:デフォルトの名無しさん
16/05/07 13:18:35.30 HCFqFuTE.net
>>599
onload 時に出力結果を配列 or DocumentFragment にキャッシュしておき、その要素数が files.length と一致したら document.body.appendChild してみては?
609:デフォルトの名無しさん
16/05/07 15:09:05.53 NRmKgF8p.net
そもそもWebという仕組みがモジュール化しずらいんだから仕方がない
HTML5+でパッケージングの案とか出てたけど立ち消えになったしな
610:デフォルトの名無しさん
16/05/07 16:24:25.14 rW+w2i1Z.net
Microsoft全てを委ねていればこんな体たらくにはなってなかった
611:デフォルトの名無しさん
16/05/07 17:31:40.76 q+dYax/I.net
どいつもこいつもジャップは母国語すら満足にしゃべれなくなったのか?
612:デフォルトの名無しさん
16/05/07 17:50:30.87 7m+gJQ3f.net
void 0 === a && ~~
と
a === void 0 && ~~
こういうのってどっちがいいとかある?
613:デフォルトの名無しさん
16/05/07 17:54:47.43 kizhSvpl.net
結果を先に書いておかしいと思わないの?
おまえセンスねえからやめたほうがいい
614:デフォルトの名無しさん
16/05/07 18:14:28.17 v072DMKU.net
>>604
おうJScriptが主流になってたな
615:デフォルトの名無しさん
16/05/07 19:18:58.60 PsySjkPg.net
>>604
そんなことしてたらここまでブラウザは進化しなかった
616:デフォルトの名無しさん
16/05/07 19:25:18.36 rW+w2i1Z.net
こういうバカな反逆者がブラウザの正しい進化の道を閉ざしてきたんだな
617:デフォルトの名無しさん
16/05/07 19:26:31.11 JbOpDSya.net
>>594
ブラウザ間の最低限の互換性は取れてるような。
caniuseでも通してみりゃわかるだろうけど。
モジュール化も、module.exportsして今のところはwebpackか何か通しておけばいいんでないの?
618:デフォルトの名無しさん
16/05/07 20:07:07.26 rW+w2i1Z.net
手段があるなら良いってもんじゃ無いよね
当たり前のようにサポートされてないって事がweb業界のリーダー達の怠慢を表してる
Microsoftがリーダーになっていればこうはならなかった
619:デフォルトの名無しさん
16/05/07 21:10:40.66 kFFwjeQZ.net
スレ違いだったらすいません。webプログラマーを目指そうかどうか、悩んでいます
SQLやフレームワークでデータを引っ張ってきてphpでhtmlを生成し、htmlにcssで装飾し、jsで動きをつけて・・・と思っていたのですが、
IE8や下手するとIE6の対応、IEはJscriptというjavascriptと少し違う言語…などの変な多様性に悩んでいます
いくつかサイトを作ってみましたが、IE6で動かなかったり、携帯ブラウザで表示が崩れたりして大変困っています。
困っているというか、どうしていいかわかりません。
ブラウザ間の違い等、どこまでサポートしているかなどの基準はあるのでしょうか?
620:デフォルトの名無しさん
16/05/07 21:14:56.21 znoXDAwn.net
>>613
文面を見るかぎりWebプログラマーには向いていないと思うので別の道を探してください
621:デフォルトの名無しさん
16/05/07 21:20:22.07 rZxk5OUW.net
ES6 module が来ても HTTP で GET している限り、パフォーマンス低下は免れないわけで何が嬉しいのか良くわからん
CSS の @import のように始めの頃だけ重宝されていずれ使われなくなる気がする
moduleが必要だとは思うが、>>611のいうようにwebpackでbuildすれば最適なパフォーマンスが得られるわけでブラウザ側で実装する必要性を感じない
622:デフォルトの名無しさん
16/05/07 21:38:26.64 rZxk5OUW.net
>>613
今時、IE8- は古すぎると思うけど、顧客の要求仕様か特殊な案件?
各種フレームワークのサポートブラウザを確認
互換性情報はWebにあふれているから活用しようか
URLリンク(caniuse.com)
URLリンク(www.quirksmode.org)
URLリンク(kangax.github.io)
URLリンク(msdn.microsoft.com)
URLリンク(developer.mozilla.org)
623:デフォルトの名無しさん
16/05/08 01:45:49.69 a6za2jQ4.net
>>588
そもそも複数のリソースファイルは、5個ずつパラレル読み込みで、
複数あるサーバーのどこから読み込んでいるのかすら、わからない。
どのファイルが先に読み込まれるかも、当然わからない
F12開発者ツールで、リソースの読み込みタイミングを見てみ
onChange は、要点に関係ないだろ
>new Array();
[]; 空配列リテラルを使う
>>613
IE6なんて、対応しないだろ
CSSもツールで、関数(ミックスイン)で書く。
Sass & Compass 徹底入門、2014
他に、Bourbon にも、ミックスイン集がある
624:デフォルトの名無しさん
16/05/08 02:14:54.64 OocjjMXM.net
>>599
> nameはfiles順に代入されていきますが、dataは読み込み完了時に代入され
答え自分で書いとるやないかーい
fileReader[i].onload = function (event) {
var n = data.length;
 data[n] = event.target.result;
}
↓
fileReader[i].onload = (function (n) {
return function (event) {
data[n] = event.target.result;
};
})(i);
625:デフォルトの名無しさん
16/05/08 02:15:33.52 OocjjMXM.net
s/ / /g
626:デフォルトの名無しさん
16/05/08 11:04:13.34 J2x5cRTw.net
>>618-619
bodyへの挿入処理がない
多分、>>602の通りの実装にするんだろうけど
627:デフォルトの名無しさん
16/05/08 13:29:51.82 P/nJjC5X.net
ID:H9AjK5sV です
ID:OocjjMXM 様のCallback使う手法でうまくいきました
レスして頂いた皆様、有難う御座いました
628:デフォルトの名無しさん
16/05/09 08:47:40.90 W7sFbKKM.net
jQueryで作っているんですが
下のような内容でボックスのどこでもクリックやタッチしたらclass = "box"のIDを
変数に取得したいんですが商品名や説明があるところだと
クリックやタッチは反応してるんですがIDが取れません。
商品名のところでクリックやタッチしてもclass = "box"のIDを取得できる書き方はありませんでしょうか?
$(".box").click(function(event){
var boxId = event.target.id;
}
<div class = "box" id ="item1">
<div class = "title">商品名1</div>
<div class = "text">説明1</div>
</div>
<div class = "box" id ="item2">
<div class = "title">商品名2</div>
<div class = "text">説明2</div>
</div>
629:デフォルトの名無しさん
16/05/09 08:58:44.04 dyobdVC7.net
>>622
hasClassやclassListで分岐処理して
event.target.parentNode.id
630:デフォルトの名無しさん
16/05/09 16:48:27.63 wbQMz1Tb.net
>>622
event.currentTarget.id
631:デフォルトの名無しさん
16/05/09 21:03:12.68 o7YvYv9W.net
jQueryってそんなにありがたがるようなものかな
最近は無くて困る事ってそんなにないよね
632:デフォルトの名無しさん
16/05/10 00:01:34.91 yLtf5w/x.net
>>625
jQueryは便利だから使うんだよ。
jQuery使ったほうが便利なのに、使わなくても不便だけど頑張れる。
だから使わない。なんて考える人はおかしな人だよ。
633:デフォルトの名無しさん
16/05/10 00:04:42.17 yLtf5w/x.net
>>624
$(".box").click(function(){
var boxId = this.id;
});
これでいけたよ
634:デフォルトの名無しさん
16/05/10 08:52:13.41 4ts0a3G7.net
>>625
クロスブラウザ的にはjQueryがなくて困るケースは減ったね
DOMを学習してクロスブラウザなコードを書いた事がある人にとっては今までの自分の資産(コード)があるし、jQueryはなくても困らないと思う
今までクロスブラウザに苦労してjQueryの便利さに触れた人がブラウザの対応度を調べる手間を惜しんで惰性で使ってるんじゃないかな
635:デフォルトの名無しさん
16/05/10 10:27:37.59 AYSgFkex.net
>>626
jQueryは確かに便利なとこもあるだろうが、
俺にとっては「標準でない」という時点でとても不便なんだけどな
636:デフォルトの名無しさん
16/05/10 11:19:26.96 F0daG/eG.net
>>629
標準でないものを全く使わずに、何万行もコード書くとか疲れないか?
637:デフォルトの名無しさん
16/05/10 11:27:59.90 idlWyZE5.net
1. jQueryクソ!バニラJS最高!
2. DOM操作面倒になってきた…
3. 簡単に書けるラッパー用意したぜ!
4. クソオレオレDOM APIの歴史が銀河にまた1ページ
638:デフォルトの名無しさん
16/05/10 12:00:17.53 4ts0a3G7.net
>>324-389で出た話題の焼き直しかな
DOMが面倒と思うのは結構な確率で思い込みだと思う
自分なりのコーディングの型が身につけば snippet で楽になる
querySelectorAllが出来てからは大分楽になった
iteratorが出来てからは更に楽だね
639:デフォルトの名無しさん
16/05/10 12:08:57.36 pM7kjGoW.net
Web制作板で見た流れだな
スレリンク(hp板:839-960番)
640:デフォルトの名無しさん
16/05/10 13:34:07.61 IOgaEvdb.net
すんごい初心者的な質問かもしれないんだけど
jsonの形のデータを返すプログラムやらcgiやらがあるとして、
これをブラウザなりnode.jsなりが配列として受け取りたい場合は、レスポンス/返り値を受け取ってeval()が基本?
とりあえずブラウザでdocument.createElement('script')するとかjqueryのgetJSONとかは考えないものとして
641:デフォルトの名無しさん
16/05/10 13:41:24.58 Rtf28uts.net
>>634 JSON.parse
642:デフォルトの名無しさん
16/05/10 13:44:05.16 GuxwfwYt.net
>>634
JSON.parse
643:デフォルトの名無しさん
16/05/10 13:45:46.76 IOgaEvdb.net
>>635-636
言われたJSON.parseをMDNでみてきた、ありがとう
どうみても初心者丸出しでした本当にありがとうございました
644:デフォルトの名無しさん
16/05/10 16:37:13.26 a8SwGUA2.net
jQueryは壊滅的に見た目がダサい
記号多すぎ
645:デフォルトの名無しさん
16/05/10 16:39:32.39 z09te98I.net
>>637
「JSON JS」でググるくらいはしよう
646:デフォルトの名無しさん
16/05/10 16:42:23.47 JGlnd6eX.net
JavaScriptを書くとソースが長くなるのが欠点だわ
DOMにしてもセンスが無い
647:デフォルトの名無しさん
16/05/10 17:57:38.15 rBTKy2Ex.net
DOMは基本JSとは別物で言語に囚われない規格だよ
648:デフォルトの名無しさん
16/05/10 20:07:10.97 p4MwWBVW.net
質問です。
ラジオボタンが一つも選択されていない状態では送信ボタンを押せないか無効化させる方法ってありますか?
649:デフォルトの名無しさん
16/05/10 20:29
650::07.07 ID:FqZqz1a/.net
651:デフォルトの名無しさん
16/05/10 21:18:32.65 zqmBWtQQ.net
>>642
JavaScript によるバリデートは抜け道があるのでサーバサイドでのチェックも忘れずに
1.JavaScript で <input type="submit"> を input.disable = true にする
2. <input type="radio"> を change イベントで監視して全てのラジオボタンが選択されたら input.disable = false にする
652:デフォルトの名無しさん
16/05/10 23:08:08.13 yLtf5w/x.net
>>632
> DOMが面倒と思うのは結構な確率で思い込みだと思う
いや事実。
比較表でも作ってみればいい。
50%以上、jQueryの方がコードが短くなる。
50%は大きいで?
653:デフォルトの名無しさん
16/05/10 23:21:01.17 KuwcBTwn.net
>>644
その方法で抜け道ってどんな?
654:デフォルトの名無しさん
16/05/10 23:37:57.18 uAV2Alwm.net
適切な設計とモジュール化を行っていけばjQueryがあってもなくても大差ない
それがうまくできてないんだろうね
いやできていないというよりはサボってjQueryで誤魔化しているというべきか
そしてこういうコードはスケーラビリティが低く変化に弱いと相場は決まっている
655:デフォルトの名無しさん
16/05/10 23:40:05.80 WbwZXmAZ.net
>>645
何を言ってんだか
jQueryみたいなライブラリで短くなるのは当たり前でしょ
むしろそうじゃなければ存在意義が全く無い
そしてコードが短くなることと面倒でなくなることは繋がっていない
例えば他人が書いたコードを読むのであればjQueryの方が「面倒」だろうよ
656:デフォルトの名無しさん
16/05/10 23:48:31.48 yLtf5w/x.net
>>648
読む量も減るから楽になるよ。
面倒に対するアプローチには二通りある。
一つは勉強するのが面倒だからと勉強を避ける。
一見楽なように見えるが、知識がないからもっと楽な道を選べずにひたすら
単純作業を繰り返すことになる。勉強する面倒さを避けたがために面倒になる。
もう一つは勉強する面倒さを受け入れることで、もっと効率のいい方法に到達する。
急がば回れの言葉通り。最初に勉強という面倒なことをやることで、
その後ずっと楽になる。
657:デフォルトの名無しさん
16/05/10 23:57:03.18 uAV2Alwm.net
なぜコード量が大幅に減るか
それは本来モジュール化すべき重複したコードが大量にあるからなんだな
例えば100箇所に同じようなコードがありjQueryでそれを削減したとしよう
しかしちゃんとしたプログラマは1箇所に処理を纏めて再利用して重複を減らすだろう
この場合jQueryで削減できるコードは先の場合の1/100でしかない
しっかりしたコードを書くほどjQueryの恩恵は小さくなるのだ
658:デフォルトの名無しさん
16/05/10 23:58:28.27 yLtf5w/x.net
誰かが「面倒」といったとき、勉強するのが面倒と言ってるのか、
その後の作業が面倒と言ってるのかを見極めないといけないね。
どんなことでも作業を楽にするには、勉強する面倒さを
乗り越えないといけない。勉強して知識と技術がつけば作業は楽になる。
自動車の運転しかり、パソコンに使い方しかり、数学の公式しかり
作業ではなくて、勉強するのが面倒と言っているやつは、
そこまでのやつってことだよ。
659:デフォルトの名無しさん
16/05/11 00:00:25.17 ye4EAN+q.net
>>650
そのしっかりしたコードが、jQueryを使った場合と
使わない場合で、倍のコード量になってくるんだよ。
これ以上は絞り込めないといったコードで比較した話なんだから。
660:デフォルトの名無しさん
16/05/11 00:01:12.32 ye4EAN+q.net
ato
jQueryで楽々削減するのと、
しっかりと書かないと減らせないのとでは
面倒さも違ってくるだろw
661:デフォルトの名無しさん
16/05/11 00:43:36.75 wiJHIT3v.net
>>652
短く書きたいのなら別にjQueryでなく様々なものがある
jQueryは互換性を保つという点が薄れてきた今となっては極めて中途半端な存在
ちょっとしたことなら、わざわざ何かを導入しなくとも昔より発展した標準APIを使えばいいし、
それ以上のことでDOM操作を頻繁にするなら仮想DOM系の方がパフォーマンス的にも良い
それ以上ならフレームワークを使う
いずれにしろjQueryのパターンは古臭く、今ちょっとした味付けが欲しい場合は
Observableパターンと標準APIを使ったほうが良い
662:デフォルトの名無しさん
16/05/11 01:29:13.56 ye4EAN+q.net
>>654
たかだかHTMLにちょっと動きをつければいい所に
AngularとかReactとか持ち出すのは過剰。
jQuery程度がちょうどいいんだよ。
標準APIが発展? 冗長なのは変わってないだろ。
jQueryを使えばDOM APIよりも短くなるのは明らか。
比較一覧で証明された。
短くシンプルに書くのが目的であって
道具を導入するのが目的ではない。
663:デフォルトの名無しさん
16/05/11 01:30:48.00 x+4ifnQN.net
短く書ける事が即作業能率に繋がるわけじゃないんだけどな
document.getElementById('hoge')
$('#hoge')
確かにDOMの方が3倍長いけど、コード補完を使うから入力速度は大して変わらんね
664:デフォルトの名無しさん
16/05/11 01:41:26.30 mC1n68eU.net
>>655
jQueryはプログラミングに詳しくない人が本体とプラグインを使って
コピペ+αでそれなりのものを作るためのもの。
少しコードが多くなるとデバッグも適切な設定をしないと困難だし、
短くシンプルに書くためのものなんてのは誤った危険な認識だよ。
そしてjQueryは実際はそれ自体が目的で使われてる。
便利だからではなく、便利と思って使ってきたから、また使うとなってるだけ。
その無意味なスパイラルから抜け出さないと何時までも停滞したままだよ。
665:デフォルトの名無しさん
16/05/11 01:53:32.30 mC1n68eU.net
確かにDOMを平に見て弄りまくる場合にはjQueryは適してると言えるが
そんなに弄りまくる場合にはVirtualDOMを使うのが最近の流儀でメリットも沢山あるし
できればそもそもそんなことはしないで各種モジュール化するというのがより良い解決策
そしてモジュール化するとなったら特にjQueryのような平に影響を与えるライブラリは邪魔になり
必然的に標準仕様と、時期が来ればいつでも外せる少量のポリフィルを使うことになり
それが嫌なら全てをまとめて抽象化してくれるフレームワークの出番になる
jQueryはDHTMLだとかそういう時代には合ってたが、今jQueryが生まれた背景事は殆ど解決し
より良い解決策がたくさんあるのにあえてその古くて悪いスタイルを推すことは無いだろう
666:デフォルトの名無しさん
16/05/11 02:08:46.99 z7XWs6Or.net
>>5を読んだら次からスルーしてね
667:デフォルトの名無しさん
16/05/11 06:05:18.26 qJ1gI9ow.net
こいつが当人なんだから言うこと聞くわけないじゃん
668:デフォルトの名無しさん
16/05/11 06:05:43.37 T3iqLJ21.net
javascriptは流行の移り変わりが激し過ぎて、現在の最善手が1年後の時代遅れになりそう
触る人全員が最新技術を追いかけられればいいけど、それが無理なら枯れていて情報量が多く、あんまりわからん人でも気合で押し切れるjQueryは有用に感じる
669:デフォルトの名無しさん
16/05/11 06:48:45.94 udOmff2f.net
jQueryで削減できるのは末端のコーディングコストでしかない
重要なポイントは設計のコストでありjQueryにはこのコストを削減する力はない
むしろ全体の工数を削られたことによって設計が疎かになる可能性の方が恐い
670:デフォルトの名無しさん
16/05/11 07:06:15.34 XhqmdNgU.net
jQueryの悪さってもっと別のところにあると思う
EWMに沿ってライブラリが標準と共闘して活躍するのが理想だけど
jQueryは完全に自分の世界を築いちゃって相容れないこと
まあこの先の進化で自ずとそうなっていくだろうけど今はまだデファクトとして認められないね
671:デフォルトの名無しさん
16/05/11 07:15:59.11 XhqmdNgU.net
>>661
ブラウザのアップデートが一月半毎なことを考えると、時代遅れになるのは3ヶ月くらいのスパンだと思う
とは言えここ1年はESのアップデートが中心で、WebAPIはマイナーな調整が殆ど
来年以降HoudiniとかEWMに沿う低レベルの仕様がまたどんどん出てくると思う
672:デフォルトの名無しさん
16/05/11 08:16:21.66 7o2M3lBg.net
IE11 しかサポートしなくていい人は気楽だのう。
673:デフォルトの名無しさん
16/05/11 08:31:45.67 47ZN8m01.net
IE11以上サポートなんて半端なことよほどじゃないとしないでしょ?
Edge以上か、IE9以上か、プログレッシブエンハンスメントにして機能で篩い分けるか
の3択で今行ってる
674:デフォルトの名無しさん
16/05/11 09:08:23.44 ye4EAN+q.net
>>657
> jQueryはプログラミングに詳しくない人が本体とプラグインを使って
> コピペ+αでそれなりのものを作るためのもの。
という勘違いをしている人が、jQueryを悪く言ってるんだよねw
675:デフォルトの名無しさん
16/05/11 09:09:01.34 ye4EAN+q.net
>>663
Angularの悪さってもっと別のところにあると思う
EWMに沿ってライブラリが標準と共闘して活躍するのが理想だけど
Angularは完全に自分の世界を築いちゃって相容れないこと
好きな言葉に置き換えればいいよw
676:デフォルトの名無しさん
16/05/11 09:09:58.99 ye4EAN+q.net
>>658
> 確かにDOMを平に見て弄りまくる場合にはjQueryは適してると言えるが
> そんなに弄りまくる場合にはVirtualDOMを使うのが最近の流儀でメリットも沢山あるし
手段と目的が逆になってるw
VirtualDOMをいじらなくていいような簡単な所を
わざわざ複雑にするなや
677:デフォルトの名無しさん
16/05/11 09:47:54.59 LV2XLOSJ.net
一般的な記述でjQueryを使用して書けばソースが約半分になるは事実だ
どうして屁理屈をこねて反論するのだろうか?
jQueryを使用しているとJavaScriptを本質的に理解していないと
自己解釈しているだけだろw
678:デフォルトの名無しさん
16/05/11 10:17:41.47 x+4ifnQN.net
Virtual DOMはDOMが遅いから生まれたのであって独自の世界になるのは当然
AngularJSはMVC設計を取り入れているからMVCをやりたい時に使う
「では、jQueryは何をしたいが為に使うのか」という話だよな
記述量が半分になるメリットだけではjQueryの世界に没入するデメリットを相殺しきれない
679:デフォルトの名無しさん
16/05/11 11:00:32.08 kvpM6w4K.net
>>644
1はなんとかできたけど
2がわからない…
680:デフォルトの名無しさん
16/05/11 11:27:16.56 x+4ifnQN.net
>>672
どこがわからないのかわからんけど、form.elements['inputName'] で各要素を参照できる
681:デフォルトの名無しさん
16/05/11 15:35:23.12 m6oW+Aes.net
ここでjqueryに執着している奴は他の言語をあまり知らないんだろうな。jqueryなんてjsやる時に使えば便利という程度だろ。
c++とかc#とかもやるといいよ。
682:デフォルトの名無しさん
16/05/11 15:38:05.91 S3kH2EJT.net
忙しい調理場で「ハサミで切ったほうが丁寧に切れますよ」とか言ってくるやつがいたら
「さっさといつも通り包丁で切れよ」って思うだろうな
もちろんjqueryが包丁な
683:デフォルトの名無しさん
16/05/11 15:45:03.20 LV2XLOSJ.net
もうやめようよ
馬鹿と何とかは使いようっていうしなw
684:デフォルトの名無しさん
16/05/11 18:02:34.45 716xjHj3.net
>>668
それは機能の寄せ集めである典型的なライブラリであるjQueryにこそ最も強く言えることであって、
AngularJSは別物だよ
685:デフォルトの名無しさん
16/05/11 20:35:53.97 xrNZw1On.net
>>671
Virtual DOMはテストがやりやすくなるし
標準の代わりとしてまだ分かる
jQueryはむしろテストがしにくくなる
ただの餓鬼の玩具
686:デフォルトの名無しさん
16/05/11 20:42:34.87 w9XqkPaB.net
お前らの価値観とかどうでもええわ
687:デフォルトの名無しさん
16/05/11 22:00:50.15 ye4EAN+q.net
>>671
> jQueryの世界に没入するデメリットを相殺しきれない
デメリットって勉強するのが面倒くさいって話?
それって、その人自体のデメリットだよね。
勉強が嫌いな人に仕事を任せるのはデメリットw
688:デフォルトの名無しさん
16/05/11 22:06:23.24 ye4EAN+q.net
>>678
同じ理屈で
Virtual DOMはテストがやりやすくなるし
標準の代わりとしてまだ分かる
DOM APIはむしろテストがしにくくなる
ただの餓鬼の玩具
といえるんだよw
DOM APIとjQueryならば、jQueryを使ったほうがいい。
689:デフォルトの名無しさん
16/05/11 22:08:36.24 S3kH2EJT.net
すぐに廃れるものは勉強めんどいのわかるが
jqueryは勉強しといて損はないだろ
つーか勉強ってほどでもない
JS知ってりゃ1日で慣れる
690:デフォルトの名無しさん
16/05/11 22:08:53.06 ye4EAN+q.net
>>677
> それは機能の寄せ集めである典型的なライブラリであるjQuery
何を言ってるんだ?
jQueryはDOM APIの置き換えであって、
お前が言ってるのは(野良)jQueryプラグインの話だろ?
jQueryはオブジェクト指向型のDOM APIを関数型のプログラミングが
できるように置き換えるライブラリだよ。
(※ブラウザ間の互換性を吸収するライブラリではない)
691:デフォルトの名無しさん
16/05/11 23:12:52.71 O2+YRvW5.net
scって>>レス番にマウスポインタ持っていくと、返信先のレスが表示されますよね?
あれってどういう仕組みでしょうか?
ツールチップではないみたいですが
692:デフォルトの名無しさん
16/05/11 23:42:07.24 IeznZ4jj.net
まぁ、DOM操作をするか、何かにバインドするか、毎回一定範囲ごともらうかは思想次第だからなぁ。
書こうと思えば、jQueryだけでSPA書けるだろうし、その時にDOM足したり消したり細かくするか、innerHTMLごとサーバから貰うかも思想だし。
俺はinnerHTMLを毎度やりとりしてた派だから、今のreactの流れは当然の結果に落ち着いたとも思うし、
逆にクライアントサイドで何もかも済ませて、restfulなapi呼び出ししかしない、その上でクライアントサイドの状態と表示が不一致になるのを避けたり、コンポーネントとして再定義するという意味ではvue.jsは好き。
angularは収集つかなくなってる感が凄く嫌だな。
693:デフォルトの名無しさん
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を使わないと長くなるなw
698:デフォルトの名無しさん
16/05/12 02:43:56.98 Xc9f48N7.net
>>685
Reactは高品質な(準)標準UIコンポーネントが作られれば普及すると思うよ。
そういう世の中になったら、jQueryを嫌がるのと同じように
○○コンポーネントは使うな自作しろとか言うやつが出てきそうだけどw
で、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を勉強した方がいい
この先月に1回未満くらいしか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(ry
エラーなら終了
その後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は出番なしw
737:デフォルトの名無しさん
16/05/12 22:36:45.62 Xc9f48N7.net
>>725
> まだこんなのがいるんだな
そりゃそうだろw
例えば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
> タブは瞬殺。
瞬殺と言うのなら、そのコードを書いたほうが楽じゃないのか?w
ちなみに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はそもそも文書を書くものなわけで。
例えば論文だと思えばいいよ。
第一章、第二章、第一節、第二節なんてがあるような。
そういう論文形式のウェブページをコンポーネントにするのがおかしい。
論文ページコンポーネントがあって、一章コンポーネントがあって
その中に一節コンポーネント、二節コンポーネントがあるとかやる気かねw
ネットはこのような論文やブログ形式のサイトが多いわけで
そういったページを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の修正がメインなんだけどw
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
そんだけなわけないだろw ↓これでいいかい?
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関係ない話してるの?w
758:デフォルトの名無しさん
16/05/12 23:03:22.74 iX4T91tZ.net
>>743
学生プログラマだから業界はよく分からん
759:デフォルトの名無しさん
16/05/12 23:05:07.78 Xc9f48N7.net
>>744
はぁ? 俺は論文的なサイトにおいて、
コンポーネントはページの中の一部に入れるもので、
コンポーネントを内包している外側は、コンポーネントに
はならないって話をしてるんだが?
それなのに>>736が
> だいたいコンポーネントとコンポーネントを繋ぐものとかねえよ。
> 「コンポーネントとコンポーネントを内包した」コンポーネントでしかない。
とかいい出したんだろw
俺の話に流れを戻すと、コンポーネントとコンポーネントを繋ぐものが必要になる。
それが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の、さらにクリックのイベントでそんなことするのかいよいよ頭おかしい。
俺はググってコピペしただけですーw
ついでに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
> 俺ならサーバサイドでレンダリングするわ。
なにを? コンポーネントを?
それともコンポーネントじゃないものを
外側にするの?w
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
まあ色々パターンは有る。
チェーン内で1つ1つプロミスを作って、外部関数はコールバックベースというのが1つ。
でもそれよりも良いのが、外部関数がプロミスを返すようにすること。
そうすると特にメイン部分のコードはこんなにシンプルになる。
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)