+ JavaScript の質問用スレッド vol.133 +

■ このスレッドは過去ログ倉庫に格納されています
2018/04/16(月) 00:09:43.45ID:???
JavaScript を自ら学ぶ人のための質問スレッドです。
次スレは>>950が(本スレで改善案があれば考慮して)立ててください

■規則/推奨ルール
・メール欄を空欄にし、名前にレス番を入れることを強く推奨(なりすまし防止)
・質問内容は具体的に。言葉だけでなく、出来る限り再現性を確認したサンプルコードの掲示。
・質問テンプレートの利用推奨。
・質問への「答え」だけでなく「意見」を出しても良い。

■禁止行為
・丸投げ質問
・迷惑スクリプトの質問
・オレオレ用語の使用(一般的な用語を使用する事)
・煽り、批判等の他人を不快にさせる行為(批判の代わりに「AよりBが良い」のような代案を出す事)

■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。
【条件】期待する回答の条件を書いてください。
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
 1レスに収まらないならコード投稿サイトを利用してください。
 http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/

■回答者へ
・回答には多様性があります。他人の回答を尊重してください
・動作ブラウザや環境が限られる場合は、それを明記してください
・他人の回答を批判する代わりに、自分ならこう書くという例を示してください
・質問者がJavaScriptでなければ実現できないと勘違いしてるなら、その否定としてHTMLとCSSで実装しても良い
・他人の回答を見たくないのであれば、文句をつける代わりにNGにして見えないようにしてください。文句をつける=荒らしです
2018/05/29(火) 06:24:16.45ID:???
こうゆうことだろ
var hoge = {
property: 100,
method(){
return this.property;
}
}
2018/05/29(火) 06:25:40.93ID:???
>>794
昔はそのコードは動かないので、
>>773の昔のコード見てこのような書き方を
しているってのはおかしい

そして今そんな書き方はしない
2018/05/29(火) 06:27:15.53ID:???
>>797が今の書き方
だが、昔はこんな書き方はできなかったので
昔のコード見てこうなっているのはありえない
2018/05/29(火) 06:50:24.91ID:???
本当に分からないようだから一度だけガチで教えてあげる
質問者が言いたいのはメソッドを持ったオブジェクトを生成するとき
クラスを定義してnewを使うか、それとも使わないかという話だ
もうこれで納得出来ないのなら頼むから発言を控えてくれ
2018/05/29(火) 06:56:09.37ID:???
>>800
断る
2018/05/29(火) 07:01:38.19ID:???
>>801
狂人
2018/05/29(火) 07:09:18.58ID:???
>>802
気が済んだか?
2018/05/29(火) 07:18:09.35ID:???
static変数君が、classのstaticメソッドがうんたらかんたらって
流れにしたくて言い出した、と思いながら俺はみている
2018/05/29(火) 08:37:14.83ID:???
妄想乙。敵は一人ってやつですねw
2018/05/29(火) 08:43:27.65ID:???
答えを焦らして止めをさす戦術は実に嫌みだな
2018/05/29(火) 09:59:10.38ID:???
>>800
本当に分かってないようなので教えてやるが
今の質問者は>>791だぞ
2018/05/29(火) 12:08:48.27ID:???
indexedDB ってnosql ですか?
2018/05/29(火) 13:56:26.61ID:???
>>800
オブジェクトの生成じゃなくてインスタンスの生成じゃないの?
昔の仕様でnewなしでできるの?
2018/05/29(火) 14:51:13.63ID:???
まーた来たよクラスベース脳が
大人しくJavaワールドにお帰り
2018/05/29(火) 14:53:57.48ID:???
クラスとか関係ねぇ
インスタンスはインスタンス
なにをいってるんだか
オブジェクトだと範囲が広すぎて混乱するからインスタンスのほうがいい
2018/05/29(火) 15:02:53.88ID:???
newして生成するものがインスタンスですよ
2018/05/29(火) 15:12:19.47ID:???
Object.create()ならnewしなくてもインスタンスつくれるやん。
2018/05/29(火) 16:06:37.71ID:???
インスタンスはクラスベースの用語だろ。
ほにゃららクラスのインスタンス。
jsのプロトタイプベースの文脈ではnew ほにゃららのほにゃららはコンストラクタと言う。
そしてその正体はちょっとお作法に乗って作っただけのただの関数。
2018/05/29(火) 16:13:21.11ID:???
https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Class-Based_vs._Prototype-Based_Languages

> Java や C++ といったクラスベースのオブジェクト指向言語はクラスとインスタンスという 2 つの異なる実体があるという概念に基づいています。

> クラスはあるオブジェクトの集合を特徴付けるすべてのプロパティを定義する。
クラスとはそれが表すオブジェクトの集合の特定のメンバではなく、抽象的なものである。
例えば、Employee クラスで従業員すべてを含む集合を表す。

> 一方、インスタンスはクラスを実例にしたものである。
つまり、そのメンバの 1 つということである。
例えば、Victoria は Employee クラスのインスタンスとなることができる。このクラスは特定の個人を従業者として表すものである。
インスタンスはその親クラスのプロパティを正確に保持する。

> JavaScript のようなプロトタイプベース言語はこの区別がありません。単にオブジェクトがあるだけです。

繰り返す。Javaワールドに帰りなwww
2018/05/29(火) 16:51:26.62ID:???
文法上正しいならそういう書き方もあり
メジャーな方法を使いたいというのであれば、まあ、、何がどうであればメジャーなのか知らんが
メジャーと思う方法を使えばいい
2018/05/29(火) 17:31:52.52ID:???
>>815
つまりお前はJSにはインスタンスはないといいたいのか?
2018/05/29(火) 17:36:45.13ID:???
>>800
>>791への回答はまだですか?
819772
垢版 |
2018/05/29(火) 17:38:48.81ID:???
言われてみれば、昔風といいつつアロー関数式書いてましたね
しかも、アロー関数式もケアレスミスしてますしw
でも言わんとするところは分かりますよね?
2018/05/29(火) 17:41:29.02ID:???
言わんとすることを回答者に想像させるバカ質問者
2018/05/29(火) 17:42:07.53ID:???
関数
オブジェクトリテラル
クラス
を取り混ぜて書くのがJavaScriptなのでしょうね?
2018/05/29(火) 18:02:11.75ID:???
今も昔もjsにクラスはないよ。es2015で導入されたclassキーワードもクラスっぽく使えるオブジェクトを簡単に作れるシンタクティックシュガー。
2018/05/29(火) 19:30:08.02ID:???
var categoryHtml = document.getElementsByClassName("data-catg");
でHTMLCOLLECTIONを取得して
console.dir( categoryHtml)とすると結果は
ーーーーーー
HTMLCollection(5)
0:td.data-catg
1:td.data-catg
2:td.data-catg
3:td.data-catg
4:td.data-catg
length:5
__proto__:HTMLCollection
----------------


なのに
console.log("length"+ categoryHtml.length)
とすると
length1
となって何故かlengthが5のはずなのに1になってしまいます。
いみがわからないんですがなんでなんですか?
2018/05/29(火) 19:35:31.63ID:???
HTMLCollectionはNodeListと違って「生きている」「動的である」ということ
つまり取得したときの状態ではなく、現状が反映される
2018/05/29(火) 19:39:47.64ID:???
>>824
いやでも
console.dir( categoryHtml)
console.log("length"+ categoryHtml.length)
と並べて実行した結果なんですが。
動的と言っても変化する要素はないです。
2018/05/29(火) 19:47:47.62ID:???
>>822
class構文があるのにクラスが無いとか詭弁でしか無いと思うけどな

それは単にクラスベース言語のクラスを思い浮かべているだけだろう
オブジェクトのライフサイクルが予め存在するクラスシステムに縛られるのがクラスベースOOP言語だよ
一方インスタンスベースOOP言語は縛られないというだけでクラスがあることと矛盾しない
むしろ構造化プログラミングの観点から、『より素朴である』インスタンスベースOOP言語でも
自前でクラスシステムを組み上げるのは当然のことだし、
言語が予め標準的なクラスシステムを用意しておくのも自然なことなんだよ

改めて言うけど、クラスベース言語があって、そしてクラスがあるんじゃなくて、
クラスがあって、そしてそれをベースとする縛りを課した言語であるクラスベース言語があるんだからね
クラスっていうのはクラスベース言語に於ける存在ではなくもっと広い意味を持つもの
そしてクラスとインスタンスベース系言語は矛盾するどころか協力関係だし、
JSにも幾つかのクラスシステムが導入されてるし、
クラスとは、実はいろんなクラスシステムでのある形、塊のことをさす言葉なんだよ
2018/05/29(火) 19:48:46.05ID:???
>825
最低限再現できるコードを書いてみて
2018/05/29(火) 20:04:39.71ID:???
インスタンスベースOOP(笑)
しかもクラスベースOOPと並べて語っとるww
2018/05/29(火) 20:29:21.18ID:???
Javaの泥舟が沈みそうだからってほうぼうで必死すぎるだろ最近。
天下のIT土方様ならプロトタイプベースくらい覚えてから突っかかって来ればいいのに思い込みでギャーギャー喚いてるだけだからな。
そんな腐った心構えじゃJavaの沈没とともに仕事なくなるよ?
ま、次のCOBOLとも言われてるし立ち回りようによっちゃ死ぬまで食えるのかも知れんが。
2018/05/29(火) 20:54:21.23ID:???
ただでさえ最近関数型勢なんかの指摘がうるさいのに
JavaおじさんがJS覚えて来たら大変なことになるかもしれないぞ
2018/05/29(火) 21:20:14.85ID:???
>>815
>すべてのオブジェクトはインスタンスである。
ってかいとるやん。
何がいいたいんだ?
一対一の文脈に切り取って考えたとき生成されたほうがインスタンスだろ?
2018/05/29(火) 21:31:49.43ID:???
JSのインスタンスはこういうものです

const Kichigai = {
[Symbol.hasInstance](){return true}
}

42 instanceof Kichigai // true
2018/05/29(火) 21:35:20.39ID:???
× JSのインスタンスはこういうものです
○ JSのインスタンスの一例はこういうものです。他にもあります。
2018/05/29(火) 21:36:12.64ID:???
>>827
できました。
テストだからと思ってグローバルで実行してたから
ロードされる前に実行されてたのがだめだったのかもしれません。
でも、.lengthもどっちも同時に実行してるのになんで結果が違うのかよくわかりませんが。。。
2018/05/29(火) 21:39:46.76ID:???
インスタンスというのは言外に生成する側との関係性をふくんでいる。
オブジェクトはそういう意味合いはは含んでないってことな。
2018/05/29(火) 21:44:10.88ID:???
>>834
うざい。最低限再現できるコードを書くという
ルールすら守らないやつにレスはしない
2018/05/29(火) 21:44:18.98ID:???
>>834
再現コードが無いままだが、よくわからないと言うんならwindow.loadで、
あるいはsetTimeoutでもpromiseでも何でも使ってテストしてみたら?
2018/05/29(火) 21:44:56.55ID:???
それよりインスタンスベースOOPって何ぞwwwww
初めて聞いたんだがwwww
839Name_Not_Found
垢版 |
2018/05/29(火) 22:04:02.85ID:/fdysb7L
>>836
>>837
じゃあ、jsfidleよくわからないけど
これでいいのかな
https://jsfiddle.net/qh0v9mbh/1/
2018/05/29(火) 22:05:31.74ID:???
JSワールドに帰れ君は日本語弱いみたいね。
2018/05/29(火) 22:10:30.92ID:???
インスタンスベースoopワロタw
見逃してたわ
2018/05/29(火) 22:14:49.11ID:???
>>791にこたえられるやつはいないってこと?
2018/05/29(火) 22:15:13.81ID:???
どうせお前らがclass使ってもやることは「あなたは****人目の訪問者です」くらいだろ
2018/05/29(火) 22:16:31.33ID:???
>>840
JAVAワールドだったわ
2018/05/29(火) 22:19:01.39ID:???
安倍ちゃんが移民を本格的にはじめたらしいねぇ
言語の障壁ひくいIT分野の労働市場も大変になりそうだなw
2018/05/29(火) 22:21:28.81ID:???
インスタンスベースOOPとも言うよ。
ただ実際使われてるの始めて見た。
javascriptでインスタンスと言わないのはクラスとの対比がないためオブジェクトと言えば済むからだな。
プロトタイプベースと言えば通じるところをわざわざインスタンスベースと言ってみたり、
オブジェクトで済むところをわざわざインスタンスと言ってみたりする必要はないってことだ。
2018/05/29(火) 22:41:53.01ID:???
wikipediaのプロトタイプベースの項にはインスタンスベースの記述はあるな
2018/05/29(火) 23:24:41.77ID:???
ラーメン食べたい
2018/05/29(火) 23:32:12.81ID:???
>>822
newで生成する仕組みはclass構文以前からありますよね?
class構文は従来のコンストラクタ関数が変な感じになっていたのを整えただけだと思いますが
2018/05/29(火) 23:36:52.04ID:???
>>849
まず始めにお前が思う思わないはどうでもいい。
ただまあよく言われるけどあれが混乱の元なんだな。
これでも読め。
https://www.slideshare.net/mobile/yuka2py/javascript-23768378
2018/05/29(火) 23:42:13.99ID:???
>>846
一応いろいろ考えた結果その言葉を選んだ(選ばざるを得なかった)んだけど
クラス(システム)に縛られないこという話でクラスベースとの対比としてプロトタイプベースという言葉は使いにくかった

「クラス」のイメージが「代表的なクラスベース言語」で固まりすぎてるように
「プロトタイプベース」というとJSの代表的な(枯れた)コードイメージが頭に浮かんでしまうんじゃないかと思った
でも昔のJSはプロトタイプベースなのにプロトタイプがすっかり隠蔽されていて
1つの微妙なクラスシステムに半ば縛られていた形だったという事実があるだろう?
ES2015以降ようやっと、今回話した「特定のクラスシステムに縛られていないので、自分で自由にクラスシステムを構築できるし、
言語がデフォルトで提供しているものを使うこともできる」言語になったわけだけど
それでもJSでプロトタイプをよく使ってみた人は少ないんじゃないかと思った
JSって「非クラスベース」言語の中でも特殊だし、プロトタイプベース言語としても客観的に見て特殊だと思う
だから言葉としては適切でも、JSが代表であるプロトタイプベースという言葉を気軽に使うのは難しい

とはいえやっぱりもちろんJSも良くイメージさせる形で話したいし、大げさになりすぎるから「非クラスベース」という言葉は使いたくない
だからまあインスタンスが主で拡張が自由などという特色であれば、JSでも昔っからイメージがあるだろうから
そっちの面を出して語ったほうが良いと思ってあえてちょっと馴染み深くなくもあるインスタンスベースという言葉を使った
2018/05/29(火) 23:48:38.34ID:???
>>850
他言語のクラスは無いかもしれないが別にJSでクラスと言う言葉を使ってはいけないわけではないし
存在してはいけないと縛りを課す必要もないだろう

オブジェクト指向に確かにクラスは必須ではない
つまり言えばクラスは必須では無いより一般的な形での概念という形で存在し得る
クラスベース言語に捕らわれてクラス、クラス言うのもだめだが、
クラス、クラス言うなと一般に言うのもまたクラスベース言語に捕らわれてるってことだぞ
2018/05/29(火) 23:50:28.60ID:???
なんかさあ、結局javascriptのclassって「他の書き方でもできるけどclass構文でもできる」なんだろ

1つのことをするのにいろんな書き方ができる言語・・・
2018/05/30(水) 00:01:31.55ID:???
「でもできる」っていうのがよくわからん
別にオブジェクト一切なくてもチューリング完全な言語は沢山ある
class構文を使うっていうのはオブジェクト指向のそのまた1つのやり方の話でしか無い
「forでもwhileでも再起でもできる」変なの……って思うか?
考えすぎだよ
2018/05/30(水) 00:02:51.55ID:???
あきれた、何を他人事みたいに言ってるのかね、クラスクラスとしつこく言い出したのは自分だろうに。jsでクラスがあるとか言い出したらcでもある言えるわバカバカしい。
2018/05/30(水) 00:08:22.09ID:???
そもそもJavaScriptがクラスベースの言語だなんて誰も言ってないんですよ
プロトタイプベースだということは分かった上で、
クラスベースくらいかっちりした書き方も出来た方がいいよね?
ということころから始まってるのです
分かりますね?
2018/05/30(水) 00:08:58.02ID:???
あきれた、Cにオブジェクト指向とclass構文が入ってからまた来てね
2018/05/30(水) 00:10:55.68ID:???
JavaScriptにクラスなんてないガーとか言う人は
相手がJavaScriptをクラスベース言語と思い込んでいると思い込んでいますが
実際にはそんな間違いをしてる人はいないんですよ
分かりますね?
2018/05/30(水) 00:13:02.10ID:???
クラスベースとは関係のないオブジェクト指向において一般的な意味のクラス
について話されてるのかと思ったら
クラスベースのようなクラスを話してる人も居るのか
class構文は将来の提案も含めると「かっちりした」っていう目的も強いんだろうけど
2018/05/30(水) 00:13:19.56ID:???
>JavaScriptにクラスなんてないガー

こういうガーの使い方する人はじめてみた
2018/05/30(水) 00:13:53.24ID:???
自分のお勉強が済んだら方向修正か、情けない。
最初から勉強してきてからイキれや。
2018/05/30(水) 00:15:51.62ID:???
>>858
JavaScriptをクラスベース言語だと思っているやつが居るという話は誰もしていないが
クラスベースの感覚を持ちすぎたままJavaScriptでクラスという単語を使うな
もっと広い意味でも使えると言うことだろう
2018/05/30(水) 00:16:50.98ID:???
ガーをどう使うかは個人の勝手
クラスをどう使うかは個人の勝手
2018/05/30(水) 00:18:03.87ID:???
>>854
いるんだよねこういう低レベルなのに無理して絡もうとするやつ
2018/05/30(水) 00:18:51.54ID:???
つよいポケモン よわいポケモン
そんなの ひとの かって
ほんとうに つよい トレーナーなら
すきなポケモンで かてるように
がんばるべき
2018/05/30(水) 00:19:40.18ID:???
>>864
確かにいるな、低レベルなのに無理して絡もうとするやつ
2018/05/30(水) 00:24:08.37ID:???
インスタンスはクラスベースの用語 は何処行った
2018/05/30(水) 00:31:43.91ID:???
メッセージパッシングはOOP用語だがJavaではふつうメソッド呼び出しと言って普段誰もメッセージパッシングガーとか話してないだろ
2018/05/30(水) 00:57:48.65ID:???
これは難しくて特殊な話だから普段どうこう言っても仕方ないでしょ
2018/05/30(水) 02:40:02.88ID:???
>>823
console.dir, console.log は、異なる関数だろ
2018/05/30(水) 03:00:33.09ID:???
>>870
もともとはlogでやってたけどいろいろ試してる中でdirにしただけです。
結果は同じです。
872870
垢版 |
2018/05/30(水) 03:02:38.45ID:???
>>823
DOM の構築よりも前に、JS コードが実行されてるのかも

JS コードを、<script>要素内に書いて、それらのDOM よりも下に書けば、
JS コードの方が後に実行される

それか、jQuery の、$(function(){...}); を使えば、
DOM 構築後に、JS コードが実行される
2018/05/30(水) 06:34:00.95ID:???
>>871
いいから早くサンプル貼ったら?
それとも夢で見た話かな?
874870
垢版 |
2018/05/30(水) 06:40:59.05ID:???
>>823
そもそも、そのHTML を、ここでチェックしたら、エラーで動かない
https://validator.w3.org/

HTML が間違っている
875870
垢版 |
2018/05/30(水) 06:57:44.19ID:???
<tbody> 要素を、<table> 要素で囲むと、正常に動いた。
つまり、<table>要素が必要

<table>
<tbody id="tbdy"></tbody>
</table>
2018/05/30(水) 09:07:30.83ID:???
同じページで複数のjsファイルを読み込んでいるときってグローバルは
それぞれのグローバルが結合して、それぞれのファイルはは別のファイルの変数をグローバルスコープ上で共有すると考えていいんでしょうか?
2018/05/30(水) 09:13:12.72ID:???
>>876
以前、http://mevius.5ch.net/test/read.cgi/tech/1518940081/769- でも質問されてた
2018/05/30(水) 09:15:03.71ID:???
>>876
自分で読み直してみて、何がしたいのかその文章から読み取ってもらえると思う?
2018/05/30(水) 09:28:33.30ID:???
>>876
よくわからんが、グローバルスコープは1つしかないぞ
2018/05/30(水) 09:46:30.79ID:???
>>876
ファイルごとに名前空間が作られるわけではありません
複数のファイルを全て結合した1つのファイルを読み込むのと同じことです
さらに言えば、その全てのコードをHTMLファイルに記述した場合と同じことです
2018/05/30(水) 10:18:03.14ID:???
>>880
イメージしやすくてとてもわかり易いです。
ありがとうございます。
2018/05/31(木) 13:57:23.84ID:???
googleなどで検索するとき
検索ボックスに単語をいれると、ボックスの下に候補のリストが出ますが
ああいうのはJSで実現できるんですか?
リストを下に表示させるのはどうやれば良いのでしょうか?
2018/05/31(木) 14:20:53.11ID:???
サジェストね
jsだけでするタイプとajax使ってphpとかと連携するタイプがある
あらかじめ決まった内容から絞り込むならjsでリスト持っておく
DB検索とか使うならajaxでサーバーサイドで絞り込む
1文字入力ごとに絞り込んで候補をulとかにしてinputの下に表示する
選択されたらinputの中身を入れ換える
2018/05/31(木) 16:44:40.75ID:???
Rails 5.1で作るVue.jsアプリケーション 〜Herokuデプロイからシステムテストまで〜
https://youtu.be/ycOeM2umXkY

伊藤淳一の動画
Rails 5.1 から、Vue.js を使う

「vue.js autocomplete」で検索!
2018/05/31(木) 16:54:31.23ID:???
サジェスト汚染しとけっていうフリか
2018/05/31(木) 18:39:06.40ID:???
よっしゃアドセンス狩りしたろw
2018/05/31(木) 18:48:31.41ID:???
予めJSで持っておくとか言ってるやつが居るが
datalist要素の存在忘れちゃったの?
2018/05/31(木) 22:01:25.41ID:???
>>883
側というかインターフェースと言うか外観はどうしてるのでしょうか?
検索ボックスのしたにdivかなんかの要素をCSSでfloatしてJSで追加するのでしょうか?
めんどくさそうですね。
2018/05/31(木) 22:20:54.22ID:???
お前がめんどくさそう
2018/06/01(金) 09:19:26.03ID:???
https://trends.google.co.jp/trends/explore?date=all&;q=php,python,javascript
javascript終わったな
2018/06/01(金) 09:56:18.42ID:???
https://trends.google.co.jp/trends/explore?date=all&;q=javascrip,java,c%2B%2B
javasriptおわた
2018/06/01(金) 11:07:57.90ID:???
「c」ってめちゃくちゃ一般的な語、というか字だけど
その比較意味あんのかww
893Name_Not_Found
垢版 |
2018/06/01(金) 11:09:26.52ID:gyLOTEac
日本生まれのクソ言語Ruby『最も嫌われているプログラミング言語』堂々ランクイン!!
https://japan.zdnet.com/article/35109803/

おめでとうクソ言語!🎊
おめでとう日本の恥!!www
https://japan.zdnet.com/storage/2017/11/02/e28392adae17a191547db083133339eb/171106-zdnet-1-01-languages-1-900x675.png
2018/06/01(金) 11:11:00.17ID:???
どうせperlがダントツなんだろと思って確認してみた

まあわかってたさ
2018/06/01(金) 11:13:46.71ID:???
最も嫌いな言語はシェルスクリプトだろ普通
コマンドライン入力を使ってプログラミング言語を実現してるから無理矢理感ありすぎ
21世紀に書くものじゃないわ
2018/06/01(金) 11:17:53.89ID:???
公害言語perlがダントツ
delphi、vbaが二位争い
php、objactive-c、coffeescript、rubyといった技術負債言語が第三グループを形成
javascriptマジ高みの見物wwwww
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

ニューススポーツなんでも実況