+ JavaScript の質問用スレッド vol.123 + [転載禁止]©2ch.net
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-4のテンプレを読んだ上で質問してください。
■質問を書く上で
(1) 煽り、コード制作依頼等、人を不快にさせる投稿はご遠慮下さい。公序良俗を守った応対を心がけてください。
(2) 他の人に迷惑をかけるスクリプトの質問はご遠慮ください。
(ブラクラ、[戻る], [閉じる], [クリック] の妨害、画面占有など)
(3) 質問者及び議論を行う人はメール欄を空欄にし、名前にレス番を入れることを強く推奨します。回答者はなりすましを判断できませんので、なりすましが現れても自己責任となります。
(4) 常に自発的に調べる心構えを持ってください。
具体的には「自分で調べてから質問する」「回答をもらってわからない単語があればGoogle検索してみる」など。
わからない内容を代わりに調べてくれる回答者をお望みの方は余所で質問してください。
(5) 出来るだけ一般的な用語を使用してください。脳内オレオレ用語は混乱の元です。
(6) 出来るだけサンプルコードを掲示してください。言葉による説明は行き違いが生まれる場合があります。
※必ず「問題の事象が再現されること」を確認してください。
必要な部分だけ切り出したつもりで現象が再現できていなかったケアレスミスがしばしば見られます。
(7) サンプルコードに HTML が含まれる場合は http://validator.w3.org/ で [Check] してみてください。
(8) 質問を具体的かつ詳細に書くと回答を得られやすいです。>>2の質問テンプレートを活用してみてください。
(9) 時にはあなたが望む「答え」だけでなく、「意見」などが寄せられる場合もあります。
+ JavaScript の質問用スレッド vol.122 +(c)2ch.net
http://peace.2ch.net/test/read.cgi/hp/1420095379/
（ライブラリ禁止条項は、多数の意見によって廃止されました。ライブラリの質問もOKです） + JavaScript の質問用スレッド vol.123 + [転載禁止](c)2ch.net
http://peace.2ch.net/test/read.cgi/hp/1423915644/
↑のスレのタイムマシンみたいですね
オリジナルの質問は↑にしかないのでここは過去に戻りたい方向けのようです 間違ったスレで質問したようなので
こっちで質問し直しただけですが？
変な言いがかりはやめてもらえますかね 質問をコピペしないでください。マルチポストになってしまいます ふと思ったのですがjavascriptにはgotoがありませんが
特に困った記憶がありません
なぜgotoがなくても問題ないのでしょうか？ このスレで回答してくれるのは恐らく荒らしだけなので、回答が付かないようであれば移動することをお勧めします。 >>109
無理やりスパゲッティコードでも
文脈の外へgoto また文脈の中へ gotoくらいなら
callback関数でなんとかなるからかな
goto文が複雑に入り乱れたコードになると
さすがにほぐすのは大変だろうけど >>112
違う違う
breakとcontinueにラベルを付けられるからでしょ
実質gotoと同じ機能だ >>113
continue は行き先が決まってるし
break は元のブロックの内部に戻れないぞ >>114
実質同じって事は仕様的に一緒って言う事じゃなくて通常使いの範疇で役割が一緒って事だ
(要するにネストしたループ内からの脱出)
ブロックの中に戻るなんてCでもまず間違いなくやらんぞ
それとcontinueもbreakと同じようにラベル使えるけど このリンクからビットコイン購入・販売所bitFlyerにご登録すると
1000円分のビットコインがもらえます！
https://bitflyer.jp/gift/fn0tlipl
外部ウォレットに送金できるので、とにかく一応もらっておくといいです。 >>115
C だったら long_jump 使うことはあるんじゃね？ >>117
setjmp, longjmpだな
それは基本的にブロックどころか関数外に飛ぶ為のもんだ (スタックポインタをいじる為のもん) >>109
> ふと思ったのですがjavascriptにはgotoがありませんが
> 特に困った記憶がありません
> なぜgotoがなくても問題ないのでしょうか？
gotoの代わりになるものが存在するから。
1. 関数呼び出し、return
2. continue、break
3. for
4. if ～ else
5. try ～ catch （throw）
こんな所かね？
これらの機能がない言語っていうのもあって
例えばアセンブリ言語なんか、3, 4, 5 が無いし
C言語でも5がない。
実はgotoは1～5の機能を実装できる万能機能。
しかも1～5では不可能な、どこにでもジャンプできるという高機能な点もある。
じゃあgotoだけがあればいいじゃん？って思うかもしれないけど
歴史的にはgotoが先に生まれて、そのあとgotoの「どこにでもジャンプできる」というのは
コードを著しく複雑にするというのが判明した。
「どこにでもジャンプできる」というのは欠点とみなされたわけ。
そののち制限されたgotoとして1～5の機能が生まれた。
gotoが無いと困る言語っていうのは、1～5の機能が無いか、
あってたとしても少し機能が足りないから。 >>119
随分適当だな…
gotoの代わりになってるのは2.5.だぞ
> 実はgotoは1～5の機能を実装できる万能機能。
ジャンプ出来るのは関数内だけだ
そう考えると関数を越えられる5も違うと言える
ようするに2だけ >>120
俺が言ってるGOTOっていうのは、
C言語のGOTOじゃなくて、BASICのGOTOだよ。
もちろんVBとかじゃなく、初期のBASICね。
BASIC・・・1964年生まれ
C言語・・・1973年生まれ
> ジャンプ出来るのは関数内だけだ
BASICのGOTOは本当にコードのどこにでもジャンプできた。
行番号指定でどこにでもね。
関数の呼び出し（そもそも関数がなかったが）の代わりとしても使えたし、
当然returnもGOTOで実装。
3と4はBASICにもあったと思うが、
これもGOTOで実装しようと思えば出来る。
2はBASICにあったかな？ なかった気もするが。
GOTOの元をたどれば機械語のジャンプ命令に相当するんだよ。
その流れからBASICにもC言語にもgotoという名前で実装された。
その時にgoto（ジャンプ）の代わりになるものが追加された。
それが>>119で書いた内容。
だけどまだ足りなかった。特に5の例外ができるのはかなり後だったね。
C言語では今でも例外がないからgotoが使われることがある。
エラーが発生した時にgotoで関数の後ろに飛ばすんだよ。
そのほうがスッキリかけるから。
最近の言語はほぼ全て例外をサポートしてるんで、
JavaScriptだけでなく最近の言語はgotoなくても困らないよ。 htmlとcssとjqueryをやり始めて三ヶ月なんですが自分が作っているサイトでjqueryを使いたいのですがどうしてもscrollがうまくいきません
アドバイス欲しいんですがファイルをアップしたら見てもらえますか？
ダメそうならもうちょっと考えます jQueryのステマだよ。
jQueryは役割終了しているけれど、これを有料で布教して食っている、非技術系デザイナーのクズが少なからず存在しているからな。
因みに、ここ2年のJS実装では、匿名関数が本当に無名関数になった。jQuery布教者どもが匿名関数を何故か無名関数無名関数とほざいていたからか、JSが折れた形ｗ >>123
テンプレ見てなかった
すんません
でもjqueryは書くほどのレベルじゃないっていうかホントに初心者用参考書のレベルなんです
コードは間違ってないと思うんだけど…
とりあえず後で書いてみます
>>124
ありがとうございます
ちなみに使用してるブラウザはchromeです
後でコード書きますんでよかったらご指導お願いします
>>125
正直この業界に足を踏み入れたばかりなので無理関数とかわからないです
jqueryって嫌われてるんですかね？やっぱjsのが現場で使いますかね？ > jqueryって嫌われてるんですかね？
一番使われてるライブラリだよ。 >>125
原理主義者はどの世界でも意味不明だなｗ
いや、マジわからんｗ 今やjQueryの機能はより良い形で標準で提供されているからな。
それも似ているがやや違うと言った物が多いので、jQueryを使い続けることは混乱の元になる。
その冴えたる例がProxy。いくらネイティブでProxyがThenableを考慮してくれたからといって、
同期/非同期の差で躓くことは多い。
もういい加減標準機能のポリフィルに切り替えていった方がいい。 >>130
標準で書くのとjQueryで書くの
標準で書いたほうが短くなる例
一つでもありましたっけ？ｗ
というレベルだよな。
探せば見つかるかもしれないレベルだ。
明らかにjQueryの方が上だよ。 >>131
なにを言ってるんだ？？？
Q.DefferdとPromise、Q.ajaxとfetch、animeteはanimateだし、
長さはほぼ変わらないよ。
でも機能的には標準のほうが上だし、後から出た分APIとしてもちゃんとしてる。
だからこそjQueryを使う意味は無い。
まだ標準で不足してるのはDOMの比較部分の一部などだが、そこだけjQueryのサブセットか何かを使えばいい。 >>132
ワロタｗ
単語の長さじゃないよ。
同じことをやるのにどちらが短いかだよ。
$(document).on('click', '.class', function() {
$(this).toggleClass('state', 'active');
})
例えばこれと同じことを標準だけで書いてみてよ。 >>133
そういうニュアンスで言ったつもりだが。
DOM操作周りはまだ標準が不足してるからライブラリを使えばいいと言っている。
ただしClassのtoggleは標準機能を使うべき。
だがjQueryを使うとどうしても全体、不要なとこさえがjQuery流になってしまいがち。
だからポリフィル＋最低限のライブラリでないといけない。 一応書くとこんなかんじか
document.queryAll('.class').map(e=>
e.onclick = e => e.classList.toggle('state', true)
) >>135
ちょっと違うね。
それだと.classの要素が動的に増えた時に対応できない。
onclick属性を使ってるから複数のイベントハンドラに対応できない。
toggleClassの所は俺が間違えたから訂正しておく
$(document).on('click', '.class', function() {
$(this).toggleClass('state');
}) 昨日書き込んだ>>122です
$(function() {
var nav = $('#nav');
nav.hide();
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
nav.fadeIn();
} else {
nav.fadeOut();
}
});
});
画面をスクロールするとnavが表示されるようにしたいのですがうまくいきません。
先輩曰くcssのpositionのせいで動かないらしいんですが具体的に何がどうなったら動かないっていうのは説明できない(わからない)そうです
ブラウザはchromeです
よかったら知恵を貸してください 見えてないだけとか？navの縦サイズとcssはどうなってんの #nav {
display: block;
width:100%;
height:40px;
background-color:rgba(0,0,0,0.5);
position: fixed;
top:90%;
z-index: 255;
overflow-x: hidden;
}
こんな感じです
先輩が言ってたpositionはnavじゃなくてサイト全体でposition使いまくっているからうんぬんだそうです
マジでわからん......
$(document).ready(function() {
$("#me").click(function () {
$("#nav").fadeIn();
});
});
ちなみにクリックでのnavの表示は上手くいきました まずはscrollイベントのリスナが実行されているかどうかをalertやコンソールで角煮する
さらにscrollTopが動いているかどうかを同様に確認する
そこから原因を推測して修正する
断片的なのでこれくらいしかアドバイスできない
もしピンポイントの指摘が欲しいなら>>2のサイトに再現コードを貼ることだね >>137
もはやjQueryの機能を標準で再現できるかという話になってないか？
そこまで拘るのならもっと一般的なユースケースを挙げてほしいね。
まあそれはいいよ。
結局jQueryを前提にしたようなものしか出してこないだろうし。 >>141
ありがとうございます
とりあえず書いてみました
制作途中なんで凄く汚いですがお願いします
http://jsdo.it/test_joy/cTjA >>143
確かにその先輩の言う通り、サイト全体を position: absolute; にしてるのが良くないね
本当ならサイト全体の構成を直すべきだけど、とりあえず
「$(window).scroll」 → 「$("#wrapper").scroll」
にすればいける >>146
ありがとうございます！
時間的に全体をなおすのは難しいので#wrapperにつけることにします >>142
ユースケースの話をするなら「古いブラウザでも動くようにしたい」も
立派なユースケースだと思うけどね。
それは置いといてなんかユースケース出せるわけないみたいなこと言ってるし、
想像力のないあなたに一般的なユースケースを。
ページ上にフォームがある。このフォームでsubmit（input,button関係なく）が
押された時に、二度押しを防ぐために、そのフォームに含まれるinput要素全てを
disabledにしたい。そして色も変えたい。
ただし、ページ上にフォームは複数あることもあるし一つもないこともある。
全てのページ、すべてのフォームでこのような処理を行いたい。
2度押し防止のdisabledをやったことがない人はいないと思うんで。 古いブラウザでもってのはポリフィルの役目じゃね
jQueryはブラウザ間の誤差を埋めて貧弱な標準機能を補完するために生まれたと思うが。 <FORM NAME="enq">
<INPUT TYPE="text" NAME="fugafuga">
<INPUT TYPE="hidden" ID="hogehoge" NAME="hogehoge" value="">
<INPUT TYPE="SUBMIT" VALUE="送信" ID="pekepeke" NAME="pekepeke">
</FORM>
<script>
document.forms.enq.hogehoge.value="saitama";
</script>
上記では、enq.hogehogeの中をJavaScriptでsaitamaにしておりますが、
enq.fugafugaの中で入力した値を、「送信」ボタンを押したタイミングで、
enq.hogehogeの中の中に入れるようにするには、どのようにしたらよいでしょうか？
例えば、fugafugaに「日本」と入れて送信した場合、hogehogeにも「日本」が入ってるような感じです。 >>149
たしかにそうですね。
だけど古いブラウザでも動くと言うのは事実なので、
少しいい方を変えて「特定のブラウザの固有の問題を回避して」
っていうのがよりよい言い方かもしれないですね。
ブラウザ固有の問題というのは、ブラウザのバグだけでなく単にその機能がない
っていうのも含まれるわけですが、ポリフィルはその足りない機能を埋めるのに対して
jQueryは埋めるのではなく、代わりになる機能をDOM標準よりも
もっといい形で提供したもの。
どんなにHTMLやJavaScriptが発展して標準化されたとしても
ブラウザ固有の問題は無くならないでしょうしね。
最新のSafari2.1.3が、新し目のSafariバグ対策がされているのも記憶に新しい話。
http://blog.jquery.com/2014/12/18/jquery-1-11-2-and-2-1-3-released-safari-fail-safe-edition/
こういうのは正しい書き方をしているのに、ブラウザのバグで動かないわけで
見つけづらいバグになる可能性が高い。 それを言い出したら、jQuery自体にもバグはあるからな
ブラウザ固有のバグに比べたら少ないかもしれないが、だからと言ってjQueryを盲信すべきではない 1.viewでdomイベントをハンドリング
2.modelを変更
3.modelのイベントを、viewがハンドリング
4.viewが自分を変更
みたいな処理がありますが、
viewは1の時点で4の処理が想定出来ます
なので
1.viewでdomイベントをハンドリング
2.modelを変更
3.viewが自分を変更
という処理も出来ると思いますが
何故viewはmodelのイベントをハンドリングするのでしょうか？👀 >>153
modelを変えるのは、そのviewだけとは限らないからだよ。
modelは色んな物から書き換える。
例えばカレンダーに新しいスケジュールを登録したら
カレンダービューが変わるのは当然として、
今日の予定ビューも変わるだろうし、
TODOリストも更新するかもしれない。
日付が変わったら今日の表示も変えないといけないし
スマホから登録したら、PCでみたブラウザのリアルタイムで変えたいかもしれない。
ビューがモデルを変えた時にビューを更新するだけだと
それ以外のビューが同じモデルを参照している時の処理が面倒になる。
モデルはいろんな処理によってどこからでも変わる可能性があるという前提で
変わったらそのイベント通知がきてビューを更新とすることで
何をきっかけに変わったとしても対応できるようになる。 mb.miniAudioPlayerというのを使いたいのですがどうすればいいのかさっぱり分かりません >>133
そもそもこの先はObservableの時代だと思う。
var mouseDowns = document.queryAll('.class').mouseDowns;
for ( evt on mouseDowns ) evt.target.classList.toggle('state');
とES7の時代では書けるらしい そもそもViewはModelを変更しない
入力を受け取るのはControlでViewはその橋渡しをするだけだ >>158
それは本来のMVCじゃなくて
ウェブ用にへんに歪められたMVC2 >>158
それはJavaScriptのフレームワークを知らない人の意見 JavaScriptで、「html自体はリロードするが、それが使用する画像などはリロードせずキャッシュを用いる」リロードを行いたいのですが
何か良い方法は無いでしょうか。
chromeで動作を見てみたのですがlocation.reload()だと画像もリロードしてしまいます。
location.href=location.hrefでも同様です。
クエリの部分に変更を加えた場合
（たとえばexample.com/reload.phpでリロードを行う場合、location.href="example.com/reload.php?time="+Date.now();などとする）
目的の動作になるのですが、この方法以外で実現可能でしたら
教えていただけないでしょうか >>161
試してはいないが
img の srcをロード後にスクリプトからあてがうようにすれば
htmlがリロードされても画像はローカルキャッシュが効くのではないか？ >>161
chromeのスーパーリロードは Ctrl + Shift + R で意識的にしないとできなかった気がするが
ほんとにそれキャッシュからではなくサーバーからデータ受信してる？ >>159
本来のMVCは
入力→C→M→V→出力
だよ
目的はModelからその他を分離させることだから、Modelが中心 ビューがモデルに対して視覚的なイベントを発行し、それをビューで受ける、
というはアリなのでしょうか？
そういう例が「backbone.jsアプリケーション開発ガイド」にあるのですが。
英語になりますがここに書籍と同内容のサイトがあります
http://addyosmani.github.io/backbone-fundamentals/#application-view
AppViewのfilterOneメソッドの中で、
todo.trigger('visible');
と、todoモデルに対してイベントを発行。
そのイベントをTodoViewがハンドリングして、toggleVisibleメソッドを実行。
つまり異なるビュー同士が、モデルを介してメッセージをやりとりしている形です。
しかしモデルに対してvisibleというカスタムイベントを発行するのは何となく違和感があります。
でもモデル自体はvisibleの処理内容に関しては何一つ関知していないので、
こういう使い方はいいのでしょうか？ Modelが入力イベントに対して反応するのはMVC的には変。
それだとModelControllerになってしまう。
でもMVCではなくView層とそれ以外の分離と考えれば変ではない。 >>164
ですね、ただリロードのためだけの特殊な事は余りしたくないのです
（クエリの変更を避けたいのもそれが理由です
>>165
すみません、コンソール見直したのですが間違っていました。
location.reload()などの方法だと画像などはキャッシュを全く使わないわけではなく
if-modified-sinceやif-none-matchなどを吐き更新を確認しているようです
ただ、更新のための通信自体は行われているので
クエリの変更によるリロードよりも遅く感じます
（developer toolsのNetworkタブで確認しても時間がかかっています）
サーバー側から吐くキャッシュコントロールのヘッダの種類も含めてもう少し見直してみます app.Todos.trigger('filter') のようにしてコレクション上でfilterイベントを発生させます。
これによって、それぞれのTodo項目の表示と非表示が切り替えられます。
という文章も出てきました。コレクションというのはbackboneではモデルの集合のことです。
JavaScriptがクライアントサイドである以上、
モデルに対しても表示まわりのイベント発行は許されるのでしょうか
そこまで分離してないというか >>166
> 本来のMVCは
> 入力→C→M→V→出力
それはSmallTalkを知らない奴の意見。
本当のMVCは
Model ←→ View ←→ Controler
↑ │
└───────────┘
http://csis.pace.edu/~bergin/papers/mvcnew.gif
> 入力→C→M→V→出力
これはMVC2
JavaScriptの時代になってようやく本当のMVCの話が出てきただけ。
WindowsなどでGUIアプリを作っていた人間なら、本当のMVCを知っている。
その後でウェブが出てきて、MVC2をみて、なんじゃこりゃ？って思ってた。
そして、やっと本当のMVCができるようになったのかよって苦笑してる。 >>171にリンク追加
http://csis.pace.edu/~bergin/papers/ModelViewController.html >>168
> Modelが入力イベントに対して反応するのはMVC的には変。
MVC的にはおかしくない。ウェブアプリで歪められたMVC2的におかしいだけ。
最近のJavaScriptはようやくデスクトップGUI波のことが出来るようになったから
本当の意味のMVCができるようになった。
本当のMVCではビューがモデルを変更する >>171
> それはSmallTalkを知らない奴の意見。
ま、Smalltalk をうっかり SmallTalk と書いちゃう人の場合
自分も Smalltalk のことはろくすぽ知らないけどな！って自己紹介しているようなもんだから、
この人が書いていることも、どこまで信用してよいやら… 何が「本当」かはともかく、オリジナルの本来の MVC の概要については
この資料が比較的簡潔でわかりやすくまとめられていてお薦め。
（最後の方すこし RoR ユーザー向けだけど、前半は一般論で参考になる）
「あの日見たMVCを僕たちはまだ知らない for RoR」
http://www.slideshare.net/shinnosukekugimiya/mvc-for-ror/7 なんだやっぱり>>166 の概念が正しいんじゃん。 あるControllerからModelに通知が行き変化があった時、
その変化はそのControllerに付随するViewだけでなく
全てのViewに通知されるべき。
というのは参考になりました
そういうmodelのパブリッシュ性から、
>>167のように視覚的イベントもmodelで発行するという発想になっているのかもしれません
個人的には視覚的要素が絡むならviewがイベントを発行するべきじゃないのかと思ったのですが
viewがviewをobserveするというのはMVC的にないのかも ちなみにbackboneにはControllerクラスがなく、VとCをViewクラスが担当しています
modelのイベントをトリガーしているのは実際にはCがしているということになるのでしょう MFCはDoc-Viewアーキテクチャだね
ModelとViewの関連性を疎結合にする必要がなければコントローラは
いらないって事なんだろう Modelの状態はチェクボックスその他のView部品に丸投げしたくなる mvvmっていうのの説明を読んでいたら、
これが理想に近い気がしてきました 理想というか、現実じゃね。
どうしてもVがVMになってしまうというか、してしまいたくなるというか。 >>176
> なんだやっぱり>>166 の概念が正しいんじゃん。
だからそれはMVC2だって言ってるじゃん。
MVC2としては正しいよ。 >>175を見てもまだそんなことが言えるのか
SmallTalkを知ってる奴はやっぱり違うな >>184
> Viewは視覚的なすべてを扱う。
> モデルにデータをリクエストして、それを表示する。
モデルにデータをリクエストして！
モデルにデータをリクエストして！
モデルにデータをリクエストして！
モデルにデータをリクエストして！ >>175で見て思うのは、
RailsとかJavaScriptとか
1998年に既にJavaで通った道に
やっとたどり着いただけなんだよな。
最先端のつもりでいるのに、15年以上前だったｗ クライアントサイドはサーバサイドのMVCより難解に感じる
他のハンドラを反応させるためにイベントを起こすけど
そのイベントが誰に何をさせようとしているのか、
イベントを見るだけでは分からないので
プログラムの流れが読み取りにくい asm.jsってどうなん？
デザインしたいだけの一般スクリプターには数字の計算が早くなるだけならあまり恩恵なさそうだが >>186
ViewとModelの関係がリクエスト-アンサー型かオブザーバー型かその他かはMVCの本質的に関係ない >>190
マイクロソフトがサポートを表明したばかりだね
すぱるタンに搭載されるかは不明
確かにゲームや画像処理などcanvas使う以外ではあまり恩恵がなさそう 簡単なプログラム作りたいんですが教えてください
５択のセレクトボックスを作る
選択によって１０点から５０点まで点数をつける
そのセレクトボックスを複数作り合計値を出力する >>193
http://jsfiddle.net/
まずは自分で書いてみる
どうしてもわからない所があればまた聞きにくれば？ >>190
asm.jsは直接使うものではなくC,C++で作ったプログラムをそのままブラウザで動かすためのもの asm.jsは文字列すらない、ArrayBufferをメモリに見立ててアクセスするもので、
文字通りアセンブラみたいなもの。あまり人が直接書けるようなものではない。
人が書くことを考えればSaneScriptが現実的。 コンパイラっていうかトランスレータもあるけど決して手で書けないかと言うとそうでもない
バイトコードやネイティブコードになるわけじゃない asm.jsは一見頑張れば手でも書けそうに見えるが、普通に変数を使うと速度が出ない。
速度を最大限だそうとするとArrayBufferまみれになってとても常人が手を出せるものではない。 良く知らんけど勝手にasmってくれｂ驍謔､じゃないｂﾆ
いちいｂｿそんなのに合ｂ墲ｹて書いてらｂ黷ﾈいわ ぶっちゃけSoundScript/SaneScriptが実用化されたら、C++並にはなるだろう。 ■ このスレッドは過去ログ倉庫に格納されています
