+ JavaScript の質問用スレッド vol.134 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです >>59
いや、JS2.0とかやってた名残で当初は早いようにも見えたけど
実際は独自実装の非互換性問題とかもあったし、ここ２年くらいはChromeの方が実装早いよ
>>61
難しく考えずとも、変数とはスコープオブジェクトのプロパティのようなものだ
そのスコープにぶら下がる変数はスコープに入る時に全て作られる
そういうことをしなければ。スコープ外でlet aと定義していてスコープ内で同じくlet aと定義している場合、
スコープ内のlet aに達するまでにaを参照した場合スコープ外のaを参照する挙動になってしまう
あるいはそういう挙動でも良かったのかもしれないが、JSではその挙動を是としていないため、
スコープ内で作られる変数はそのスコープに入った段階で作られることになる
仕様での用語としては「CreateBinding」で、スコープ（Environment Record）に対して値を紐付けるための名前を作る作業がある
そしてその変数宣言文に実行が達したら「InitializeBinding」で、値が初期化される
それまでに変数を利用しようとした場合は例外となる
要するに変数の状態としては「created」かどうかと、「initialized」かどうかの２つを考えればいいだけ
関数宣言に関してはブロックが評価される時に、通常の宣言であればcreateされるだけのところを追加でinitializeされるというだけ >>60の件ですが
clipboardDataの実体はドラッグ＆ドロップで使われているDataTransferオブジェクトのようです
JavaScriptリファレンス第六版には、
DataTransferオブジェクトのsetDataメソッドの説明として
ドラッグアンドドロップ操作の最初の dragstart イベントに応答して
ドラッグ元がこのメソッドを呼び出します。
このメソッドはその他のイベントハンドラからは呼び出せません。
とあり、DataTransferオブジェクトというのは自由に読み書きできるようなものでもないようです
ペースト前にデータをJavaScriptでフィルタするのは機構的に不可能なのでしょうか？ >>62
変数の挙動は理解しているし、詳細な説明が欲しかったわけではない
「仕様上の文言がどうなっているか」が気になっただけ Reactを勉強しているものですが、Reactのスレが見つかりませんでした。日本ではマイナーなのでしょうか？ >>64
だからそれも書いてるじゃん
変数周りの仕様としては「created」と「initialized」しか無いって
関数宣言は「Hoistable」に含まれるわけだけど、それは「created」されて「initialized」されるということでしかない
「実体化」などという表現や概念は存在しない >>66
> 変数周りの仕様としては「created」と「initialized」しか無いって
あなたの解釈はどうでもいいのだよ
知りたいのは一次情報源だけ
> 「実体化」などという表現や概念は存在しない
そんなことはない
http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/10_Execution_Contexts.html#section-10.1.3 React Angular Polymer Vueなんかのフレームワークと
jQueryって同じフレームワークでもなんか別物のような気がするんですが
これらは出来ることは同じなのでしょうか？ >>67
一時情報源だけ知りたいのなら自分で仕様を読めばいいじゃない
https://tc39.github.io/ecma262/
俺もあんたのためにきちんと仕様を読みながら噛み砕いて説明したんだからさ
それをそんな言い方されちゃもうどうしようもないね >>67
と言うかそこでいう実体化っていうのは、「コンテキストの実体化」だからね
静的なコードという型からその時に使う生きた状態を生成する
つまりインスタンス化するというニュアンスだから
「実行コンテキスト」の項にあるでしょ？
その「変数の実体化」っていうのは今話してる変数の状態や「有効化」の話とは軸がずれている
静的な定義らから生きた変数インスタンスを作るというニュアンスの話
そしてやっぱりちょっと妙な表現でもあるから今の仕様では使われてないよ >>68
jQueryはライブラリであってフレームワークではありませんよ
それを使っているプログラマが、それを呼び出すコードを書くのがライブラリ
呼び出されるコードを書くのがフレームワークだと誰かが言っていました >>69
> 俺もあんたのためにきちんと仕様を読みながら噛み砕いて説明したんだからさ
尋ねてもいない事をあなたが勝手に誤解してお節介しただけだろう
「ES2017ではこの文言はどう変わってるんだったか」とちょっとした疑問を口にしただけで、なぜそこまで絡んでくるのか
しかも、なぜか「あなたの言葉」で返ってくる始末 >>72も自分なので、念のため
>>70
> その「変数の実体化」っていうのは今話してる変数の状態や「有効化」の話とは軸がずれている
俺からすれば、俺が書いた「独り言(>>61)」にあなたが勝手に絡んできただけなんだがな
で、俺の趣旨は「宣言が巻き上げされるのではなく、宣言した結果、実体化される変数初期化処理が巻き上がる」
変数宣言も関数宣言も巻き上げなんて発生していない
関数スコープにある変数は、実行コンテキストに入る段階で「変数が実体化」されるだけだ
「変数の実体化」がES3の用語である事は61で書いた通り
で、俺は「ES2017ではこの文言はどう変わってるんだったか」と書いた
詳しくは読んでいないが、おそらく関係するにはこの辺りで、俺が欲しいのは「ES2017の文言」
http://www.ecma-international.org/ecma-262/8.0/#sec-executable-code-and-execution-contexts
あなたはなぜか「あなたの言葉」で説明してきた
そして、一時情報源を求めたら、なぜか ES2019 https://tc39.github.io/ecma262/ を持ち出してきた
仕様書は必要になれば読むが、今の時点でそこまで切羽詰まって読む必要性はない
ただの独り言で誰かに答えてもらう事を期待していたわけでもない
答えてくれるのは有り難いが、俺への返信は全てピントがずれているんだよ まだやっとるのか巻き上げの話w
そんな話時間の無駄のような気がするわ
物理の真理でもあるまいし
時間の無駄
プログラミングなんて使えりゃ良いんだよ
JSの仕様策定にかんよしてるのでないなら
もっと別のこと勉強しろ 仕様を読まなければ、無駄にクロスブラウザする事もあるから時間の無駄ではないけど、否定から前向きな結論は出ないだろうね
独り言に絡まれたのは同情するわ というか、絡まれて火の粉を払っている方はともかく、絡んでいる方が望む終着点が読めん 用語は根拠をもって統一すべきとは確かに思う
そしてもし詳しいなら実務に影響あるところを書いてくれるとうれしいんだが
宣言と初期化の違いが、実際のコーディングにどう影響するのか
アローを含む変数格納の関数と巻き上げの話にしても
その変数を介さずに中身を直接呼ぶ方法がないんだし
「巻き上げなんて無かった」と考えてコード書いていけばそれで良い話にも思える >>76
絡んでいる方は「一つの論題」に皆が参画している感覚なんじゃない？
>>70の下記一文は「一人一人にスレッドがある」と考えていない節があって、そこで61と齟齬が発生している印象
> その「変数の実体化」っていうのは今話してる変数の状態や「有効化」の話とは軸がずれている >>78
なるほど、確かにそういう人は少なからずいるな… >>77
> 「巻き上げなんて無かった」と考えてコード書いていけばそれで良い話にも思える
それで良いと思う
元々、ECMAScript には「巻き上げ」という概念はなく、誰かが hoisting と言い出したのが始まり
今では仕様上に hoisting も出てきてはいるけど、本質ではないと思う
実践的な部分では変数初期化のタイミングさえ覚えれば良い
基本的な部分だけまとめると、
- 「関数呼び出しされるタイミング」で関数宣言/変数宣言(var)の変数が初期化される
- let,const変数も同様に初期化されるが、TDZでは RefarenceError (TDZは仕様外の用語)
- グローバルコードでは先頭で関数宣言/変数宣言(var)の変数が初期化される
「関数式」「アロー関数」は単体で宣言する機構がないので、他のスコープから呼び出すなら変数宣言/引数などに絡めて使う >実践的な部分では変数初期化のタイミングさえ覚えれば良い
覚える必要あんのか？
変数は「初期化するコード」より前のタイミングで使うな、なんならブロック先頭で網羅的に初期化しろ、で済む話では？ >>73
俺からすれば最初>>62は君に対する返答でもたしかにあったけど、
君だけへの返答ではなくそれまでの流れを含めた視聴者に対するまとめを書いただけで
別に君に変数の仕組みを解説したつもりはない
そこに君が>>64で突っ込んできたから、それ「も」書いてると言った
君は「自分の言葉」と思ったかもしれないが、仕様書のURLは、「あえて」記載しなかった
ただ俺はきちんと必要ならすぐ調べられるように仕様上の用語は含ませた
そこは確かに君を強く意識して行ったことだけど
先にも言ったとおり全体としては君の質問へのど直球の回答ではないので
君の期待通りの返信では無いのは悪しからず
そして>>78の言う通り、俺が>>62などで書いた文章は以前の話を含めて書いているため
その後のそれらに対するレスは、>>61だけではない流れ上で考えさせて貰っている
君がやけに>>61に拘ってたことには失礼ながら今気づいたが、俺はそんなちっぽけなところなんて見続けていない >>73
あとこれは完全に別件として問いたいことだが、
なぜES2017に拘る？
俺はES2017というのは最新仕様の言い換えだろうなと思ったから
より適切な最新のドラフトを案内した
今回の件でES2017に拘る理由がわからない
ES3,5や、letやconstが入ってその辺りに変更が入った2015を見てみるというのはまだ分かる
でもES2017なんて中途半端なところを拘って見たがる理由って一体全体なんだ？
今を知りたいのなら最新のドラフトの方がいいぞ、多少読みやすくもされてるし 一次情報云々の話ならそもそも実体化とかいう訳語が怪しいんだが
誰かがそう決めたの？ >>81
それはポリシーの問題
それでいい人もいれば、良くない人もいる
const房と根本的に同じ問題 >>85
ちょっとおかしくね
>>80を理解したところで初期化jsコードより先に使っちゃダメなのは確かで
初期化jsコードより後に使うなら>>80は無意味では
問題おきてデバッグする時にもまず役に立たない知識 知っていると実益があるかどうか
var,let,constはそれぞれ性質が違いしかも一方だけでコードを書くことができる
選択の余地ひいては実益があり、実益をどう判断するかのポリシー問題
変数の巻き上げやTDZや宣言・初期化とか用語・説明の話は実益あるのか 実益があるのかって、単純に何事も内部構造をできるだけ分かって使う方がより良いと思うけど。
クラッチやエンジンの仕組みを何も知らないで感覚だけで覚えるのと、理屈で理解してるのとでは違いがあると思う 巻き上げ周りの知識があったら書き方がどう変わるのかってやつだな
自動車の例でいえば、仕組みを知ってれば効率良い運転に繋がる可能性もあろう 通常のジェネレータはあんまり使い道はないが
asyncになるとイベント的なことに使えるのでかなり重要な存在
これがあれば、whileループみたいに描くしか無いところをfor awaitで書ける そうでもないと思う
ジェネレータの良いところは、継続状態と返り値が同時に抽象化されてることだから
for awaitならそれを抽象化されたまま自然と扱えるが、
whileを使った場合その抽象化システムを丁寧に自分で組み立てるか、
その場その場で適応的に書くか、もしくは妥協しないといけない ftp%3A//ftp2.shuwasystem.co.jp/pub/book/javascpermas/chap09.zip
これのsec04/dragdrop.htmlの26，36行のpreventDefault()ってなにを取り消してるの?? あ、ちなみに、ページ内の｢ドラッグできます｣というのを上の四角の領域にドロップすると要素が移動するというコードです。
それから34行のcurrentTargetとtargetと違いもわからないです。
targetに書き換えるとドラッグしても何も起こらなくなるのはなぜだろう んなURL持ってくんなよ
しかも度々書籍ステマ・書籍アフィが出てるスレで「コンピュータ、パソコン書籍の出版社」が
アクセス統計でも得たいのか 本買うと特典でサンプルDLできるとかのあれか
本買ってないやつがDLするわけにはいかないし
本買ったやつならURLなんて出さなくてもわかるだろうし
何より本書いたやつか出版社に聞け >>92
データのID作るときとか便利
ループだとそのループ中でしかできないが
ループ以外でも簡単に連番等つけれる
同じ理屈で数列つくるときに便利。
遅延評価で無限数列つくるときとか。
ま、あんま使わんと思うが。 調べるべき用語が分かってるんだからググった方が絶対いい結果を得られるよ >>97
$('a').click(function(e){ e.preventDefault(); });
例えばこれなら、a タグによるページ遷移という、デフォルトの動作が取り消される
jQuery のイベントバブリング、preventDefault()・stopPropagation() を参照 >>97-98
http://jqueryui.com/droppable/
jQueryUI の、Draggable, Droppable のソースコードを見れば？ JS違法だって
おまえら逮捕だね
【ウイルス】WebサイトでJavaScriptでPCに負荷をかける行為は違法 警察が検挙
http://asahi.5ch.net/test/read.cgi/newsplus/1528979221/ パターンマッチ関数って何のためにやるのですか？
回りくどいな、という印象しかなかったのですが JavaScriptで配列をすごい勢いでループしてる時に
緊急停止ボタンが押されたらブレーキをかけることはできますか >>115
質問者じゃないけど興味があるので理由を詳しく聞かせてもらいたい setTimeoutやsetIntervalで再帰させてれば緊急停止できるのでは
概念的にはもはやループじゃなくてタスク管理だけど > setTimeoutやsetIntervalで再帰させてれば
再起である必要はないね 緊急停止ボタンのクリックイベントでkinkyubrake = trueしておく。
ループではkinkyubrakeがtrueのときはbreakするようにしとけばいい。 緊急停止っていみわからんけど
再帰で無限数列とかつくるとオーバーフローでエラーでるが
それを回避するためにsetIntervalに入れるんだが。
そういうことじゃねぇのか? そりゃ別の問題だろ
jsエンジンの保護機能があって、理解した上でそれを回避する手法を使う
そこにユーザの停止意思は関係ない 皆様ご回答有り難うございます
長い時間がかかる計算をさせているのですが
私のラスクトップはこの時期長時間動かすと熱で落ちてしまいます
その兆候が現れた時に、物理的なUSBボタンが押されたら
全タブの処理を抑えたいと思っています
完全に止まらなくとも構いません
再開はしたいです つまりオーバーフローによる問題を回避するためではなく
エアフローによる問題を回避したいわけですな
ドヤァ ラスクトップってなんだデスクトップなのかラップトップなのかどっちだ
PCごとスリープさせたらダメなのかね とりあえずJSの仕事では無さそう
プロセスごとのCPU使用率制御かなんかを調べた方が多分近道 >>116
厳密には同期的繰り返し処理では割り込み処理出来ない オライリーのサイ本はもう新しいのは出ないんでしょーか？
7版待ってるんですが 今までOOPでやっていた部分をFPで書いていてふと思ったのですが
FPって名前空間汚しまくりじゃないですか？
例えばOOPだと
hoge={sum:()=>{}}
みたいにhogeだけですみますがFPだと
hoge=()=>()=>{};
sum=()=>{};
みたいに延々増えていくような？気がします
そういうものなんでしょうか？ サイの絵の表紙のサイ本
JavaScript 第6版、2012、David Flanagan
初めてのJavaScript 第3版 ――ES2015以降の最新ウェブ開発、オライリー、2017
Flanagan は、Java, Ruby など色々な言語の本を書いてる。
最近は、何をやってるのかね？ >>133
>>135
まだ持っていなくこれから学習始めるのに本が欲しかったんですが、第6版は古いから手が出しづらいです。
6版買うくらいならいっそのこと古本の5版でも構いませんか？ 良いか悪いかで言ったら俺は悪いと思う
要するにJSの実際はそんなには難しくもないんだけど、
適切な解説が少ないプロトタイプチェーンやスコープチェーンだったり
多くのJSerが曖昧にしてきたであろう基礎的な仕組みに近いところを
まんべんなくそれなりに分かりやすい解説が載ってたっていうのが価値だった
だけどその他の部分のテクニックとかも肌感覚が古くなってきてるし、
今なら当然合わせて知っておきたいクラス構文やモジュールなんかも学べないしな
まあ物好きでお金と時間に余裕があるなら、
一旦ES5までの知識を付けて個別にアップデートしていってもいいとは思うが >>137
ありがとうございます
第6版も古いからオライリーに拘らず他所の新しい本の方がよいでしょうか？ Javascriptで、生成されたオブジェクトを終了するために、
VBSで言うところのNothingを使いたいのだけれど、
どうも使わない感じみたいで、困ってます。
Javascriptでは、もしかしてnullとか使うでしょうか？
ヒントでもいいので教えてください。 変数にnull代入
参照してる変数が無くなればgcがいつか解放する >>138 わからん
サイ本のように一昔前は中級者や中級者になりたい人向けという幅広い括りで取り敢えず読んどけという本もいくつかあったが、
今の時代は難しい 大昔におけるオライリー本ですら有効性はクエスチョンマークだった
今や書籍の価値なんてGCに回収されてる > 今や書籍の価値なんてGCに回収されてる
どういう意味？ >>142
どうもありがとうございます
参考になりました Javapcriptのスリープ実装って永遠の課題なんか？
代替手段はどれも使いづらいし、
何でこんなことになっとんのや？ 俺のスニペット帳より。元ネタは確かtry-puppeteerサイトのコード
なぜか5ちゃんのセキュリティゲートウェイに引っ掛かったので全角で貼る。
ｃｏｎｓｔ ｓｌｅｅｐ ＝ ｍｓ ＝＞ ｎｅｗ Ｐｒｏｍｉｓｅ（ｒｅｓｏｌｖｅ ＝＞ ｓｅｔＴｉｍｅｏｕｔ（ｒｅｓｏｌｖｅ， ｍｓ））；
ａｗａｉｔ ｓｌｅｅｐ（５０００）； >>146
Atomics APIでできるよ
Atomics.wait()とすればそのまんまスリープする
ただメインスレッドでは禁止されてる場合が多い
メインで待機しちゃうとUIが止まっちゃうからね
でもWorkerなんかではSharedArrayBufferと組み合わせて効果的に使えるよ
ただ今は例のCPUサイドチャネル攻撃脆弱性問題のおかげで
情報が抜けてしまうのでデフォルト無効にされてるが でもAtomics APIってJavaScriptじゃなくて
ブラウザのAPIですよね？
NodeJSでは使えませんよね？ >>149
違う。列記としたECMAScriptの仕様だからV8にも載ってるしNodeでも使える
ただマルチスレッド動作が上手く行くかはわからんが chrome、firefox、edge、safari などメジャーブラウザ全てでメインスレッドでは使えない。ワーカー内でしか使えない。
実質役立たず。 そういうruby信者みたいな情けない言い方はやめろ
やるやらないとできるできないは違う
できるけど理由があってやらない、が一番かっこいい 要素Aがあって
<div id="A"></div>
この要素Aに要素Bを動的に入れ子したとき
<div id="A"><div id="B"></div></div>
要素Aが膨らんだので
要素Aの大きさを取得したいのですがどうやってやりますか？
（そもそもAが膨らまないように、、みたいな話ではなく単純に、
予想外に膨らんでしまった要素のサイズを取得してみたい、という用途です） scriptをbodyの末尾に置けばreadyハンドラを待つ必要ないと思いますが
このやり方に何か問題ありますか？ >>155
簡単にできるけど、理由があって禁止されたんだよ
最初期はそういう縛りなく実装されてた
理由があるなら最初からできないほうが良い
過剰に自由なことはデメリットのほうが大きい >>157
要素にJSを適応したい場合はカスタムエレメントを使うこと
そうすれば要素が出現する前に定義できるし、
出現した瞬間に効果が適応される
コンポーネント化もしやすい ■ このスレッドは過去ログ倉庫に格納されています
