+ JavaScript の質問用スレッド vol.137 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」から解離した議論はよそでやること。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
※前スレ
+ JavaScript の質問用スレッド vol.136 +
http://mevius.5ch.net/test/read.cgi/hp/1542707959/ >>216
どういうこと？スコープの話なんかしてないけど 「脳内スコープを想像して」ってかいてあるから
単なるこいつの勘違いかな 逆だよ
ケンカしている仕様をありがたく教授している 使い捨てコードは、VSCode のQuokka という拡張機能を使っている。
コードを書き換えると、即座に結果が表示されるので便利
ブラウザのコンソールは、使わない
>>192
format 関係の関数は、様々なブラウザでの互換性が不明
ライブラリでは、moment よりも、date-fns の方が良さそう >>221
良く尻も竹刀でオワコンライブラリを進めてタコとを半生しろ >>223
酔っ払っているのか？
＞良く尻も竹刀でオワコンライブラリを進めてタコとを半生しろ
もう少し日本語で頼む 俺の経験上、軽いが売りの代替ライブラリは
結局本家を超えることはできないよ
ま、互換性があるならいつでも本家momentに
戻せるから使うのは構わないけどな div class ='tenpoList' onclick="list_click()">
<ul>
<li></li><li></li><li></li>
</ul>
</div>
function list_click() {
$('div.tenpoList ul li').click(function () {
var num = $(this).index() + 1;
alert(num);
});
}
liをクリック時、クリックしたliのインデックスを1回だけalert表示したいのですが、
これを実行すると、クリックするたびに、表示されるalert回数が増えてしまいます。
どうすればいいでしょうか？ onclickで呼び出す必要ないんじゃない
クリックするたびにイベントが追加されてるんじゃないか
window.onload = list_click
で読み込み時に一回だけイベント設定したらいいんじゃない >>206
末尾再帰どころか末尾呼び出し最適化も
とうの昔に仕様に入ってるよ >>228
タグのonclick属性を使うのは時代遅れ
またwindow.onloadを使うのも時代遅れ
onclickを消して、JavaScriptのコードはこれだけでいい
$('div.tenpoList ul li').click(function () {
var num = $(this).index() + 1;
alert(num);
}); 時代遅れ
どうせ書き換えるのならObservableを使おう >>230
どの主要ブラウザにも実装されてないし、babelも標準ではサポートしてないんだよなあ でも仕様に入ってるってことは将来はforループ無くなりそうだね >>231
ReactでもonClick使ってるんだが時代遅れなのかね？ reactとバニラのonclickを一緒にするなよ Reactはこうした方が良いんだというモットーで
onClickを使っているが、やっぱり悪手だったと思う
HTML（JSX）が汚く見づらくなってしまってる
せめて値に入れられるのは関数名だけでJavaScriptコードは
入れられないようにするべきだっったね
まあHTML書く人との分業作業を断念して
JavaScriptを書くプログラマが全部やりますよっていう
驚きの方針を前提にするなら、それでもいいかぐらい >>178
やはり駄目でした。。。
ちなみにこれ、HTML上にあるJAVAスクリプトなんですが、それが原因でしょうか？ ほんとに全部削除して<script>とかも削除したなんてオチだったりして >>239
178はconsole.logで出力してるからコンテンツエリアではなく開発ツールのコンソールに表示されるんだよ？ jsfiddle は、Edge では結果が表示されない
Chrome を使うべき！ Edgeどんだけポンコツなんだよｗ
ｃｈｒｏｍｅと一緒のエンジン搭載したんじゃなかったのか >>244
もうしたとは言ってねえよ
今年中位の勢いでしょうね Edge の画面の拡大率を下げたら、見えた！
jsfiddle は、縦横のスクロールバーが出ない！ プログラム板のVSCode のスレから、移動してきました
// 1970年01月01日 00:00:00 UTC (Unix エポック)
var dt = new Date( 1970, 0, 1, 0, 0, 0 );
console.log ( dt );
// 1日後
dt.setSeconds( dt.getSeconds() + 86400 );
console.log ( dt );
これを、VSCode の拡張機能、Quokka.js で実行すると正常だけど、node.js で実行すると、9時間ズレる。
nodeのタイムゾーンがおかしい。どう設定すればよいの？
1969-12-31T15:00:00.000Z
1970-01-01T15:00:00.000Z date-utilsっていうライブラリ要るんじゃなかったっけ // 1970年01月01日 00:00:00 UTC (Unix エポック)
var dt3 = new Date( 1970, 0, 1, 0, 0, 0 );
console.log ( dt3 );
console.log ( dt3.toLocaleString( 'en-US', { timeZone: 'Asia/Tokyo', hour12: false } ) );
出力
1969-12-31T15:00:00.000Z
1/1/1970, 00:00:00
ひとまず、内部ではUTC にして、
表示する際に、互換性は低いけど、toLocaleString で表示できた。
ただ、1970-01-01 のように表示できない
Windows10 のPC だけど、設定ファイルで出来ないのかな？
Linux では環境変数で設定しているけど
date-fns, date-utils も、調べてみる >>252
何でやってるの？
xamppだとphp.iniを編集する必要があるよ 単に、Windows10 のPC に、VSCode, Node.js を入れて、サンプルを実行しているだけ。
プロジェクトも作っていない。
未設定ワークスペースで、.js ファイルを実行しているだけ
VSCode の拡張機能、Quokka.js で実行すると正常だけど、
VSCode の拡張機能、Code Runner で右クリックメニューから実行するか、
端末から、node コマンドで実行すると、9時間ズレるのが不思議 9時間ズレるのが不思議なの？ｗ
日本標準時(JST)が世界標準時(UTC)マイナス9時間だからだよｗｗｗ ブラウザでも実行すると正常だけど、
Node.js だけは、console.log で表示する際に、UTC のままになる
Node.js の実行環境だけは、特殊 nodeの場合デプロイ先のリージョンがアメリカかヨーロッパかでズレたらそっちのほうが困るがな。 ただ、VSCode の拡張機能、Quokka.js で実行すると、日本時間になる
console.log ( dt3.toLocaleString( 'en-US', { timeZone: 'Asia/Tokyo', hour12: false } ) );
とにかく、console.log の度に、こう書くのが面倒くさい。
設定ファイルか何かで、どうにか出来ないかな？ This is arguably a V8 bug. It ignores locale settings. In fact, all date and number formatting logic is hard-coded.
The reason it works in Chrome and Chromium is that those projects use v8-i18n on top of V8. I don't think that's a direction we want to take. It depends on libicu and that's a massive library.
We would have to bundle it and that would increase our already large source tree by another 85 MB and ~500,000 LoC.
https://github.com/nodejs/node-v0.x-archive/issues/4689 quokkaとやらはelectron組み込みのchromiumのV8を利用してるから問題ないんだろうな。 >>260
以下は、自動翻訳
これは間違いなくV8のバグです。 ロケール設定は無視されます。
実際、日付と数値のフォーマットロジックは、すべてハードコーディングされています
ChromeとChromiumで動作するのは、これらのプロジェクトがV8の上にv8-i18nを使用しているからです。
それが私たちが望む方向ではないと思います。 それはlibicuに依存しており、それは大規模なライブラリです。
これをバンドルする必要があります。
これにより、すでに大きなソースツリーがさらに85 MB、最大500,000 LoC増加することになります バグではない
そもそもIOからも分離されたJSという言語のエンジンで
文字列をパースして評価する+標準出力に出すくらいのことしかしなくていいのに
ここだけ環境もといOSからロケーションを取得して（１個とは限らなかったりするし）適切に扱うとか異質
なので仕様にも実装していない場合や実装内で利用できない場合はオフセットを0として良いとしており
つまり実質的にこの仕様の実装はオプションだ サポートしていなくてもJSエンジンとして正しい
だからV8コアと国際対応は分離されているのにそれをNodeが取り入れたがらないだけ パッチ公開してる人いるから自分でnodeビルドすればいけるぞ デベロッパーツールでオリジン関係なくjsを実行できてしまうけど、そうするとサイトにいくらでも攻撃できちゃうのはどう対処すればいいの？
認証トークンもバレバレ、api実行もできるんだけど サーバーの設定でわざわざ全てのオリジンにcors許可してるんだろマヌケｗ そういやjsのapi認証ってどうやって他人に使われるのを防げばいいの？
ドメイン制限はしてるけど、ローカルでexample.comwを見れるようにしたらそのまま使えてしまった 認証関係は、twitter など、大手の認証を使う
各社で、パスワードなどを管理したら、漏えいするから危険！ 認証トークンは、1 time password とかだろ
1回限りのものだから、わかっても次には使えない >>270
分からないのに書き込むな。な？
住所晒せば大量のチラシ送ってやるぞ？ >>262
>日付と数値のフォーマットロジックは、すべてハードコーディングされています
node では、node専用の日付時刻ライブラリを使った方が、良さそう
ブラウザでは、それと異なるコーディングをするしかないか？
そもそも、ブラウザとnodeで、共に動作する、ソースコードの需要がないか new Date('2018/01/01 10:12:13 +0900')
みたいに明示したらいいだけじゃないの？ >>274
その手のフォーマットの互換性が、ハッキリしない。
使えるかどうか、よくわからない
素のJS ではなく、フォーマットのライブラリを使った方がよいかも classにsetterが設定されてるかどうかを、文字列から判定する方法が知りたいです
イメージ的には
class Hoge {
constructor() {
this._value ;
}
get value () { return this._value; }
set value (x) { this._value = x * 2; }
}
のようなケースで、
const hoge = new Hoge();
hoge.hasSetter('value') // true
となるようなhasSetterに相当するものです
hoge.hasOwnProperty('value') や
Object.getOwnPropertyDescriptor(hoge, 'value')
では引っかからなかったので、何か方法があれば教えていただきたいです Object.getOwnPropertyDescriptorはプロトタイプチェーンを辿らない
(だからOwnが名前に入ってる)
アクセサプロパティがプロトタイプチェーンにある場合、自前でプロトタイプチェーンを辿りながら判定する必要がある クラスにセッターっていうユースケースなら１つ前のhoge__proto__だけを見れば
実用上実際は殆ど十分なんじゃね 細かい質問なんですが、ソースリストの整形の問題でエディタとかの話になるんですが
オブジェクトの記述でプロパティの名前と値の文頭をそれぞれ字下げで揃えるってことはできないでしょうか
自分はATOMのbeautifyを使ってるんですが
プロパティ名の文頭は揃っても、値の文頭が揃わないと読みづらいなと感じてます プログラム板のVSCode スレッドとか
VSCode はデフォルトで、beautify だったかな？
拡張機能もあるけど <select>
<option value="1">aaa
<option value="2">bbb
<option value="3">ccc
</select>
のvalueの値と表示部分の一覧をjavascriptで取得することはできますか？
できるならどうやるんですか？ >>286
jqueryってやつを覚えないとだめなのか >>287
jQueryあった方が楽＋早い＋書きやすい＋読みやすい、から使っているだけだよ
jsで書くとこんな感じになると思うけど、あまり自信は無い
http://jsfiddle.net/qzum8xkt/1/ ここから怒涛のjQuery信仰者のご高説が始まるぞ >>281
atom-beautifyはjs-beautifyが動いてるけど
残念ながらその設定は無い
ESLintにもPrettierにも多分ない
IntelliJ IDEAとかならできたはず >>287
べつに覚えなくてもいいけど。
例えばselectタグにoreoreというidが降ってあったとすると、
[...document.querySelectorAll `select#oreore > option`]
.map(opt => [opt.value, opt.textContent])
で
[["1", "aaa/n"], ["2", "bbb/n"], ["3", "ccc/n"]]
が得られる。
jQueryは内部でSizzleというjavascript製セレクタエンジン使ってるんだが、モダンブラウザの場合そっちじゃなくてこのdocument.querySelectorAllを呼び出している。
なのでその場合jQueryはムダな数万行のコードで速度・帯域・メモリ・CPUをムダに消費するゴミ。 > なのでその場合jQueryはムダな数万行のコードで速度・帯域・メモリ・CPUをムダに消費するゴミ。
minifyされてるのを使えば、たったの1行（もしかしたら数行）だよ
1行なんだから速度・帯域・メモリ・CPUなんか気にしなくていい それにminify前のsizzleのコードはわずか2282行。
https://github.com/jquery/sizzle/blob/master/dist/sizzle.js
数万行とかいう嘘どこから出てきたんだ？
調べもしないでそういうことやるから信用されないんやで 実際DOM操作のためだけにjQuery読み込むのってコスパわるいん？ jquery-3.3.1.js
非圧縮開発版で10364行だった
266KB
min.jsは2行で85KB The Cost Of JavaScript In 2018
https://medium.com/@addyosmani/the-cost-of-javascript-in-2018-7d8950fbb5d4
javascriptのサイズと画像のサイズは同じ基準では比べられません。
https://i.imgur.com/pehx3NY.png
javascriptコードではダウンロードの時間のほかに、ブラウザによるパース（gzip、brotli等圧縮されたものであれば展開した後）、コンパイル、実行の時間を考慮する必要があります。
https://i.imgur.com/cZmFlKv.png
そういうわけで、CSS、Javascript、IMAGE、FONTの中でも、Javascriptが最もコストのかかる部分になっているのです。
https://i.imgur.com/rtm23gT.png javascript同士の比較の話してんのにcssや画像との比較を持ち出す池沼 <div id="rubykichigai">〜〜</div>
の中のHTMLを取り出す処理を書いてみよう！
jQuery：
html増分:
書き込み制限に引っ掛かるので省略するがintegrity付きの公式scriptタグで155bytes。
javascript増分:
console.log($('#rubykichigai').html())
上述html155bytes + javascript38bytesに加え、jQuery分約85,000bytesです。
全然短くありませんねｗ
ピュアjavascript：
html増分:
なし。
javascript増分:
console.log(document.querySelector`#rubykichigai`.innerHTML)
計60bytes >>302
画像だって圧縮を展開して表示されるんだから
対して変わらんと思うけど？ >>304
jQueryのコードは計算に入れなくていいでしょ？
読まないんだしさ。
console.log($('#rubykichigai').html())
console.log(document.querySelector`#rubykichigai`.innerHTML)
圧倒的にjQueryの方が短い。 console.log(document.querySelector`#rubykichigai`.innerHTML)
この変な書き方を使えば、↓こうなるのか
console.log($`#rubykichigai`.html()) どこかのサイトを使って素jsとjQueryで
・読み込み速度
・実行速度
・使用メモリ
の比較をしてくれ お前らどんだけヒマなんだよｗ
CDN、1.12なら間違いなくキャッシュされているからそもそも比較なんて出来ないぞ 少なくともそこがボトルネックになることってそんなにない気がする >>309
比較対象にコードの量や複雑さが含まれてない
そんな比較に意味があるのか？
どんな言語のどんなライブラリだって
コードをインライン展開するよりも
関数にするほうが遅くなるが、
それ以上のメリットがあるから使うだろ >>310
キャッシュされてるならロード時間は考慮しなくていい
>>312
jQueryを使って何かDOM操作をしたとしても人間が重いと感じることはない
・メモリ消費なんてたかがほんのちょっと
ゲームやるわけじゃないんだからjQueryごとき微々たるもの
なんでjQuery不要論者は必死に危機感煽ってるんだよ？ キャッシュされててもパース、コンパイル、実行時間はかかります。
必死に宣伝してるのはjQuery厨。
さもノーコストでいいことずくめみたいなウソつくのはやめろ。
どうやったってjQuery約85,000bytes分パース、コンパイル、実行時間が余計にかかる。
キャッシュのヒット率だって怪しいものだ。
マイナーバージョンひとつ違うだけで別物。
公式cdn、jsdeliver、google、cloudflare等々利用するcdnが違っても別物。
キャッシュはヒットしない。
バージョン違いオリジン違いの大量の糞ファイルで勝手にキャッシュ埋めやがって！
ユーザーのブラウザはお前らの物置じゃねーんだよ！ いや、今のV8はもうパースデータのキャッシュに対応していて有効になってる
現在はまだChrome Stableでデフォルト有効になっていないがコンパイルデータのキャッシュにも対応している
そしてそれらの問題はLayered APIで解決されるめどが付いている
今更議論をすること自体が無駄 >>314
だれもノーコストだっていってないし、
むしろコストは絶対あるって言ってるんだが？
なんでコストがあれば駄目みたいに思ってるんだ？ ■ このスレッドは過去ログ倉庫に格納されています
