JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください

■規則/推奨ルール
質問者は !slip:vvvvv を名前欄に、その後は「レス番」＋!slip:vvvvv
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」から解離した議論はよそでやること。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
　1レスに収まらないならコード投稿サイトを利用してください。
　http://jsdo.it/　http://jsbin.com/　http://jsfiddle.net/　http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける＝荒らしです

■前スレ
+ JavaScript の質問用スレッド vol.141 +
http://mevius.5ch.net/test/read.cgi/hp/1562318008/

■FAQ(続き)
◆JavaScriptの実行速度
JavaScriptの速度は「ブラウザ名」「ブラウザのバージョン」「PCスペック」に依存します(ブラウザのバージョン毎に最適化具合が異なります)。
速度の疑問解消の為にhttp://jsperf.com/ （githubのアカウントが必要です）にコードをUPしてブラウザ毎に速度計測する事を推奨します。

例外として、仕様における理論上の速度が明確になっている場合があります。
例えば、正規表現によるマッチング処理を考えた場合、「RegExp#test > RegExp#exec > String#match」は ES5 仕様で保証（要出典）されています。
ES5 仕様において RegExp#test が最も処理数が少なく、String#match が最も処理数が多いことが明確だからです。
ブラウザによっては RegExp#test の最適化が十分でなく、String#match の最適化が RegExp#test より十分であれば逆転する可能性はありますが、各メソッドの最適化が一律であればこの前提が崩れる事はありません。

■各種仕様
◆ Standard ECMA-262
http://bclary.com/2004/11/07/ (ECMAScript 3 HTML版)
http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/ (ECMAScript 3 和訳)
http://www.ecma-international.org/ecma-262/5.1/ (ECMAScript 5.1 HTML版)
http://tsofthome.appspot.com/ecmascript.html (ECMAScript 5.1 和訳)
http://www.ecma-international.org/ecma-262/6.0/ (ECMAScript 6 / ECMAScript 2015)
http://kangax.github.io/compat-table/es5/ (ECMAScript 5 compatibility table)
http://kangax.github.io/compat-table/es6/ (ECMAScript 6 compatibility table)
◆ HTML Standard (HTML5)
http://www.whatwg.org/specs/web-apps/current-work/multipage/
http://momdo.s35.xrea.com/web-html-test/spec/WD-html51-20130528/Overview.html (HTML5.1 部分訳)
http://www.hcn.zaq.ne.jp/___/WEB/WebStorage-ja.html (Web Storage 和訳)

■各種仕様 (続き)
◆ Document Object Model (DOM) / CSS Object Model (CSSOM)
http://www.hcn.zaq.ne.jp/___/WEB/DOM4-ja.html (DOM Standard (DOM4) 和訳)
http://www.w3.org/TR/DOM-Level-3-Events/ (DOM3 Events)
http://www.w3.org/TR/uievents/ (UI Events)
http://www.hcn.zaq.ne.jp/___/WEB/cssom-ja.html (CSSOM 和訳)
http://www.hcn.zaq.ne.jp/___/WEB/cssom-view-ja.html (CSSOM View Module 和訳)
◆ その他のWeb関連仕様
http://domparsing.spec.whatwg.org/ (DOM Parsing and Serialization - innerHTML等)
http://www.hcn.zaq.ne.jp/___/WEB/XHR-ja.html (XMLHttpRequest 和訳)
http://www.hcn.zaq.ne.jp/___/WEB/File_API-ja.html (File API 和訳)
http://www.whatwg.org/specs/ (WHATWGの仕様一覧)
◆ MDN (Netscape/Mozilla)
http://developer.mozilla.org/ja/docs
◆ MSDN Library
http://msdn.microsoft.com/en-us/library/ie/hh828809 (Internet Explorer API)
http://msdn.microsoft.com/ja-jp/library/yek4tbz0.aspx (JavaScript)
http://msdn.microsoft.com/ja-jp/library/cc427807.aspx (JScript)
http://msdn.microsoft.com/ja-jp/library/cc409712.aspx (DHTML)
◆ JavaScript Garden (ja)
http://bonsaiden.github.com/JavaScript-Garden/ja/
◆ JSON (JavaScript Object Notation)
http://www.json.org/json-ja.html

■テンプレ案
http://fiddle.jshell.net/fH4cC/180/show/light/

■FAQ
http://fiddle.jshell.net/vSqKr/44/show/light/

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

■各種仕様
◆ Standard ECMA-262
http://www.ecma-international.org/ecma-262/6.0/ (ECMAScript 2015, いわゆる ES6)
http://www.ecma-international.org/ecma-262/9.0/ (ECMAScript 2018)
http://tc39.es/ecma262/ (ECMA-262 最新ドラフト)
◆ HTML Standard (HTML5)
http://www.whatwg.org/specs/web-apps/current-work/multipage/
http://momdo.s35.xrea.com/web-html-test/spec/WD-html51-20130528/Overview.html (HTML5.1 部分訳)
http://www.hcn.zaq.ne.jp/___/WEB/WebStorage-ja.html (Web Storage 和訳)

◆ ES5（削るべきか要審議）
http://www.ecma-international.org/ecma-262/5.1/ (ECMAScript 5.1 HTML版)
http://tsofthome.appspot.com/ecmascript.html (ECMAScript 5.1 和訳)
http://kangax.github.io/compat-table/es5/ (ECMAScript 5 compatibility table)
http://kangax.github.io/compat-table/es6/ (ECMAScript 6 compatibility table)

electronは凝ったインターフェースが難しいのですか？
2dキャラを動かす物を作りたいのですが

>>7
難しくはありませんよ
普通の人には簡単に使えるようになっています

http://github.com/mdn/webextensions-examples/tree/master/borderify

githubでダウンロードするにはどうしたらいいんでしょうか
ダウンロードボタンがないです

>>9
一部じゃなくて全部ダウンロードしろ
一つ上に上がれ
ちゃんとしろ

普通は、プロジェクトを丸ごと、git clone するけど、

こんなに大きいと、ダメだな

>>11
あえてsvnとは

>>13
一番簡単にディレクトリ以下のみをダウンロードできるから
gitだと同じこと出来ない

gitでやるならこんな感じ
.git/以下を取得するから単にダウンロードするのとは違う
$ cd <path>
$ git init
$ git remote add originhttp://github.com/mdn/webextensions-examples
$ git sparse-checkout set borderify/
$ git pull --depth=1 origin master

ローカルサーバを立てるとはどういうことですか？
なぜwindowsのフォルダをそのまま使えないのでしょうか？
サーバ特有の機能があるのでしょうか？

>>15
>ローカルサーバを立てるとはどういうことですか？
ローカルにサーバーを立てること

>なぜwindowsのフォルダをそのまま使えないのでしょうか？
何に使えないの？

>サーバ特有の機能があるのでしょうか？
あるよ

>>15
理由は２つある
１つはサーバーが無いと実現できないことがある
でも大抵のコンテンツは関係ない
もう１つは、わざとローカルファイル間のアクセスが制限されている
セキュリティのため
何もできないわけではないけれど不便なのでサーバーをたてる
nodeを使った超簡易ローカルサーバーが幾つかあるから
それらを試してみるのがオススメ

ブラウザ環境は、クロスドメイン禁止(CORS)だから、
自分のPC 内にサーバーを立てて、サーバー上に、HTML を置く

一番簡単なのは、VSCode の拡張機能、Live Server

Ruby なら、コマンドプロンプト・PowerShell から、1-liner で、
Ruby製の遅いウェブサーバー、WEBrick が起動する

ruby -run -e httpd . -p 8080

そのフォルダ内に、index.html があれば、これでブラウザからアクセスできる
http://localhost:8080

>>16
webアプリが動かなかったりするのではないですか？
よくxamppなどを開発用に使うと思います
しかしxamppは自分の環境で不具合あるんですよね、、、

>>17
例えばどのようなコンテンツでしょうか？
簡易ローカルサーバとはxamppなどと何が違うのでしょうか？

>>19
webアプリはwebサーバー上で動くように作ったアプリケーションなんだから
サーバー立てずに動かそうとする意味がわからない

xamppもwebサーバーの一種
おま環で不具合あるならそれを解消するか違うの使えばいいだけだよね

twitter自動リフォローツールってどういう環境で作るのでしょうか。１つおもいつくのはブラウザーアドオンです。
ローカルアプリでtwitterを操作したりもできるんでしょうか？

>>20
つまりWEBアプリを作るライブラリ（アンギュラーなど）などがサーバを建てないと動かないという認識にしておきます。
ありがとうございますた

XAMPP/MAMP, Ruby on Rails も、サーバーを含んでいるのは同じ

単に、PC 内のHTML をダブルクリックして、ブラウザを実行環境にすると、
クロスドメイン禁止(CORS)になるから、その部分が動かないだけ

そういう場合に、自分のPC内に、サーバーを立てて、そこからHTMLを配信する。
そうすると、普通のネット上のサーバーから配信したのと同じになる

一番簡単なのは、VSCode の拡張機能、Live Server

初心者に間違った用語の使い方を教えるのは遠慮してくれないか？

まずクロスドメインではなくクロスオリジン
そしてCORSはクロスオリジン通信を実現する仕組みなどの
名称であって禁止という意味は含まない

そしてローカルファイルでクロスオリジン間の通信が制限されるわけではない
クロスオリジン間の通信が制限されるのはデフォ
ローカルファイルでは自己ファイル以外は別オリジンとしてみなされたり
ブラウザによってよりキツイ制限がかされるというだけ

突っ込むところそこかよっｗ

HTMLファイルとWebアプリの違いがわかってないのにそんな小難しいこと言っても無駄

使った用語の間違いの訂正なんで
質問者ではなく、回答した人へのアレだろう
俺も少し気になってた

まあrubyキチはスレを荒らすのが主目的ですし

例えば簡単な２dゲームエンジンを作るとしたら、python guiよりjs electronのほうが適していますか？テクスチャを動かしたりアニメーションしたりするのはjsのほうが得意ですよね。

>>27
そりゃ断然JSよ
pythonのguiはオモチャだから他の言語できるやつはまずやらない

>>28
その動きにかかわる部分というのはguiライブラリの差というより、cssやjqueryの差ではないのですか？jsだとフルスクラッチのゲームとかありますよね。

一般的には、Unity。
Python っぽいものなら、Godot

http://www.emanueleferonato.com/

このイタリア人は、phaser ばっかり。
昔は、Cocos2d-x も使っていたけど

>>29
意味不明

>>32
例えばテクスチャを単純に動かすくらいならpythonでもできると思いますが、フェードさせたりブラーをかけたり、こういう処理はjqueryのあるjsが有利なのではないか、ということです。

7 Most Popular JavaScript Libraries 2020
http://www.youtube.com/watch?v=qugY8axtvWY

Anime.js, Howler.js, Chart.js, Reveal.js,
Three.js(WebGL 3D), Pixi.js(WebGL 2D), Video.js(HTML5 Video)

Phaser は、Pixi.jsをコアにして、サウンドや衝突判定や物理演算などを追加した、
2Dゲーム開発フレームワークです

>>33
JSの場合はブラウザにしてもElectronにしても
HTML/CSSのレンダリングエンジン前提だからGUIライブラリが標準でランタイムに入ってるのと同じ
その標準のGUIライブラリであるHTML/CSSを操作するサードパーティのライブラリも腐るほどある

pythonユーザーに向けて2dゲームエンジンを作りたいというニッチなニーズを除けば
jsとpythonの二択でpython選ぶのはあり得ないよ

jQueryでゲームエンジンはないやろ
どうせcanvasでグリグリ描くことになる

>>35
なんとなくjsのほうがいいということはわかりました
ありがとう
作るならelectronですね

なんつうか頭悪すぎて相手してられない

スマホないとスマホアプリ作るのはむずいですよね

各種エミュレータがあるから作れないことはないけどモチベーション続かないだろ…

仮想DOMが（一時的に）流行しているせいでDOM操作（jQuery含む）と
相性が悪いのがWebフレームワークって感じになってる

Webフレームワークを使うと直接DOMを操作するなって言われる
Webフレームワークのやり方に依存しまくるしかなくなるので
あとで技術的負債になりやすい

バカ過ぎワロタｗｗｗｗｗ

フロントエンドのフレームワークとサーバーサイドのフレームワークは分けて考えたほうが良くない？
「Web」フレームワークっていやどっちもそうなのかもしれないけど括りが大きすぎる気がする

>>46
guiの部品といいますがhtml cssがあるのになぜ必要なんでしょうか？