X

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

■ このスレッドは過去ログ倉庫に格納されています
0001Name_Not_Found
垢版 |
2019/12/26(木) 19:50:04.40ID:???
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.142 +
https://mevius.5ch.net/test/read.cgi/hp/1568622157/
0299Name_Not_Found
垢版 |
2020/02/19(水) 13:11:05.45ID:hTlb9aFi
プログラミングしたいけど顔がキモオタ顔になるのが嫌です
職場のseの話し方とか顔が嫌い
最近ネットに増殖してきたエンジニア系男子の顔も本当に嫌い

どうすればいいですか
0300Name_Not_Found
垢版 |
2020/02/19(水) 15:10:00.96ID:???
>>299
鏡を眺めて表情を作る練習をしましょう
0302Name_Not_Found
垢版 |
2020/02/19(水) 22:21:10.00ID:???
>>298
IEは昔からCSSの対応はそんなに悪くないぞ
IE発のものも多いし
0305Name_Not_Found
垢版 |
2020/02/20(木) 14:26:04.22ID:???
>>293さんの投稿について、
ブラウザプラグインで、
cssのuser-select: none を抜くようなことができたらいいのに。
あるかな？
0306Name_Not_Found
垢版 |
2020/02/20(木) 20:18:49.87ID:???
幾つかのイベントでトップレベルでstopImmediatePropagationする
style*="user-select"を走査して外す
それだけでも半分以上に効果がある
0307Name_Not_Found
垢版 |
2020/02/20(木) 22:44:18.76ID:???
jQuery で、すべての要素を巡回しながら、user-select: none; なら、auto に変更する。
Chrome では、正常に動いた

$( function ( ) {
const user_selects = [ 'user-select', '-moz-user-select', '-webkit-user-select', '-ms-user-select' ];

$( '*' ).each( function ( index, element ) {
user_selects.forEach( elem => {
that = $( this )
if ( that.css( elem ) === 'none' ) { that.css( elem, 'auto' ) }
} );
} );
} );
0308307
垢版 |
2020/02/20(木) 22:49:23.12ID:???
>>307
修正。上下が逆だった

>user_selects.forEach( elem => {
>that = $( this )

that = $( this )
user_selects.forEach( elem => {
0309Name_Not_Found
垢版 |
2020/02/21(金) 00:07:12.59ID:???
質問です
classって名前空間に閉じ込めることはできないんですかね？

他所のJS読んだときに
安易な名前だとぶつかっちゃいそうな気がするんですが
0310Name_Not_Found
垢版 |
2020/02/21(金) 03:41:00.21ID:U3BoPE0C
>>307
それをどうやって相手のWEBサーバーからのHTMLに組込めば良いの？
0312307
垢版 |
2020/02/21(金) 17:14:59.02ID:???
Chrome のF12 開発者ツールのコンソールに、
「ここから〜ここまで」の行、つまり「$( function ( ) { } );」の内側だけをコピーして、Enter を押す

これでエラーが出たら、そのページは、jQuery を使っていないから、
以下のすべてをコピーして、Enter を押す。
コードの内容は、head 内に、script タグを作って、Google のCDN から読み込んで実行する

でも、ひょっとしたら、jQuery を使わなくても、出来るかも。
素のJavaScript だけで、書けるかも知れない

const script = document.createElement( "script" );
script.setAttribute( "type","text/javascript" );
script.setAttribute( "src","https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"; );

document.head.appendChild( script );

script.addEventListener( "load", function( ) {
$( function ( ) {
const user_selects = [ 'user-select', '-moz-user-select', '-webkit-user-select', '-ms-user-select' ]; // ここから
$( '*' ).each( function ( index, element ) {
that = $( this )
user_selects.forEach( elem => {
if ( that.css( elem ) === 'none' ) { that.css( elem, 'auto' ) }
} );
} ); // ここまで
} );
} );
0313Name_Not_Found
垢版 |
2020/02/21(金) 19:56:32.80ID:???
>>290のサイトの場合は
TampermonkeyやViolentmonkey拡張等のユーザースクリプトで
// ==UserScript==
// @name englishplus選択右クリ
// @match https://www.englishplus.jp/*
// @grant none
// @run-at document-end
// ==/UserScript==
(function() {
function un(e) { e.stopImmediatePropagation(); }
document.addEventListener('selectstart', un, { capture: true });
document.addEventListener('mousedown', un, { capture: true });
document.addEventListener('contextmenu', un, { capture: true });
document.head.insertAdjacentHTML('beforeend', `<style>
* { user-select: initial !important; }
</style>`);
})();
でおｋ
0314Name_Not_Found
垢版 |
2020/02/21(金) 21:02:10.11ID:???
どんなサイトで来るか分からんしブックマークレットにしたほうが賢いでしょ
0315307
垢版 |
2020/02/21(金) 21:49:00.00ID:???
jQuery を使わず、素のJavaScript だけで書けた！

Chrome のF12 開発者ツールのコンソールに、下のコードをコピーして、Enter を押す

//ドキュメント全体から全ての要素を取得する
const all_elements = document.getElementsByTagName( "*" );

for ( let i = 0; i < all_elements.length; i++ ) {
elem = all_elements[ i ];
if ( window.getComputedStyle( elem ).userSelect === "none" ) {
elem.style.userSelect = "auto";
}
}
0317Name_Not_Found
垢版 |
2020/02/22(土) 13:21:02.05ID:???
>>309
React, Vue.js か忘れたけど、フレームワークでは、scoped CSS になっていた
0318Name_Not_Found
垢版 |
2020/02/22(土) 15:30:16.05ID:???
プログラミング初心者

質問お願いします
ブラウザの作業を自動化したいと考えてます。ググってみた結果
現在pythonでSeleniumを使った方法を調べてますが、色々と苦戦しております。
検索ワードでjsでもできそうなのですがそもそもプログラムに詳しい方からすると
どちらの方法が好ましい(効率的とか簡単等)のでしょうか？
因みに使用用途はダウンロードを繰り返すというものです。
ひと昔前にあったダウンローダー等使えないサイトとなっております。
宜しくお願いします。
0319Name_Not_Found
垢版 |
2020/02/22(土) 16:15:07.94ID:???
君自身が色々と調べて迷っているのに、
たった数行の情報をここに書いて見た人が何か判断できると本気で思ってるのかい？
せめてここのサイトのこのコンテンツをDLしたいですとか言ってくれないと
可能性が無数にありすぎて何もわからないでしょ
0320Name_Not_Found
垢版 |
2020/02/22(土) 17:00:20.19ID:???
漏れは、スクレイピングに、Ruby, Selenium WebDriver, Nokogiri を使っている

ブラウザの自動操作もできるし
0321320
垢版 |
2020/02/22(土) 17:08:04.99ID:???
【VBScript】WSHについて話し合うスレ【JScript】
https://mevius.5ch.net/test/read.cgi/tech/1578522041/27

ここに書いたように、Ruby, Selenium WebDriver で、
ブラウザを自動操作して、Yahoo に自動ログインしてる

ユーザー名を入力して、ボタンを押す。
パスワードを入力して、ボタンを押す
0322320
垢版 |
2020/02/22(土) 17:12:48.55ID:???
ダウンロードには、wget, curl を使う

それよりも複雑なものには、漏れは、Ruby, Selenium WebDriver, Nokogiri を使うけど、
各サイトの解析が大変

例えば、5ch の投稿から画像ファイルだけを探すのに、
「div.message a」内のURL で、拡張子が「png jpg jpeg gif」のものだけを絞り込むとか、
こういう処理を、Ruby以外で書くのは辛い

Rubyは、可読性が高いから良いけど
0323Name_Not_Found
垢版 |
2020/02/22(土) 17:39:49.88ID:???
javascriptでやるにしてもユーザースクリプトやブラウザ拡張、Node.js+Selenium、Electron等いろいろ方法はあるわけで
0324Name_Not_Found
垢版 |
2020/02/22(土) 17:59:14.09ID:???
場合によってはコンソールに打ち込んでもいいだろうしな
0325Name_Not_Found
垢版 |
2020/02/22(土) 18:21:29.17ID:???
>>313
面白そうで試してみたいけど、
どう使えばいいの？
0326Name_Not_Found
垢版 |
2020/02/22(土) 18:24:26.43ID:???
ググレカス
.user.jsにして拡張機能ページにDnDするだけだろポンコツ
0327Name_Not_Found
垢版 |
2020/02/22(土) 21:59:56.96ID:???
>>326
ありがとう、そのキーワードでググってみるよ
0328Name_Not_Found
垢版 |
2020/02/22(土) 22:40:57.62ID:???
わざわざファイルにせんでもユーザースクリプト拡張で新規作成選んでコピペするだけでしょ
0329Name_Not_Found
垢版 |
2020/02/23(日) 14:02:07.76ID:???
わざわざ拡張入れなくてもファイル１つ作るだけでしょ
0330Name_Not_Found
垢版 |
2020/02/23(日) 16:48:07.81ID:???
これ系は昔からブックマークレットで無効にしてたわ
>>290のサイトも試したがもちろん解除できる

この程度でjQueryを使う必要性も無いし、ユーザースクリプトやブラウザ拡張も不要
0331Name_Not_Found
垢版 |
2020/02/24(月) 09:54:18.68ID:???
こういう直前の１，２レスしか頭に入らないやつをどうにかしてほしい
ブックマークレットの話は十分に出たからそれ以外の解決例をオマケで話してるんだろうが
頭悪すぎ
0332きりん
垢版 |
2020/02/24(月) 21:11:14.91ID:KdUVT2aj
Flexboxで二つの列をつくり、左が3つのブロック、右が一つのブロックをつくります。
position:stickyで右側のブロックのスクロールを半固定（左側のブロック要素が全表示されるまで固定）します。

JSでやりたいこと
右側のブロック（#col-4）の左側の中心値から、左側のブロック（#col-1,#col-2,#col-3）の右側中心値まで、
線を描きつなぎます。いろいろと、調べてソースを書き込み、取り急ぎ二つのブロックを繋げてみましたが
うまくいきません。どなたか解決方法をご教授ください。

■HTML
<div class="col-container">
<div class="part-1">
<div class="col must_col" id="col-4">あああ</div>
</div>
<div class="part-2">
<div class="col must_col" id="col-1">いいい</div>
<div class="col must_col" id="col-2">ううう</div>
<div class="col must_col" id="col-3">えええ</div>
</div>
<canvas id="myCanvas" ></canvas>
</div>
0333きりん
垢版 |
2020/02/24(月) 21:15:31.42ID:KdUVT2aj
■CSS
<style>
.col-container{
position:relative;
display:flex;
flex-direction:row-reverse;
align-items: baseline;
}
.part-1 {
position: sticky;
top: 0;
width: 48%;
max-width: 48%;
width: 48%;
}
.part-2 {
width: 48%;
max-width: 48%;
align-items: stretch;
justify-content: space-between;
perspective: 800px;
}
.col {
margin-bottom:20px;
}
#myCanvas {
position : absolute;
left: 0px;
top: 0px;
}
</style>
0334Name_Not_Found
垢版 |
2020/02/29(土) 14:28:18.87ID:???
セミコロンの有無について質問です。

const half =(number) => {
return number / 2;
};
―――――――――――――――
If (条件式) {
処理
}



関数を定義する時は }; とするのに、
If文などでは }の後にセミコロンを付けないのはなぜですか？
0335Name_Not_Found
垢版 |
2020/02/29(土) 15:22:59.46ID:???
ifは式じゃないから…というのはCの時代からの構文解析の決まりだな

と言ってもJSはそもそもセミコロン不要だから
本当に飾りみたいなもんだろう
0337Name_Not_Found
垢版 |
2020/02/29(土) 17:20:09.16ID:???
ありがとうございました！
ブロックという概念があるんですね。
progateでそこら辺のこと書いてなかったんで。
調べてみます！
0338Name_Not_Found
垢版 |
2020/02/29(土) 19:53:09.59ID:???
ajaxについての質問です。
動画サイトにて、下記のように事前に用意した変数を
POSTで送信する場合に、プロパティ名に変数と同名を利用していました。
値のanswerが変数のanswerを参照するのは理解できるのですが、
プロパティのanswerは変数のanswerを参照してしまったりしないのでしょうか？
ajaxの送信する構文の中ではプロパティ名は参照しない…的な仕様なのでしょうか？

...
var answer = $selected.text();
$.post('test.php', {
　　answer: answer
})
...
0339Name_Not_Found
垢版 |
2020/02/29(土) 20:16:42.47ID:???
ajaxに限らずオブジェクト初期化子の裸のキーは変数展開されない
es2015以降であれば
{
　[answer]: answer,
}
のようにブラケットで囲むことで変数や計算結果をキーにできる
0340Name_Not_Found
垢版 |
2020/02/29(土) 20:16:49.87ID:???
>>334
関数を定義するなども;は必須ではない、つけないスタイルもある
ただ特定の場合で次の行と結合するので、そこを気にしたくないのであれば;を無駄につけるというだけ
一方if文などは次の行と結合しないことがわかりやすいのでつけない人が多い
要するに気分や感覚の問題
0342Name_Not_Found
垢版 |
2020/03/01(日) 10:12:08.14ID:???
>>339
ありがとうございます。
いろんな言語の当たり前の仕様だったのですね。
すっきりしました。

>>341
すみません。
翻訳しましたが、よくわかりませんでした…
0343Name_Not_Found
垢版 |
2020/03/01(日) 12:38:18.25ID:???
>>341
ESの仕様書は英語としては難しいものではなく、
withだのofだのandだの小学校レベルの前置詞や接続詞さえ分かればほとんど読める
あとちょこちょこ出てくる単語はプログラミング用語だと思って暗記する
そして根気よく順を追ってゆっくり読んでいく力さえあればいい

まず構文の定義の見方
obj = { key: value }　とあったら
https://tc39.es/ecma262/#sec-object-initializer 　の「Syntax」の所を見て
ObjectLiteral: { PropertyDefinitionList }　から　key: value　がPropertyDefinitionListに当たるでしょ
PropertyDefinitionListのとこをクリックすれば更に定義に飛んで、PropertyDefinitionをカンマ「,」で区切ったものということが分かり、
PropertyDefinitionは４種類あるけど今回はPropertyName: AssignmentExpressionの形でしょ
つまりkeyはPropertyNameってことで、PropertyNameのどちらに当たるかというと
ComputedPropertyNameは[prop]の記法だから、そちらではない方でkeyがLiteralPropertyNameということが分かった
そしてその中でも、文字列リテラルでも数値リテラルでもないのでIdentifierNameということがわかる
0344Name_Not_Found
垢版 |
2020/03/01(日) 12:39:27.14ID:33Mst+Ql
>>341
valueも同じように、AssignmentExpressionからたどって
AssignmentExpression→ConditionalExpression→RelationalExpression→ShiftExpression→AdditiveExpression→
MultiplicativeExpression→ExponentiationExpression→UnaryExpression→UpdateExpression→LeftHandSideExpression→
NewExpression→MemberExpression→PrimaryExpression→IdentifierReference→Identifier→IdentifierName
と長いけどただただ適切なところを辿っていけば見つかる
{ key: value }が{ LiteralPropertyName:IdentifierName }の形だということをどうやって知るかが分かったら、次に評価を見よう

評価はざっくり分けて２種類あって、「Static Semantics」と「Runtime Semantics」がある
まずコードという文字列が最初に読み込まれてパースされるときに働く処理がStaticの方で、
上の行から実際に処理が始まってその構文が効力を発するときに働く処理がRuntimeの方と思ったら良い
StaticはRuntimeの前段階とも言えるので、それっぽいRuntimeの目安がつけられるのであれば、
最初にRuntimeを見てわからない定義が出てきたらStaticやSyntaxをみるのが効率がよい

今回はオブジェクトの大本のRuntimeから見ていこう
https://tc39.es/ecma262/#sec-object-initializer-runtime-semantics-evaluation
ObjectLiteral:{PropertyDefinitionList}に当たることはSyntaxで事前に調べて分かっている（ここからリンクを飛んで調べてもよい）のでその下の処理を読んでいこう
0345Name_Not_Found
垢版 |
2020/03/01(日) 12:40:30.97ID:???
>>341
1.Let obj be OrdinaryObjectCreate(%Object.prototype%).
Let X be YとはXをYとおく、つまるところX = Yということ
OrdinaryObjectCreate(%Object.prototype%)はプロトタイプをObject.prototypeとした一般オブジェクトを作る処理
プロトタイプをObject.prototypeとした一般オブジェクトとはつまるところ「 { } 」のこと
つまり obj = { } ということ

2.Perform ? PropertyDefinitionEvaluation of PropertyDefinitionList with arguments obj and true.
Performとは実行すること、PropertyDefinitionList のPropertyDefinitionEvaluationという処理を、1.のobjとtrueを引数として渡して実行
つまり PropertyDefinitionList.PropertyDefinitionEvaluation( obj, true ) ということ
Performの後の?はReturnIfAbrupt処理の省略記法
JSの内部的には何か処理をするたびに、渡された値が期待したものでなかった場合など、エラーが起こりうる
しかし、内部処理を途中で中断することは、エンジンのハングアップや強制終了を意味するのでそれはできない
正しい処理ができたときは、正しい値を普通に返すのと同じく、問題が起きたら問題が起きたという値を返さないといけない
それを判断しているのがReturnIfAbruptであって、正しい処理なら次へ進み、そうでなければ例外を呼び出し元へ返す

つまり、3.Return obj.と合わせるとこういうこと
try {
PropertyDefinitionList.PropertyDefinitionEvaluation( obj, true )
}
return obj
0346Name_Not_Found
垢版 |
2020/03/01(日) 12:41:52.18ID:???
>>341
こういう感じで読んで行けばよい、次に
PropertyDefinitionEvaluationではまず
PropertyDefinitionList:PropertyDefinitionList,PropertyDefinition
が評価されて、カンマで区切られた各プロパティ定義が再評価される、次に
PropertyDefinition:PropertyName:AssignmentExpression
1.Let propKey be the result of evaluating PropertyName.
evaluatingとは評価することで、つまり propKey = PropertyNameの評価
今回はPropertyNameの中でもLiteralPropertyName、その中でもIdentifierNameということが分かっているから、
LiteralPropertyName:IdentifierNameをみて、1.Return StringValue of IdentifierName.
つまり、IdentifierNameの文字列を返すことがわかる

慣れてくるとこの時点でもう先を見る必要はない
もし{key:value}ではなく{'key':value}だった場合は'key'はIdentifierNameではなくStringLiteralになるわけだが、その処理は
1.Return the String value whose code units are the SV of StringLiteral.
つまりその文字列を返すということがわかる
なのでこういう整然とした積み重ねロジックで普通に考えるとこの先の処理で何か違うことが起こるとは考えにくいので
{key:value}と{'key':value}は同じということが予想できる
勿論先に進んでpropKeyがどのように扱われているかを見ていってもよい

ざっくり言うとこういう感じでESの仕様書は読める
0347Name_Not_Found
垢版 |
2020/03/01(日) 12:46:05.90ID:???
>>345 に間違いがあった

try {
　　PropertyDefinitionList.PropertyDefinitionEvaluation( obj, true )
} catch ( err ) {
　　return err
}
return obj

のイメージが正しい
0348Name_Not_Found
垢版 |
2020/03/01(日) 19:07:03.67ID:W4sArTyK
長いw
0349Name_Not_Found
垢版 |
2020/03/01(日) 23:15:05.87ID:???
>>338
例えば、そのオブジェクトと、
そのオブジェクト内のプロパティーのキーが同じ名前でも、区別がつく

let obj = { obj: 1, a:2 }

オブジェクトそのもの
console.log( obj ) //=> { obj: 1, a:2 }

オブジェクトの各プロパティー
console.log( obj.obj ) //=> 1
console.log( obj.a ) //=> 2
0350Name_Not_Found
垢版 |
2020/03/01(日) 23:47:58.26ID:???
オブジェクトに名前はない
名前があるのは関数
0351Name_Not_Found
垢版 |
2020/03/03(火) 22:31:22.31ID:???
吾輩は猫である
名前はまだない
0352Name_Not_Found
垢版 |
2020/03/03(火) 22:36:14.30ID:???
そもそも概念的には一般的に物体というものが名前を保持しているのではない
名前が物体を参照しているのだ
0353Name_Not_Found
垢版 |
2020/03/05(木) 00:03:06.37ID:yOGCnpaD
インプットのvalueを変えたいんだけどdomのIdでないと中身変換できないん？
nameもclassもやってみたけどミスってるわけじゃないのに変化しないから気になったんだけど
0354Name_Not_Found
垢版 |
2020/03/05(木) 00:03:33.19ID:???
function EventHandler(event) {
var e = event || window.event;
}

イベントオブジェクトの取得で↑が例としてのってたのですが
またはの記号って左辺が優先されるとかありますか？
event がなければ window.event から取得するみたいな
0355Name_Not_Found
垢版 |
2020/03/05(木) 05:50:00.42ID:???
>>353
JavaScript ID属性で取得/設定する(getElementById)
https://itsakura.com/js-getelementbyid

getElementById は、単数形を返すけど、

下のものは複数形を返すから、最初の要素なら、
elements[ 0 ] みたいな順番を指定しないといけない

var elements = document.getElementsByClassName(names);
elements は、見つかった要素の生きた HTMLCollection です

var elements = document.getElementsByName(name);
elements は、生きた NodeList コレクション

VSCode では、入力補完で、戻り値の型も表示される！
0356Name_Not_Found
垢版 |
2020/03/05(木) 05:59:03.51ID:???
>>354
短絡評価だろ

左が真なら、右を評価しないで、左を戻す。
左が偽なら、右を評価して戻す

let e = 1 || "a" //=> 1

e = null || "あ" //=> あ
0358Name_Not_Found
垢版 |
2020/03/05(木) 08:38:40.99ID:???
>>353
querySelector
querySelectorAll
getElementsByClassName
他にいくらてもある
0359Name_Not_Found
垢版 |
2020/03/05(木) 12:04:18.25ID:bvupghia
>>353
fileは変えられないよ
0360Name_Not_Found
垢版 |
2020/03/05(木) 15:54:16.11ID:yOGCnpaD
>>355
どうも、後で見直したら配列で戻ってくるのに気づいてなかった
ありがとう
0361Name_Not_Found
垢版 |
2020/03/05(木) 16:20:49.73ID:???
配列じゃないけどね。
本当に配列が欲しいならArray.from( )か [... ]で囲みなよ。
0362Name_Not_Found
垢版 |
2020/03/06(金) 00:27:15.97ID:???
IE11というクソカスの為にObject.getOwnPropertySymbols()のポリフィルを自作したいんだが、
どんなアプローチでSymbolを区別してやればいいかねぇ？
0364Name_Not_Found
垢版 |
2020/03/06(金) 09:20:03.57ID:???
JavaScriptにおいて、Arrayの一般的な訳語が配列ではないと言うのなら、そうですね。
0366Name_Not_Found
垢版 |
2020/03/06(金) 12:28:52.50ID:???
NodeListは「配列メソッドが使えない！」という誤認が初心者でよく見かけるな
0367Name_Not_Found
垢版 |
2020/03/06(金) 12:49:50.41ID:???
間違いじゃないよ。今は改善されて配列メソッドと互換性があるメソッドがNodeListに追加されたってだけ
だから古いブラウザだと動かないことがある。
0368Name_Not_Found
垢版 |
2020/03/06(金) 13:01:38.25ID:???
鳥は飛べますが、
猫が飛べるようになったら鳥でしょうか？
0369Name_Not_Found
垢版 |
2020/03/06(金) 13:08:48.30ID:???
存在しないものを例に挙げるのは詭弁のガイドラインに抵触しますが、
あえて言うならば猫メソッドに鳥メソッドを追加しても個別の飛べる猫です
人間が琵琶湖で飛んでも鳥ではなく鳥人間と呼ばれます
0370Name_Not_Found
垢版 |
2020/03/06(金) 13:24:23.71ID:???
ダックタイピングとは、Rubyなどの動的型付けオブジェクト指向プログラミング言語で行われる、
型付けのやり方です。 次の文章が基になっている考え方となっています。
「もしもそれがアヒルのように歩き、アヒルのように鳴くのなら、それはアヒルである。」
つまりドナルドダックはアヒルです。
0371Name_Not_Found
垢版 |
2020/03/06(金) 16:48:01.27ID:r4vwtDx/
>>365
結局配列みたいにインデックスで呼び出せるんだから同じでしょその意味では
0372Name_Not_Found
垢版 |
2020/03/06(金) 18:15:43.96ID:???
>>367
> 今は改善されて配列メソッドと互換性があるメソッドがNodeListに追加されたってだけ

これは本当ですか？
NodeListにはforEachだけでなく、pushやconcatもあるのですか？
0373Name_Not_Found
垢版 |
2020/03/06(金) 19:22:12.14ID:???
>>371
JSでは配列は特殊なオブジェクトと言うことができるが、これをもってオブジェクトは配列であるというのがお前の意見。
それでいいならいいんじゃねメンドくせえ。
リアルでもガンガンそう主張していけよｗ
0374Name_Not_Found
垢版 |
2020/03/06(金) 19:45:03.45ID:???
>>372
ないならないんじゃねｗ
知らんよ。俺はNodeListは配列だと思ってないし。

そういったブラウザ間の違いとか、本質的でない部分で
無駄に疲れるのがいやだからjQueryを使うわけで
0375Name_Not_Found
垢版 |
2020/03/06(金) 20:25:24.14ID:???
>>374
>>367の「間違いじゃないよ」は>>366の「配列メソッドが使えない！」にかかってたんじゃなかったのか？
主張に一貫性がないな
0376Name_Not_Found
垢版 |
2020/03/06(金) 23:57:52.99ID:???
>>371
たとえば
const NL = document.querySelectorAll('div');

これはイケるけど
NL.forEach((item) => { console.log(item) });

これは駄目、配列じゃないから
const hoge = NL.map((item) => { return item.innerHTML; });

20年以上前のgetElementsByTagName時代から
「配列と同じでしょ」っていう人は一定数いて
どこかで配列として扱おうとしてコケる、っていうのを繰り返して今に至ってる

だから、今まだこのスレで質問する側なら、あんまり意固地にならず
ノードリスト、コレクションは配列とは似て非なるもの、って認識を持ったほうが良いよ

というのが答えてる人の総意だと思う
0377Name_Not_Found
垢版 |
2020/03/07(土) 00:03:42.00ID:???
>>365
それは違う
querySelectorとquerySelectorAllが返すのはNodeList
getElementsByTagNameや、要素.childrenが返すのがCollection

NodeListは静的で、取得後にDOM内で要素が増減しても変わらない
Collectionは動的で、取得後でもDOM内で要素が増減すると変わる

getElementsByホゲホゲを使うことはもう無いだろうけど
childrenはまだ使う機会があるだろうから、覚えておこう
0378Name_Not_Found
垢版 |
2020/03/07(土) 02:35:12.17ID:???
なんでこんなばらばらの仕様にしたの？
それを吸収するjQueryは素晴らしいね！
0379Name_Not_Found
垢版 |
2020/03/07(土) 02:37:19.03ID:???
NodeListは静的で、取得後にDOM内で要素が増減しても変わらない
だけでDOMの内容自体は変わることに注意

Collectionは動的で、取得後でもDOM内で要素が増減すると変わる
のでインデックス番号とかで扱ってるとバグることがあるので注意
0380Name_Not_Found
垢版 |
2020/03/07(土) 04:20:59.94ID:???
>>364
頭大丈夫か？
Arrayの一般的な訳語が配列あったとしても、
その逆も同じとはならないだろ
「配列」はより一般的な用語だ
0381Name_Not_Found
垢版 |
2020/03/07(土) 04:35:50.82ID:???
>>364
「配列」をArrayと1:1関係と決めつけるほうがおかしいでしょ
>>371は多分用語の「配列」のことを言ってるんでしょ

そもそも大大大前提としてJSのArrayはただのオブジェクトでしょ
別に数字キーで管理されているわけでもなく、普通の文字列と値の組み合わせのオブジェクトでしょ
ただほんのちょっとプロキシ的にlengthと数字キーを扱ってArrayらしさが出てるだけの
「呼ぶことができるオブジェクト」である関数と同じように
他のビルトインオブジェクトと比べても異色ではない存在でしょ

その点実際にJSと絡むときはレイヤー挟んでるとは言えListと名が付いてて
仕様の表現的にはNodeListのほうがよほど配列らしいでしょ
それなのにArrayだけを配列と呼ぶことに拘る論理的な必然性と意味があるのか？
あまりにもナンセンスでしょ

あと>>365もおかしい
NodeListもコレクションだから
liveなコレクションがHTMLCollectionでstaticなコレクションがNodeListってだけだから
0383Name_Not_Found
垢版 |
2020/03/07(土) 07:19:52.22ID:???
>>381
> そもそも大大大前提としてJSのArrayはただのオブジェクトでしょ
> 別に数字キーで管理されているわけでもなく、普通の文字列と値の組み合わせのオブジェクトでしょ

はあ、そうですか
つまり、あなたの中では {0:0 ,1:1, length:2} も "" も配列なんですね
曖昧な世界に生きてますね
0385Name_Not_Found
垢版 |
2020/03/07(土) 11:24:45.07ID:???
373 Name_Not_Found sage 2020/03/06(金) 19:22:12.14 ID:???
>>371
JSでは配列は特殊なオブジェクトと言うことができるが、これをもってオブジェクトは配列であるというのがお前の意見。
それでいいならいいんじゃねメンドくせえ。
リアルでもガンガンそう主張していけよｗ
0386Name_Not_Found
垢版 |
2020/03/07(土) 14:04:55.76ID:i6mdUe9z
>>248

>>249
ライブラリを使わずにオフラインで3Dゲームを作ることが出来ました。
仕組みを1から理解出来て良かったです
0387Name_Not_Found
垢版 |
2020/03/07(土) 19:27:47.69ID:???
>>356->>357
遅ればせながらありがとうございます。

短絡評価というのですね。
if文で何の気なしに使ってるだけで、左辺から処理されているとか考えたことなかったです。
どうも！
0388Name_Not_Found
垢版 |
2020/03/07(土) 19:46:50.99ID:k8B1CrKG
オフライン環境でファイルの書き込み＆保存をする方法はありますか？
読み込みなら出来てるんですけど…
0389Name_Not_Found
垢版 |
2020/03/07(土) 20:04:44.29ID:???
>>381
配列に限らず
全てのオブジェクトはObjectオブジェクトの子孫だよ
0390Name_Not_Found
垢版 |
2020/03/07(土) 20:06:44.80ID:???
>>388
出来たら何をしたいんだこの犯罪者め！
0391Name_Not_Found
垢版 |
2020/03/07(土) 20:13:04.16ID:pg7+MEPr
>>388
これはテキストエディタ書き込みでもしたいんじゃねえの？
0392Name_Not_Found
垢版 |
2020/03/07(土) 20:59:29.95ID:???
>>383
そうではない
Arrayを配列たらしめてるのは[[DefineOwnProperty]]内部メソッドの効果であって
逆に言えばArrayは[[DefineOwnProperty]]トラップがあるだけの普通のオブジェクトだと言うことだ

>>389
プロトタイプ的に子孫であるかどうかの話をしているのではなく、
形態と効果について話してる
0393Name_Not_Found
垢版 |
2020/03/07(土) 21:03:16.28ID:???
要するに話を戻すと、
Arrayというのはその存在がそのものがJSの中で特殊なものではなく、
オブジェクトがトラップによって配列たらしめられているからArrayは配列なのであって、
他の配列たらしめられているオブジェクトも同じく配列と呼ばないというのはナンセンスだという話
0394Name_Not_Found
垢版 |
2020/03/07(土) 22:13:58.57ID:rVIogRi+
一般的にはarray-likeと呼ばれているよそれ。
配列はやはりArrayと対応する訳語として使われててArray.prototype継承してるオブジェクトだね。
Node ListやHTML CollectionをArray-likeではなくArray、配列として認識しろってんならその定義をチームや話相手と共有してくれよな。
常識にしたいなら標準化組織と話し合ってね。
俺らに言われても困る。
0395Name_Not_Found
垢版 |
2020/03/07(土) 23:26:45.05ID:???
いやいや、Arrayも配列だが、配列はArrayだけではないでしょ
例えばTypedArrayは型付配列だけど、型付配列は配列じゃないか
そのように配列っていうのは広い概念でしょ
何を理由のない変なこだわりをしてるんだか
0396Name_Not_Found
垢版 |
2020/03/07(土) 23:28:50.50ID:???
それとArray.prototypeを継承しているかっていうのと、
Array（のインスタンス）かどうかっていうのは別でしょ
Array.isArrayでもわかるように
Arrayかどうかっていうのは内部メソッドが付与された
Arrayたらしめられているオブジェクトかっていう点が重要でしょ？
0397Name_Not_Found
垢版 |
2020/03/07(土) 23:37:41.15ID:???
JSでなんちゃらオブジェクトっていうのは、
どんな修飾がされたオブジェクトかっていう括りであって
プロトタイプはオマケであって本質とは関係ないでしょ？

ArrayはArrayたらしめる修飾がされたオブジェクトであって
その修飾の方向性を配列と呼ぶんでしょ
その中でも具体的に大きい特徴は、
lengthプロパティが実際の配列としての要素数とリンクしているということでしょ
その点例えば{0:'a',length:1}は用意に世界観が壊れるが
ある種似ているかもしれないTypedArrayは要素数固定のおかげで
Arrayのように個性的なトラップメソッドを付与されていない、
内部スロットがある薄い特殊オブジェクトだけど、配列と呼べるんでしょ

ならばNodeListとかも配列と呼ばないのは不自然でナンセンスだとは思わないかい？
0398Name_Not_Found
垢版 |
2020/03/07(土) 23:40:29.66ID:???
これって１人でずっと会話してるの？
■ このスレッドは過去ログ倉庫に格納されています