JavaScript の質問用スレッド vol.125

レス数が900を超えています。1000を超えると表示できなくなるよ。
2022/08/07(日) 15:57:40.26ID:TS5TGpUB0
!extend:checked:vvvvvv:1000:512
JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-5のテンプレを読んだ上で質問してください。次スレは>>950>>2の「次スレの立て方」を元に立ててください

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

■前スレ
JavaScript の質問用スレッド vol.124
https://mevius.5ch.net/test/read.cgi/tech/1636525464/
VIPQ2_EXTDAT: checked:vvvvvv:1000:512:: EXT was configured
2023/06/19(月) 14:42:31.77ID:iYcFBKEZ0
ちょっと調べてたんですが、こうでしょうか?

if (((a == b) && (c != d)) || ((e == f) && (g != h))){
alert ("正解");
}

「a == bとc != dの条件が両方ともtrue」か「e == fとg != hの条件が両方ともtrue」なら"正解"と警告を表示したいのですが…
三重括弧なんてあります?
2023/06/19(月) 14:49:42.42ID:G503Uwj70
>>845で大丈夫やろ。
なんで試さんの?
2023/06/19(月) 14:54:44.66ID:Glrukv1f0
演算子優先度の理解が追い付いて無いなら好きなだけ括弧使えばいい
2023/06/19(月) 14:58:41.52ID:3rS08iXar
何重カッコでもいけるけど演算子やカッコが増えると可読性が落ちて条件式を読み解くのが辛くなる
コードは長くなっても条件式をいくつかに分割して変数に入れた方が読みやすくなるよ

const x = (a == b) && (c != d)
const y = (e == f) && (g != h)
if(x || y){
alert ("正解");
}
とか
2023/06/19(月) 15:02:17.21ID:iYcFBKEZ0
皆さん、ありがとうございます
変数に入れるのがいいですね
やってみます
2023/06/19(月) 23:22:27.82ID:xNSaH23va
イテレータ、Map、Setがややこしくて😩なんだけど実務で使う?
一応理解したけどカスタムイテレータ作ってそれをオブジェクトに追加してfor...ofなんて無理だな
プログラマーならバリバリ使うのかな?それとも知識として仕組み知っとくだけ?
2023/06/20(火) 13:18:59.52ID:es0ShzRur
Mapはキーと値の組み合わせのコレクション
Setは重複のない値のコレクション
どちらも実務で出番はある
イテレータは中身を1個ずつ取り出せるものの総称

カスタムイテレータに関してはmdnもおすすめのジェネレータ関数を覚えておけばいいかと
バリバリではないにしてもここぞというときに役に立つ
2023/06/21(水) 18:20:14.61ID:He5qrAkL0
tableタグのtrをjqueryかjavascriptでアニメーションアコーディオンがうまくアニメーションしないんだけど
slideToggleで開発ツールではheightの数字は変化しているんだけど・・
もしかしてtrにheightという概念が無いから?

<tr class=name><td>名前1</td></tr>
<tr class=detail><td>中身1</td></tr>
<tr class=name><td>名前2</td></tr>
<tr class=detail><td>中身2</td></tr>
・・・
2023/06/26(月) 12:08:05.73ID:QXVTwCFE0
変数って定義する前はundefinedが入ってるんでしょうか?
2023/06/26(月) 20:02:32.96ID:nZR6QJ/D0
>>854
変数定義前は変数がない
変数定義時に値を代入しなければundefinedで初期化される
2023/06/26(月) 21:13:06.03ID:QXVTwCFE0
>>855
ありがとうございます。
2023/06/29(木) 21:35:42.23ID:I06beN9ya
Promiseメソッドなんなの独自ルール多すぎでしょ。もはや別言語に感じる。これよく使用される?
2023/06/29(木) 22:34:31.96ID:mZg1DRHQ0
Promise周りは最初は取っつきにくいけど、凄く使いやすく作られてるし、物凄くよく使うよ。
2023/06/29(木) 23:09:38.14ID:OBXN/r9b0
async awaitでしかfetchをかけない自分と、thenでしかfetchを書けない前任者のせめぎあい

xhrはなぜか知らんがもう時代じゃないらしいし
860デフォルトの名無しさん (アウアウウー Sab9-Br7/ [106.128.36.203])
垢版 |
2023/06/30(金) 10:14:20.96ID:Lj29KtNna
的外れな質問だったら申し訳ありません…
クラスAが長くなってしまったこと(1500行くらい)、類似クラスBとある程度共通化できそうな部分があったので関数Cとして
別ファイルに切りだそうと思いました。
その際、関数CからAの複数のメンバ変数/メソッド(Bも同じ名前の変数/メソッドを持っている)を利用したいのですが、
一つ一つ引数で渡していくと記述が煩雑だし、仕様も変わる可能性があります。
そこで、Aのインスタンスから関数Cにthisを引数として渡すようにして、関数Cからは仮引数this.メンバ変数 などのようにして自由にAのメンバにアクセスできるようにしました。

以上のやり方で、動作はしているようですが、なんか良くないやり方の様な気もしています。
上記のやり方は一般的な方法でしょうか。何かデメリットはありますでしょうか。
2023/06/30(金) 10:55:58.80ID:qu6f9mWQ0
クラスAたBの同名の変数と関数をBaseクラスにしてAとBに継承すれば同名の変数関数を持ってることが保証できてうっかり名前変えてしまったとかのバグ防げるんじゃない?インターフェースみたいに
それから引数じゃなくてbind使えば関数C内でthisを自然な感じで使えるとか
862デフォルトの名無しさん (アウアウウー Sab9-Br7/ [106.128.39.112])
垢版 |
2023/06/30(金) 13:05:23.88ID:2BLecjKja
有り難うございます。
デメリットとしては後でA~Cをいじった時にバグの温床になりやすいこと、くらいの認識で良いんですかね。
基底クラスを継承するかたちにすることも考えたいと思います。
確かにbind/callを使った方が、動作は同じでよりシンプルな気がしてきました。
2023/07/01(土) 04:46:01.59ID:nMEzWNF9a
is_a, has_a

継承か包含か、古典的な質問
2023/07/01(土) 19:38:17.78ID:hPyQUT1Ya
javascript:
if((result = prompt("input formula string","")) == "") alert("no formula string"); else alert(eval(result));
2023/07/01(土) 22:48:30.73ID:WfKHfAvE0
なんつー邪悪なコード
2023/07/05(水) 21:30:37.79ID:74hfvDDi0
(function(){
 ~
})();

こういう書き方をしてるコードがあったんですけど、これは実行も含めた関数の書き方でしょうか?
最初の(と最後の)()の意味がわかりません
2023/07/06(木) 00:31:51.01ID:IKcM4kIN0
>>866
即時関数
()は関数宣言ではなく、関数式として実行するため
2023/07/06(木) 01:40:00.57ID:vc4JCbkY0
>>867
ありがとうございます
よくわかりました
2023/07/07(金) 13:17:53.80ID:tybFBPle0
なるべく自分で考えたキモイ名前は晒したくないからな?
870デフォルトの名無しさん (ワッチョイ a15f-eaRz [14.13.136.34])
垢版 |
2023/07/08(土) 18:01:12.76ID:0tWDp4eO0
今ホームページを制作しているのですが教えて頂きたいです。
下記内容のコードの書き方がわかりません。

5枚の画像があるのですが、全部では無く一旦一枚目のみ表示させたいです。
次に各画像を説明する文字があります。その文字にマウスカーソルを合わせると、その文字にあった画像に2枚目3枚目と切り替わるようにしたいと思っています。

初心者すぎるので例としてコードを作って頂ければ見ながら調整したく思っています。
どなたかお教え頂けませんでしょうか。
2023/07/08(土) 20:53:43.61ID:S1M2Nutrd
>>870
それはもう質問ではない
2023/07/08(土) 21:24:42.99ID:DhofVjWT0
ChatGPTに聴け
2023/07/08(土) 23:32:58.73ID:EFUbRXYX0
>>870
質問にするなら>>1-3を読もう
2023/07/09(日) 01:18:13.12ID:YP8p84HTa
よくある、スライダーでしょ?
jQuery でもあるでしょ

Bootstrap のCarousel (カルーセル)
https://getbootstrap.jp/docs/5.0/components/carousel/
875デフォルトの名無しさん (ワッチョイ a15f-eaRz [14.13.136.34])
垢版 |
2023/07/09(日) 01:44:11.98ID://wYUerL0
なんか色々ルールがあるんですね
諦めて勉強します
ありがとうございます
2023/07/09(日) 19:52:50.68ID:gl6FDMI+a
jQuery slider
Bootstrap Carousel などで検索すれば、一杯ある

一杯あるけど、難しいから自作する人はいない。
皆、jQueryUI やBootstrap のCarousel などの既製品を使う
2023/07/09(日) 21:16:30.84ID:VzLiONyC0
え、そんな難しい要素無いよ
2023/07/17(月) 23:23:58.12ID:XzfBWjood
フォームフィールドが定義されたPDFファイルがすでにあって、ブラウザ上のJavascriptでWebフォームに入力されたテキストをPDF側のフィールドに反映させてダウンロードすることができるpdfライブラリってあまりすか?

使い方のイメージとしては、たとえばPDF上に名前を入力する箇所がいくつかあるけど、ユーザーは単にweb上で普通のinputフォームを入力してsubmitすると名前が入力済みのPDFファイルをダウンロードできる、という感じです。

pdfmake等いくつかライブラリは見たのですが、白紙ベースでPDF作る例しか見あたらなくて(テンプレートは画像背景で切り替え等)、直接PDFフォームを扱えるものは無いかなと。
2023/07/29(土) 00:54:23.66ID:s0ko+FdFa
プログラミング全く知らない状態からやっとJavaScript一通り学びました
かなり難しかったです。でもJavaScriptは比較的簡単な言語なんですよね?
ES6以降のJavaScriptでもやっぱり簡単なんですか?
それとES6で大規模アップデート合った時は絶望しましたか?
勉強していて苦しんだのがスコープ、this、反復処理の背景(iteratorの動き、yieldは何をしてるか)、非同期処理(Promise、then、async)、その他様々なメソッド、静的メソッド、、、
これら全てES6から導入されましたよね?絶望しませんでしたか?
例えば私がもしES5までのJavaScriptに慣れ親しんでいてES6のアップデートに触れたら絶対絶望してました。概要見ても「?????」となってたはずです
プログラミングに向いてる人はこんな大規模アップデートがあるとワクワクする人なのでしょうか?
絶望せず、「何ができるようになったんだろう!凄い!こんな事やあんな事が出来る!」みたいな人も居ましたか?
2023/07/29(土) 08:26:35.15ID:wB1gRUiQ0
ES5までは貧弱だったのでそりゃもう大歓喜よ。
それと現代のJavaScript(を使いこなすの)はもはや簡単な部類じゃないように思う。
2023/07/29(土) 09:45:27.72ID:ZQ+RMRi1r
苦しみとか絶望とか>>879は言語の習得を学校の勉強と同じようなものとしか捉えてないフシがある
日本史の勉強範囲が大政奉還までだと思ったら第二次大戦までだった!みたいな感覚

新しく覚えたことは実際のプログラミングで活かせるんだという意識が全く感じられない
2023/07/29(土) 14:21:53.16ID:LQ1ElLyya
>>880
>>881
とにかく理解するのに必死で苦しみました。jJavaScriptが簡単とは全く思いませんでした
2023/07/29(土) 14:27:58.50ID:LQ1ElLyya
try,catch,finally文の存在異議が分からなかったけど、今さっき急にasync/awaitのエラーハンドリングに向いてるのに気が付きました
つまりthen,catchのPromiseチェーンをより楽に書けるのに今さっき気が付きました。こんな感じで上手くいかないですね
2023/07/29(土) 15:03:53.70ID:wB1gRUiQ0
.then().catch()の方が綺麗に書けて(副作用的な意味で)好きだなぁ
2023/07/30(日) 02:24:04.00ID:oecUblNe0
>>879
言語として簡単かっていうとどうだろうね。
Webブラウザがあれば動かせる上にデバッグ環境まで付いてるから、誰でもすぐ始められるし、作ったものをどこででも動かしてもらえるという手軽さはあると思うけど。
2023/07/30(日) 14:24:24.68ID:av5XIWe10
自分はプロトタイプ型オブジェクト指向から入ったから気にならないけどクラス型でプログラム書いてた人は違和感凄いんだろうな

あとクロスブラウザ対応しなきゃいけなかった人達もJSはしんどかったんだろうなと想像
2023/08/04(金) 01:16:43.56ID:LzfYm8xL0
rd41 = "";
alert (rd41);
これで「rd41は未定義です」ってエラーは出ますか?

alert(rd41);
これだけだと「rd41は未定義です」ってエラーが出ますよね

実際のコードはalertでは無いのですが、rd41に無を代入して何も表示させたくないのです
rd41 = null;
だと、nullと表示されてしまいます
2023/08/04(金) 01:36:14.69ID:LzfYm8xL0
chatGPTに質問したら答えが返ってきた
https://i.imgur.com/5NbJI6w.jpg
2023/08/04(金) 09:00:08.06ID:2wk44tWe0
>>887
delete を調べてみるとどうだろう。
やりたいことによってはブロックスコープで足りるかも。
個人的にはブロックスコープを活用して、変数を小まめに狭い範囲に閉じ込める書き方をおすすめしたい。
2023/08/04(金) 09:14:51.09ID:TEvOuQNU0
>>887
ECMAScriptに「未定義」というエラーはない
Strict Modeで実行すれば、両コードともにReferenceErrorになるだろう
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Strict_mode
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/ReferenceError
2023/08/04(金) 09:37:58.66ID:EZ9l15Zsr
>>887
>rd41 = "";
>alert (rd41);
>これで「rd41は未定義です」ってエラーは出ますか?
なんで試してみないの?
2023/08/14(月) 23:07:53.97ID:QNJSoVjn0
時報みたいなのを作成中でそのhtmlのページさえ開いておけば
9時、12時、18時(プリセットとかは無く固定)に特定のwavサウンドファイルがaudioElement.play() で再生される用にしています
(タブが非アクティブだとなんか動かない時があったのでwindow.openで表示させてます)
chromeのポリシーみたいなのでユーザーが明示的なアクションをしないと音声の自動再生はされないみたいで
それの良い回避策ってありますか?
実用性考えると携帯のアラームが百倍使いやすいけど
自分用にチープなのを作って遊んでるんだけど解決策が思いつかなくて・・・
2023/08/15(火) 01:53:58.77ID:Efj8IW440
>>892
そういう質問はchatGTP得意や
聞いてみれば
894デフォルトの名無しさん (ワッチョイ 7e63-SF+K [153.218.139.115])
垢版 |
2023/08/21(月) 00:13:21.70ID:v7lFaH3H0
【環境】Windows 11, Chrome最新版
【何をしたのか】PHPで動的に出力されたテキストに replace (new RegExp)
【エラーメッセージ】コンソールには何も出ません
【期待する結果】ページ内に複数生成される動的クラス内テキストを置換したい
【サンプルコード】
<p class="tx-body">おはようございます*2023.08.15</p><span clas="tx-date">0000</span>
<p class="tx-body">ごきげんよう*2023.08.20</p><span clas="tx-date">0000</span>



tx-dateクラスの中身をtx-bodyの*以降の文字列に置き換えたく、以下を<body>の後半に書きましたが期待する置換変化が起きません、エラーも出ません、
根本的なところわかっていないのだと思うので恐縮ですがお手上げ状態です

window.addEventListener('load', function() {
const ItemList = document.getElementsByClassName("tx-body");
const ItemDate = document.getElementsByClassName("x-date");

for(i=0; i<ItemList.length; i++) {

var tBody = ItemList.item(i).textContent;
var tDate = ItemDate.item(i).textContent;
var replaceDate = tBody .split("*")[1];

tDate = tDate.replace(new RegExp(replaceDate,'g'),'');
}
})


以上ご指導よろしくおねがします
2023/08/21(月) 11:40:28.26ID:cB09UaOod
>>894
まずconsole.log()や開発者ツールを使って自分の書いたコードがどこまで想定通りに動いてるか確認してみよう
2023/08/21(月) 11:51:22.81ID:7Ts4WfMN0
>>894
コードを見る限り、置換を行うためのコードは一見正しく見えますが、複数の潜在的な問題が考えられます。まず、コード内のいくつかのポイントをチェックしてみましょう。

1. **クラス名のスペル**: `tx-date` クラスが正しく `x-date` クラスになっているか確認してください。

2. **期待する置換変化の確認**: 期待する置換変化がどのようなものか確認してみてください。コード内で `tDate` の内容を `console.log()` を使って出力し、実際の値が正しいか確認できます。

3. **変数 `replaceDate` の設定**: `tBody.split("*")[1]` の部分で、正しい位置に `*` が存在しているか確認してください。`split()` メソッドは対象の文字列を指定の文字で区切って配列にしますが、もし `*` が存在しない場合、期待通りの結果が得られない可能性があります。

4. **置換操作の適用**: `tDate` に対して行った置換操作が、実際のDOM要素に反映されていない可能性があります。`tDate` の内容を変更した後、対応するDOM要素の内容を更新するコードが不足しているようです。

これらのチェックポイントを確認した上で、コードを修正するか、デバッグすることをお勧めします。また、具体的なサンプルHTMLコードや置換の例を提供していただければ、より具体的なアドバイスを提供できるかもしれません。
2023/08/21(月) 12:25:10.86ID:cB09UaOod
このワッチョイ **4bは質問スレにchatGPTの回答貼るだけのボットみたいなもんだからスルー推奨
NG入れといてもいい
2023/08/22(火) 23:04:06.56ID:rPfWctd8a
2か所とも、clas="tx-date" になっている!

class でしょ
2023/08/22(火) 23:12:31.83ID:rPfWctd8a
>const ItemDate = document.getElementsByClassName("x-date");

x-date は、tx-date じゃないの?
2023/08/23(水) 00:10:28.94ID:B78POXf5a
一旦、要素 tDate_elem を取得しておいてから、
その textContent に値を設定する。
つまり更新

const tBody = ItemList.item(i).textContent;

const tDate_elem = ItemDate.item(i) // 要素
const tDate = tDate_elem.textContent;
console.log( tDate ); //=> 0000

const replaceDate = tBody.split("*")[1];
console.log( replaceDate ); //=> 2023.08.15

tDate_elem.textContent = replaceDate; // 設定

表示
おはようございます*2023.08.15
2023.08.15

ごきげんよう*2023.08.20
2023.08.20
2023/08/23(水) 10:39:07.30ID:oZ78uDd8d
>>900
それはもう質問に答えたというよりデバッグと修正を代行したのであってこのスレの主旨には合わない
おそらく他の人もそういう認識だからこの件に口を出さないんだと思うよ
2023/08/23(水) 19:53:27.23ID:ktllvUDta
jQuery なら、もっと簡単

$( function ( ) {

$('.tx-body').each(function (index, elem) {
const tx_body = $(elem);
console.log(index + ': ' + tx_body.text());
const replaceDate = tx_body.text().split("*")[1];
console.log(replaceDate);

// tx_body 要素の次の兄弟で、tx-date クラスがある要素。絞り込み
const tx_date = tx_body.next('.tx-date');
console.log(index + ': ' + tx_date.text());
console.log('tx_date.length: ' + tx_date.length); // 0 or 1

// 該当する要素があれば設定する。つまり更新
if (tx_date.length === 1) {
tx_date.text(replaceDate);
}
});

} );
903デフォルトの名無しさん (アウアウエー Sa22-NwC7 [111.239.174.98])
垢版 |
2023/08/25(金) 21:08:52.47ID:+90wXQAMa
chrome拡張どう作ったらいいのでしょう?
こんな感じではリダイレクトが連続してしまってだめでした
urlsのフィルターの仕方、もしくはリダイレクトをせずにそのURLにアクセスする方法が分かれば解決できるとは思うのですが・・・

//aaa.com/xxxx/ へのアクセスを aaa.com/abc/xxx/ へ変換したい (以下は動作しない)
chrome.webRequest.onBeforeRequest.addListener(
function(details)
{
if (details.url.match(/abc/))
{
return {}; //←ここを書き換える方法が分かればいける
}
else
{
details.url = details.url.replace(/aaa.com/g,"aaa.com/abc");
return {redirectUrl: details.url };
}
},
{
urls: [ "*://aaa.com/*/" ], //←ここを書き換える方法が分かればいける
},
["blocking"]
);
2023/08/26(土) 04:11:22.52ID:wsJDYSi/a
「chrome.webRequest.onBeforeRequest」で検索!

webRequest
https://developer.mozilla.org/ja/docs/Mozilla/Add-ons/WebExtensions/API/webRequest
2023/08/26(土) 12:48:58.33ID:mvAl1l0Ba
そこ見てどうすればいいのか分からないからここに来た・・・
2023/08/26(土) 17:41:19.65ID:/LQp1jGld
return detail.documentUrl

とか?
2023/08/26(土) 18:56:03.08ID:mvAl1l0Ba
return detail.documentUrl;
return {redirectUrl: detail.documentUrl};
どちらもダメ。リダイレクトのURLを返すことになるから、リダイレクトの無限ループに入っちゃう

それなら、リダイレクト止めればいいじゃんって思うんだけど
return {cancel: true};
のようにするとナビゲーション自体が止まってアクセスできなくなっちゃう
2023/08/26(土) 19:46:44.48ID:HE/rWC1F0
空のオブジェクト返せばいいんじゃないの?

こんなの見て参考にしては?
https://gitlab.com/ClearURLs/ClearUrls/-/blob/master/clearurls.js?ref_type=heads
2023/08/26(土) 21:15:33.19ID:AeqeuiS+0
無限ループしてるって事は条件分岐失敗してるんじゃないの?
console.logデバッグでもしてみたら?
2023/08/27(日) 12:33:38.16ID:QiCv/PxZr
>>903
リダイレクト後のurlに?foo=barとかクエリ文字列付けてみるとかは?
これでフィルタにかからなくなるみたい
もちろんこれでサーバが誤動作起こさないのが前提だけど
911デフォルトの名無しさん (ワッチョイ cf63-n242 [153.218.137.10])
垢版 |
2023/09/03(日) 21:37:03.60ID:0BSqvC2P0
サイト内にフォームが設置してあるページが複数あります
お問い合わせ、新規登録、ログイン、パスワードリマインド、などです
一時的に inputタグを入力不可にしたのですが
querySelectorAll("input,button").forEach( e => e.disabled = true );

複数あるページのうちお問合せだけは入力できるように、
現在は下記の効率の悪い記述になっています、、
document.querySelectorAll("#contact input, #contact button").forEach( e => e.disabled = false);

それぞれのページの<body>に idを付与していてそれで判別しているのですが
<body id="contact">
<body id="login">
<body id="remainder">

もっとスマートにお問い合わせページだけ入力できる
ヒントをお願いできませんでしょうか?
2023/09/03(日) 21:48:21.38ID:qR1Ry2o90
【環境】windows10 chrome 最新版
【何をしたのか】開発ツールコンソール上でサンプルコードを実行すると
条件文が undefined にもかかわらず if 文内 console.log(1) が実行される
【エラーメッセージ】なし
【期待する結果】 なぜこうなるのか理由が知りたいです
【サンプルコード】
console.log(localStorage && (localStorage.getItem('deck')));
if(localStorage && (localStorage.getItem('deck'))) console.log(1)
if(undefined) console.log(2)
2023/09/03(日) 23:01:09.12ID:zsKKxMoe0
>>912
console.log(localStorage && (localStorage.getItem('deck')));
の結果は本当にundefined?、undefinedの上の行に何か表示されてるよね?
2023/09/03(日) 23:17:01.93ID:II4MkDPZM
>>911
下記セレクタでイケるはず(問い合わせページ以外でinput要素とbutton要素を抽出)

body:not(#contact) :is(input, button)
2023/09/03(日) 23:33:36.04ID:II4MkDPZM
>>912
下記のログ出力はどうなる?

console.log(localStorage.getItem('deck') !== undefined ? 'バカめ!!よく確認しろ!!' : 'undefined です');
2023/09/04(月) 13:53:40.48ID:R0PWdUab0
>>913
コンソール出力結果は

undefined
1
undefined

です

>>915
バカめ!!よく確認しろ!!
undefined

になります
2023/09/04(月) 14:44:17.50ID:0gdMzEOZM
getItemは該当キーに対する値がなければundefinedではなくnullを返すのでlocalStorageが存在していれば

console.log(localStorage && (localStorage.getItem('deck')));は
null
undefined
と出力される

undefinedの上が空行になってるならdeckに対する値が入ってる
それが空文字ならfalsyなのでconsole.log(1)は実行されない
truthyな不可視文字(例えば改行コード)が入っていればconsole.log(1)も実行される
inspectやencodeURIで中身に何が入ってるか確かめればはっきりさる
2023/09/04(月) 14:45:10.48ID:I1Zu7zQTM
はっきりさる!
2023/09/04(月) 15:37:52.51ID:R0PWdUab0
あー わかりました
"undefined" っていう文字列がすでに入っちゃってたみたいです

丁寧に回答いただいてありがとうございました!
2023/09/04(月) 15:59:10.40ID:KQbfSHx50
ウキキ🐒
input セレクタで解決しましたカッコイイ記述ありがとうございます
2023/09/05(火) 12:01:10.43ID:y2XoXHZcr
>【何をしたのか】開発ツールコンソール上でサンプルコードを実行すると
>条件文が undefined にもかかわらず if 文内 console.log(1) が実行される
不可解な挙動に遭遇したとき、自分が何か勘違いしてないかまずそこを疑ってみようという教訓
あとtruthyやfalsyな値の取り扱いは慎重に
2023/09/28(木) 14:42:04.81ID:Pzc86hhG0
ほんまに、助かったで!
2023/10/04(水) 23:59:59.93ID:77DZdeZo0
if(rd41.value){
dofn()
}

これが正しく実行されないのですが(暴走するというか、意味不明な実行結果が現れます)、if文の中で関数の呼び出しは出来ないのでしょうか?
もしそうなら、このコードを正しく動作するように書き換えることは出来ますか?
2023/10/05(木) 02:54:19.96ID:pCa3KI6i0
普通に動作しました
すみません
2023/10/16(月) 00:30:39.82ID:tJl0Ngd50
質問です
下記のURLは音楽サイトJangoの再生ページURLです

 https://www.jango.com/stations/400536192/tunein
 https://www.jango.com/stations/397649609/tunein
 https://www.jango.com/stations/272072365/tunein

これらのページをブラウザで開いた時に出てくる水色のメッセージ
パネルをJavaScriptで閉じる方法を教えてください

Jango plays unlimited music for free and with no commercials.

というメッセージの右隣にある[×]マークをクリックしたいのですが

document.getElementsByClassName("MuiAlert-action")[0].click()

では上手くクリックすることができませんでした
2023/10/16(月) 00:54:14.00ID:SqBXoLFp0
document.querySelectorAll(“.MuiDialog-container,.MuiBackdrop-root”).forEach(e => e.remove())
2023/10/16(月) 08:33:51.49ID:tJl0Ngd50
>>926
早速ありがとうございます
ただ、注意深くコピペして実行させたのですが
残念ながらメッセージパネルは閉じられませんでした
2023/10/16(月) 09:38:31.66ID:9MW6cr+O0
document.querySelector(".MuiSnackbar-anchorOriginTopCenter").remove()
2023/10/16(月) 10:55:49.91ID:tJl0Ngd50
>>928
すいません、それもダメみたいです
2023/10/16(月) 11:01:33.63ID:tJl0Ngd50
ブラウザ上の全然関係ない場所をクリックして自己解決しました

document.elementFromPoint(1, 1).click()

根本的な問題から逃げたようで悔しいですけどw
2023/10/24(火) 20:00:13.55ID:xAzUmtPF0
>>925
誰一人解決できなかったのか?
すまん、俺もわからんw
2023/10/25(水) 13:36:08.76ID:JRNrMb5/0
名前付き引数としてプロパティをもつオブジェクトを引数にする場合のJSDocの書き方ってどう書くのが正しいのでしょうか?
ネットで調べて以下の画像のように書くと、VSCodeで関数の説明で表示される時にプロパティ側の日本後説明部分が表示されません。
http://imgur.com/xhSQcMc.png

構文のほうには型は反映されてるので読み込めてはいるようなのですが…
2023/10/26(木) 10:06:04.96ID:QIG+kzYs0
source = ['いぬ=ドッグ', 'ぬこ=猫咪', 'キャット=にゃんこ', 'ねこ=キャット', 'わんこ=小狗', '老鼠=ねずみ', '小狗=ドッグ', 'マウス=ねずみ', '猫咪=キャット']
これを
result = [['いぬ', 'ドッグ', 'わんこ', '小狗'],
['ぬこ', '猫咪', 'キャット', 'にゃんこ', 'ねこ'],
['老鼠', 'ねずみ', 'マウス']]
これに集計するにはどうしたらいいですか
2023/10/26(木) 12:52:26.88ID:jSMDhhI40
>>933
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce
2023/10/26(木) 12:52:36.47ID:jSMDhhI40
>>933
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/reduce
936デフォルトの名無しさん (ワッチョイ a710-7pXc [180.12.82.129])
垢版 |
2023/10/26(木) 13:05:50.11ID:m2KCtDyt0
canvasでarc関数でx:100,y:100の位置に青で塗りつぶした半径3の円を描いたんですが
これと同じ位置に同じ半径で同じ色で塗りつぶした円を描くと四角形ぽくなってちょっと大きくなって表示されます。
背景を塗りつぶして1回目に描いた円を一度消去してから2回目の円を描いても同じでした。
文字の場合でも同じ位置に同じ文字を重ね書きすると太くなっちゃいました。
どうすればちゃんと同じ位置に同じ物を描いても太くならないようにできますか?
2023/10/26(木) 22:17:18.42ID:npbiXWKI0
>>933
それは質問ではなくて丸投げと言います
2023/10/27(金) 08:04:19.82ID:93zv19AS0
>>933
競技プログラミングのスレで聞いて!

これは、UnionFind で、3つの木になる

UnionFind は、プログラミング・コンテスト・チャレンジブック(蟻本)に載っている
939デフォルトの名無しさん (ワッチョイ 639d-XI6K [109.236.1.125])
垢版 |
2023/11/13(月) 18:52:10.34ID:qEXCkkFf0
alertのテキストをコピペする方法とかってご存知ありませんか?

どなたか知恵をお貸しください
2023/11/13(月) 22:10:22.42ID:FIfUHr+c0
質問したいなら詳しく書こうね
2023/11/14(火) 02:43:20.79ID:MYkZh+2q0
>>939
alertのテキストをコピーするには、通常はウェブページ上でalertが表示されている状態で、テキストを選択して右クリックし、"Copy"や"コピー"を選択する方法があります。ただし、ウェブサイトのalertはJavaScriptで生成されるもので、そのテキストを直接コピーする方法は制限されていることがあります。可能であれば、そのテキストを手入力でコピーすることができます。
2023/11/14(火) 19:07:48.92ID:WEqhXBJy0
検索すれば?
コピーを防ぐ方法は、幾つかある

ブラウザのF12 ボタンの開発者ツールで調べるとか
2023/11/14(火) 20:45:30.47ID:Mc/CoQSw0
>>939
マルチボスト先に答えがある
https://mevius.5ch.net/test/read.cgi/hp/1478002550/706-
2023/11/15(水) 11:30:55.95ID:FHoogchzH
>>936

亀だけど
fill()が複数回呼ばれると円が太るみたい
ctx.arc(100, 100, 3, 0, Math.PI * 2);
ctx.fill();
ctx.arc(100, 100, 3, 0, Math.PI * 2);
ctx.fill();
でなく、
ctx.arc(100, 100, 3, 0, Math.PI * 2);
ctx.arc(100, 100, 3, 0, Math.PI * 2);
ctx.fill();
でやると円が太らなかったよ
945デフォルトの名無しさん (ワッチョイ e374-n7Dx [211.124.81.22])
垢版 |
2023/11/15(水) 12:39:52.38ID:D0hDoGTF0
亀が2chに書き込みにやってきた
レス数が900を超えています。1000を超えると表示できなくなるよ。
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。