+ JavaScript の質問用スレッド vol.133 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください
■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。
■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)
■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける=荒らしです ■FAQ
◆開発者ツール(Developer Tools)の基本的な使い方
▼諸注意
- 本説明では Google Chrome の開発者ツールの名称に従います。他ブラウザで使う場合は適宜読み替えて下さい。
- Edge- でコンソールを使うには予め開発者ツールを起動しておく必要があります(開発者ツールを起動しないと console.log() が機能しません)
- Safari はデフォルトで開発者ツールが無効な為、有効に設定する必要があります。
https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html
▼要素を検証
1. ページ上で右クリックして [要素を検証]
2. [Elements] パネルが開き、対象のDOMノードが選択される(選択対象が目的の要素でなければ [Elements] パネル上で選択し直す)
3. 右側のサイドバーから知りたいステータス名のタブを選択する
- [Styles] タブ … CSSプロパティの指定値を表示 (※カスケードによって上書きされたプロパティは取り消し線で表示される)
- [Computed] タブ … CSSプロパティの算出値を表示("font-size: 1em" を指定していても算出後の "*px" で表示される)
- [Properties] タブ … 選択したDOMノードのプロパティを表示
▼コンソール
1. JavaScript コード上で console.log('Hello, World!'); と入力
2. [Ctrl] + [Shift] + [I] キー(IE は [F12])で開発者ツールを開き、[Console] パネルを開く
3. [Console] パネルに "Hello, World!" と表示される
(※window.alert() は String 型に変換されますが、console.log() は Object 型の中身をそのまま表示してくれます。) ■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 和訳) PHPでやってみたが
intval('123'); # 123
intval('0123'); # 123
intval('abc'); # 0。0じゃないだろw
intval('abc123'); # 0。0じゃないだろクソが
intval(''); # 0。 shine
JavaScriptだと数値じゃないものはNaNとなるから
0と区別できるが、PHPだと区別できないじゃないか
NaNを0にしたければ parseInt('') || 0 とすればいいだけだし >>6
そんなめんどくさい書き方しないといけないjavascript 数字文字列か否か厳密な区別が欲しいならphpならctype_digit()を使えばいい
キャストしたいときシンプルで短い(int)$hogeで済む >>7
面倒くさい?
数値に変換できない文字が0になるんですけど、
どう対処すれば良いんですか?
こっちのほうがめんどくせーだろw 自分は面倒くさい時は1で割るけど邪道なん?
''123"/1 → 123
"0123"/1 → 123
"abc"/1 → NaN
"abc123"/1 → NaN >>8
ctype_digit()ってbool返してくるんですけど?w
ctype_digit($hoge) ? intval($hoge) : NULL
とか書くんですかね?w まーたペチプァが暴れてんのかw
ペチプの仕様と違うからクソってかww
おととい来やがれwwww よく使うものほど短く書けるべき、そのようになっていないならばクソである
・・・・という主張はまさにjquery厨 PHPやVBのがよっぽどクソ言語だと思うね
Javascriptはましな方だとぼくは思いますyo テキストエリアに変更があったら保存する
という処理はどう書くのがいいですか?
keydownなどのたびに比較していたら負荷が大きそうです keydownのたびに比較しても負荷に問題はありません最近の端末は優秀です スレチだったらごめんなさい
スライドを作るjavascriptのフレームワークとしてreveal.jsを見つけてやってみようと思ったんだけど、htmlとかマークダウンで書けるのは分かったけどjavascriptは自分で意識的に使う訳ではないのかな?
スライド遷移とか動作させるのにjavascriptを使ってるってイメージで良いのかな? タブをアクティブにする方法ってあります?
tampermonkey(ユーザスクリプト) で使います。 >>7
なんか勘違いしてるみたいだけど、NaNも立派なdouble型の数値だよ
doubleに変換するならNaNになるのが当たり前
それが嫌なら|0するなりしてintに変換すればいい オブジェクトが格納された配列をイテレートしていく
オブジェクトの指定した属性が指定した値だったら、イテレートを中止し、結果としてtrueを得る
条件に一致するオブジェクトが存在しなければ、結果としてfalseを得る
という処理を書く時に一番いいやり方はどういうものでしょうか? jQuery宣伝ニキ出てこいオラッw
webを壊したjQuerywww
920 Name_Not_Found sage 2018/04/20(金) 05:28:09.34 ID:???
code.jquery.comの証明書が死んで、そこらじゅうのサイトが余波で崩壊してるね
とりあえずセキュリティ例外にぶっこめば動くには動くが・・・セキュリティ面でもサイト利用者にそれを求めるのかって点でもマズイな >>32
良く分からないけどCDNを使ってる時だけでは?
はい論破 code.jquery.comの証明書なんかあったん?
今みてlets encrypt使ってることには驚いたが
確かlets encryptのとこの証明書は全体からみたらごく一部だけど使えない端末あるから jQueryのようなヘビー級ライブラリはCDN使用が前提。
各サイトに置かれたらキャッシュ効かないだろバカか。
これはjQuery公式が言ってたことだぞ。
それがこの体たらく。
たいした組織じゃなかったな。一気に信用なくなった。
都合悪くなったとたんスレ違いjQueryニキもだんまりだしww どうしても必要じゃない限りcdn使わないんだよなあ
jqueryもどうしても必要じゃない限り使わないんだが cloudflareのようなところに自分で配置すればいいのでは? cloudflareだろうがnetlifyだろうが多数のサイトが少数のurlからロードしてこそキャッシュが効くのだ。
お前がcloudflareに上げて公開したところがお前のクソサイトからしか利用されんから意味ない。 なんだ?意気揚々とあちこちに書き込んでるのかw
https://github.com/jquery/codeorigin.jquery.com/issues/34
解决したみたいね。アクセスしたけど問題なし。
https://code.jquery.com/
CDNプロバイダが何かやらかしたのかな?
続報あれば、このgithubのissueに書かれるかもね >>29
> なんか勘違いしてるみたいだけど、NaNも立派なdouble型の数値だよ
数値じゃないよ。数値じゃないからNaNはどうやっても計算できない
数として扱われないから >>32
> jQuery宣伝ニキ出てこいオラッw
> webを壊したjQuerywww
それだけ多く使われていたってことですかねぇw >>34
> 今みてlets encrypt使ってることには驚いたが
驚くことじゃない
Let's Encryptのルート証明書「IdentTrust」、SSL認証局第1位に
https://news.mynavi.jp/article/20180325-605154/
> Q-Successは3月22日(ドイツ時間)、「IdenTrust, which is used as root certificate
> for Let's Encrypt, has become the most popular SSL certificate authority」において、
> IdentTrustのシェアが17.5%に到達し、SSL認証局として最も高いシェアを確保したと伝えた。
> 3年前にはシェアがゼロだったIdentTrustがこの3年間で業界首位に上り詰めたことになる。 >>37
> jQueryのようなヘビー級ライブラリはCDN使用が前提。
jQueryがヘビーってw
gzip圧縮時でたった30KBだぞ jQueryのようなヘビー級ライブラリはCDN使用が前提。
各サイトに置かれたらキャッシュ効かないだろバカか。
これはjQuery公式が言ってたことだぞ。
それがこの体たらく。
たいした組織じゃなかったな。一気に信用なくなった。
都合悪くなったとたんスレ違いjQueryニキもだんまりだしww
こんなときばっかり、だんまりかよwwww こんなときばっかり、だんまりのjQueryニキwww
こっちは大ポカ発覚で
たのしーwwww jQueryがヘビー級ライブラリって何年前の知識だ?
いまやライト級ライブラリ扱いだぞ
知識が数年前で止まってる技術者ほど厄介なやつはいないよね どう考えてもヘビーだろw
同じことをDOM APIだけで実現すれば
ライブラリのサイズは0!
自分で書いたコードの量だけですむ それはライブラリではない
今はライブラリの中でヘビーかライトかの話 その自分で書いたコードの量が多いっていう落ちだろw
自分で書いたコードはCDN仕えっても効果ないし
という指摘されるところまでが予定のうちですw いったんjQuery入れてしまえば最後、何だかんだでプラグイン始めどこの馬の骨とも分からないクオリティバラバラなjQuery依存のライブラリを導入することになる。そしてさらにこれらに依存したコードを書くからjQueryコケると皆コケるwww
まるで将棋だなwwwww クオリティバラバラなのと全部俺様クオリティどちらを取りますか?
俺様クオリティは10年経ってもクオリティはかわりません! 10年たっても低いクオリティのまま
成長してないんじゃダメだろうw 最近だとasync関数使ってその中で
awaitやfor-awaitやwhile_awaitでイベント待ちたい場合もあると思うんだけど
コールバックベースであるjQuery使ってる人ってどうやって上手く調整してるんだろうか Not a Numberなのに数値という意味が分からない
Nullが文字列って言うようなものでは? >>29
ソースよろ
NaNはNumberオブジェクトに属し
typeof NaNでnumberを返すくらいの認識しかない
数値計算の結果生成されるからNumberオブジェクトに入れてるだけじゃないの? >>63
その前にやることが有るだろ。
お前の、ソースよろ だ typeof nullがオブジェクトwwwww
javascriptワロタwwwww Rubyなんか、null(nil)にnil?メソッドが有るんだぜw
もちろん nil.is_a? Object は true である >>64
は?なんのソース?
アタリマエのこと書いただけのつもりなんだが? もしdoubleな数値型の値だったら、比較や加減乗除できるはずなんじゃないの 比較も演算もできるやろ
まあ結果が直感には反するかもしれんが
仕様(IEEE 754)に沿ってるだけ
そもそもなんでそんな仕様なんだクソが、とは思わなくもない
既存の数値処理にあわせたとか、ゼロ除算や文字列からの変換をエラーにしたくなかったとか、なんか理由はあるんだろう jQuery は、gzip圧縮時で、30KB。
広告1つ分
CDN はサポートがしっかりしている、Google, MS を使うのが普通
jquery.com は、テスト用で使えるってだけ。
jQuery はソースコードを作っている団体。
CDN サービスなど、やっていない https://code.jquery.com/
<title>jQuery CDN</title> 広告の30KBと圧縮コードの30KBでは全然違う。
jQueryはロードしたねヨカッタヨカッタというようなライブラリではなく、導入しているからには様々なプラグイン、依存ライブラリ、依存コードの依存先となる。
つまり非同期読み込みできない。bodyの下のほうに置いてる場合でもない。head内でなるべく早く読み込まなければ依存コードが動かない。
なのでbodyの最後に置ける広告コードと違い、圧縮状態で30KBのコードが展開され、パースされ、ロードされるまでそのページはブロックされる。 jQueryはbodyの最後におけるよ
実際にやってる人いた
jQueryとCSSを最後に読み込ませてサイトの表示速度を上げる方法
https://hodalog.com/move-jquery-to-footer/
たしかにjQueryを最後の方で読み込ませることで
表示速度が改善されているね 最近はwebpackで一つないし少数のファイルに結合してしまうけど、
昔RequireJSを使っていた頃は、jQueryを含めて依存プラグイン全てを
非同期で読み込ませていたな
どういう仕組みかと言うとRequireJSが全てのJavaScriptファイルを
同時に読み込み、依存関係情報に従って、すべてが揃ってから発動する
だから、jQueryをjQueryを使うライブラリを非同期で両方同時に読込始めて、
先にjQueryを使うライブラリの読み込みが終わったとしても
jQueryの読み込みが終わってからライブラリの処理が発動するから問題なく動作する 操作前のDOMが描画された後にガチャガチャ動いて良いなら当然そうできる。
ただし依存コードもすべてその後ろに置くこと。
コードの規模にもよるが、大きくなるにしたがって姿は見えれどインタラクション不能状態が長くなる。 >>75
jQueryに限らずDOMを操作するものは全て同じことでは?
広告はページ本編から独立しているから、問題ないのであって
同じように独立していればjQueryでも同じことできるし。
えーと、なにが良いたいんだい?
最初の一回は読み込むのが遅いけど、二回目以降は
まったく問題ないよで解決するよね。 アホがjQury厨を召喚したせいでまたjQueryのすれになっとるわ
死ねよカス
別スレでやれやばーか 同じサイトで2回目以降問題ないのは当たり前だろ
無関係のサイトでも同じcdnから読んでればキャッシュ効くのがいいとこなのに angular使ってるサイトってどこがある?
教えて >>61,63
(nullはオブジェクトではないけど)
オブジェクトに対するnullみたいな存在だよ
他にもInfinityとか、0が+-の2種類あるとか、double型ならではの仕様があるけれど
結局それらもNaNも全部ひっくるめてJSの数値の内なんだよ
JSの仕様と言うかもうCPUに内蔵されてる仕様で、
1.0+1.0が2.0になるように、1.0/0.0などをするとNaNになる
それらは全てdouble=64bit型の数値であってビット配列が違うだけなんだよ ちょっと自分もどういう流れで話してたか忘れそうだから纏めるけど、
だから通常の数値=doubleが期待される関数でNaNが返ってくるのは極めて自然なんだよってこと
それとJSの数値がdoubleであることによる特徴と、int/uintの特徴と、int/uint化の手法
くらいはしっかり理解しておくのもいいよということ
(概念上は一時的だけど)intにキャストすればInfinityや-0、NaNなんかは出てこないからね 浮動小数点数の演算においてゼロ除算の結果の扱いと
文字列をintに変換しようとしたときの扱いと
全然関係なくね 文字列をInt型に変換しようと思ってparseIntを使ったという話ならそれは確かに
parseIntが悪いっていうか紛らわしいってことになるかもしれないね
ただ、(ES.nextの話は抜きで簡単に言うと)
JSの数値っていうのは全てdouble型だからね
Int型を返す関数っていうのは無いの
parseIntのIntは、元のJavaでは確かにint型のIntの意味合いもあるけど、
JSではせいぜいInteger=整数っていう程度のものと考えると良い
つまり文字列の中の整数(=integer)を抜き出して、double型で返す関数ということ
そしてdouble型を返す関数に於いて、不正な値を例えば0にするか、それともNaNを返すか
どちらが自然かと言えばやっぱり後者だろうよ javascriptで阪神を勝たせる方法ありますか var 試合結果出力 = () => {
var rand = Math.rand();
var 阪神勝利フラグ = true;
console.log(阪神勝ちフラグ ? '阪神勝利!' : rand > 0.5 ? '阪神勝利!' : '阪神敗北…');
};
試合結果出力(); 以上のように、数値リテラルには様々な表現方法がありますが、本質的にはこれらの違いは見かけ上のものに過ぎません。
JavaScriptにとっては「0b10010」(2進数)、「0o22」(8進数)、「0x12」(16進数)、「1.81e1」(指数は)はいずれも同じく10進数の18なのです。
どの表記を選ぶかは、その時々でのよみやすさに応じて決めるべきです。
JavaScript本格入門より 10進数と言うのは嘘だな。
ならどうして0.1 + 0.2が0.30000000000000004になるんだい?
2進数だろう? >>89
"10進数" リテラル を
内部的に2進数に変換して計算しているからだけど?
だから10進数であっている 合ってない。
> いずれも同じく10進数の18なのです。
8進数の22なのです。
16進数の12なのです。
"8進数" リテラル を
内部的に2進数に変換して計算しているからだけど?
だから8進数であっている
"16進数" リテラル を
内部的に2進数に変換して計算しているからだけど?
だから16進数であっている いやあってるじゃん?
なにを根拠に違うって言ってるのか? phpにおけるNAN(phpにおいてはNaNじゃなくてNAN)がphpにおいてはfloat/double型に属するというのはいい
しかしNANが数値だとすると以下が成り立ってしまうのではないか
前提1: NAN - 1 は NAN となる
前提2: NAN - 2 は NAN となる
∴1=2である ∞に1を足しても∞に2を足しても∞なのは変わらない
しかし1=2とはならない
それは∞が特定のある数値を指すものではなく、∞=無限大という概念を指すものだから
NaNも同じ JS は、内部的には整数は無い。
数値型は、Double のみ
整数かどうか判断できる、関数もない
一方、Ruby では整数型もある >>94
NaNはdouble型で非数値なんだよ
そう書いてあるでしょ?
http://php.net/manual/ja/function.is-nan.php
> NAN(phpにおいてはNaNじゃなくてNAN)
NANは誤植じゃないの
NaNと書いてある箇所もあるし、NANが正しいなら、"Not A Number" が正式名称になる
単数の "A" を大文字にするのはどう考えてもおかしい >>98
前段
>>29からずっとNaNがdoubleがって言ってるやつが、>>29でこう書いてる
>なんか勘違いしてるみたいだけど、NaNも立派なdouble型の数値だよ
「NaNも(中略)数値だよ」
後段
php -r "var_dump(NaN);" // Notice: Use of undefined constant NaN と共にstring(3) "NaN"を出力
php -r "var_dump(NAN);" // float(NAN)を出力 >>99
ああ、ごめん
型の話と勘違いしてた
>>59,93,98までが自分で他は知らない ■ このスレッドは過去ログ倉庫に格納されています