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

JavaScript の質問用スレッド vol.126 at TECH

174:デフォルトの名無しさん
24/03/05 18:47:33.98 qENbjC0BM.net
>>173
個別のtab.windowIdから引けるハズ
もっとも、はじめからwindow.getAll()を使った方がいいとは思うが

175:デフォルトの名無しさん (ﾜｯﾁｮｲ 9f02-ZLJX [27.91.124.53])
24/03/06 10:35:08.32 c6agTDKp0.net
>>174
お、できた！
ありがとう！

ネットでtabs.WindowTypeってのが載ってたので、それで惑わされてた…

176:デフォルトの名無しさん (ﾜｯﾁｮｲ 9f02-ZLJX [27.91.124.53])
24/03/06 10:42:44.31 c6agTDKp0.net
>>174
取得した各tabに対して取得したかったので、
chrome.windows.get()を使いました。

177:デフォルトの名無しさん
24/03/29 14:50:19.65 yy1PP2Jg0.net
非同期処理を同期処理から呼び出すラップ関数を作りたいのですが方法がわかりません
AIに聞いたら次のコードが返ってきましたが、当然awaitが使えないので失敗します
-------------------------------
//非asyncな呼び出し元から、asyncメソッドを呼び出し、結果が帰るまで待って返却する
function FromSyncToAsync() {
const result = await [値を返すだけの非同期な関数]();
return result
}
-------------------------------
調べても呼び出し元をasyncにする方法しかみつかりません…

178:デフォルトの名無しさん
24/03/29 15:40:17.46 yy1PP2Jg0.net
これはエラーはおきないけど失敗。戻り値がpendingになりました
-------------------------------
function SyncToCallAsync(){
return getWasmFileLastModified().then((result) => {
// 結果を返却
return result;
});
}
-------------------------------

179:デフォルトの名無しさん (ﾜｯﾁｮｲ 5f85-qPgS [240b:12:203:6300:* [上級国民]])
24/03/29 16:32:26.02 utPNPoKt0.net
>>177
残念ながら不可能
一度非同期の世界に入ると
同期処理の世界には戻って来られないぞ

・非同期処理から値を受け取る箇所はPromise値を返す関数にする
・前処理や後処理を含めて色々やってくれる関数をasync関数で定義する
・極力此処の関数やクラスメソッドは小さくして、関係ない値を持たせない事で全てをasync関数にする事を防ぐ

JavaScriptという言語がイベント駆動やイベントループ前提で作られてる以上
こういう作りを維持し続けるしかない

まぁ、ロジックを司るデカい所は基本async関数だよ
作り直す許可を上長や顧客からもぎ取るのが仕事やね

そういう交渉が出来ないなら細かくPromise.thenで作業していくしかない

180:デフォルトの名無しさん (ﾜｯﾁｮｲ 5fad-VtrB [124.141.209.120])
24/03/29 16:55:52.54 yy1PP2Jg0.net
ありがとうございます。いくつかのAIに聞いても堂々と回答実現不能なコードばかり返してくるので困っていました。できないとわかったほうが先に進めます

181:デフォルトの名無しさん (ﾜｯﾁｮｲ df68-csuD [2400:2200:454:574d:*])
24/03/29 17:39:27.22 D+b6Pa3z0.net
現時点ではAIは不可能なことを不可能と答えないケースが多い
信用しすぎないように

182:デフォルトの名無しさん
24/04/05 21:57:54.50 otPTbv2G0.net
test

183:デフォルトの名無しさん
24/04/05 21:58:17.84 J45N4zHg0.net
test

184:デフォルトの名無しさん
24/04/13 22:59:37.70 3VlMmSMB0.net
すいません、Reactの質問ってここでいいですか？

185:デフォルトの名無しさん
24/04/13 23:23:14.15 i7geu5sV0.net
まずスレ一覧をReactで検索するぐらいしてみたら？

186:デフォルトの名無しさん
24/04/20 13:04:04.45 /vy8T+9K0.net
昔、私が大学でプログラミングを習ったとき（C言語でした）には円周率など特別な値については定数にしろと言われはしましたが、その他の変数については定数にしろとは言われませんでした。
Javascriptの本を今読んでいるのですが、再代入を行わない場合にはすべて「let」ではなく「const」を使えと書いてあります。
このようなことが言われるようになったのはいつ頃からでしょうか？
私がそう習わなかっただけで、昔から言われていたことでしょうか？

187:デフォルトの名無しさん
24/04/20 14:12:14.37 7dIwEOD00.net
>>186
JavaScriptはCromeやFirefox等のブラウザ作ってる所が各自で動作するエンジン作れと丸投げしてるが
仕様書にあたるECMAScriptが長い間ES5というバージョンのまま止まってた
その頃には変数宣言はvarのみだった
流石に今時のプログラミング言語にしようぜって事でECMAScriptの強化が始まり(ES6というプロジェクト)
最終的に2015年からは毎年強化した仕様を出しましょうという話になった
その最初の成果物とも言えるES2015で変数宣言としてvarの他にletとconstの2つが追加
for (var i = 0; i < 5; i++) {
setTimeout(() => console.log(i))
}
これの出力結果が4が5個連続で表示される
違和感があるが、
letのブロックスコープによって解消されてるのでvarはもう二度と使うなという風潮が出来た
(それ以外にもvarは関数の先頭で纏めて書かないと変な動きする箇所がちらほら見受けられ、コーディング規約で制限されていた)
また値がコロコロ変わる状態変数が多いと
登場人物がやたら多い粗悪な小説みたいになって作業者が困るので
「再代入禁止の変数」を求める声が元々多かった
その要望を汲んだ再代入禁止のconstも実装されたため
必要になるまで全てconstでプログラミングして、必要な箇所だけ最小限にletを使いましょうという風潮が比較的早く出来た

188:デフォルトの名無しさん
24/04/20 14:22:49.70 7dIwEOD00.net
constは直訳すれば定数だが
JSのconstは再代入しちゃいけませんよってだけで
基本は普通の変数として取り扱う
配列やオブジェクト、関数、インスタンスなんかもconstで宣言出来るね
他言語のletみたいなものと考えると良い
constで宣言したオブジェクトや配列は再代入禁止なだけで、中身は普通に加工出来てしまうのも作りとして良くない
const arr = [1, 2, 3];
arr.push(4);
console.log(arr);
// [1, 2, 3, 4]
この辺は勝手に加工しないよう運用でカバーやね
値は基本的に複製しまくってガベージコレクションで掃除してもらう
パフォーマンスチューニングで仕方なく一つの値を加工しまくる時はライブラリ化したり関数で固めたりして、メインロジックの邪魔にならないようにすること

189:デフォルトの名無しさん
24/04/20 14:53:24.59 /vy8T+9K0.net
>>187-188
ありがとうございました。

190:デフォルトの名無しさん
24/04/20 21:40:49.05 KOUUOZ8l0.net
すみません。
以前からJSフレーム・ワークについて
疑問を持っていたのですが
フレーム・ワークを使う人は、
1. JavaScriptに精通しているので
中規模程度のサイトなら
素のJavaScriptと_lodash等だけでも組めるが
効率が悪いのでフレーム・ワークを
その内部構造をも理解して使っている。
2. JavaScriptの基本的な仕組みと
DOM操作の基本は理解しているが
素のJavaScriptではサイトを作れないので
フレーム・ワークの仕様仕組みを理解して使っている。
の2種類に大別できると思うのですが
結局ブラウザは素のJavaScriptで動いているだけなので
「1」の技能習得に向かわざるを得ないと思うのですが
いかがでしょうか。

191:デフォルトの名無しさん (ﾜｯﾁｮｲ 6b55-Olxi [2400:2200:6b3:858d:*])
24/04/20 22:07:39.36 xlVv2mR90.net
どこから突っ込んでいいのかわからなくて答えようがない

192:デフォルトの名無しさん (ﾜｯﾁｮｲ d1f1-4mIM [240b:12:203:6300:* [上級国民]])
24/04/20 22:27:55.19 7dIwEOD00.net
>>190
lodashは関数型プログラミング的な値の加工を司るフレームワークだぞ
一部だけ利用させて頂いて関数片の集合体ライブラリとして使うことも出来るがな

フレームワークは機能を提供するライブラリであると共に
大きなプロダクトを作っていく為のファイル・関数・モジュール置き場をルールで区切ってここに設置してくださいねー
こういう司書さんみたいな役割も担ってる

複数人でプロダクトを触ったり
半年後にどれどれ？と帰ってきて読み直した時にナニコレ？にならない為に
プログラミングスキルの良し悪しに限らず
適切なフレームワークがあるなら使った方が良い

フレームワークを使わん機能を作る時でも
関数やファイルを作って保管するタイミングで「このフレームワークの考え方は好きだな、同じディレクトリ名を作ってそこに保管しよう」
自然とこういう発想が生まれる

なのでフレームワークを使い分けてる人間は引き出しが多くなっていき
可読性の良いプロダクトを作る能力も養われる

結局フレームワーク無しで適当に関数やファイルを作って放り投げるばかりで
読み辛いプロダクト作ってる奴なんて3流の雑魚だよ

193:デフォルトの名無しさん (ﾜｯﾁｮｲ d721-K5o/ [121.2.134.225])
24/04/21 00:20:10.62 R6fhRdj50.net
>>191 >>192
ありがとうございます。

ご教示参考にさせて頂き
精進いたします。

194:デフォルトの名無しさん
24/04/21 02:22:30.51 9CBVBBl20.net
>>186
サイの表紙のサイ本。
初めてのJavaScript 第3版 ―ES2015以降の最新ウェブ開発、オライリー、2017
ECMA Script は、ES6(ES2015)で大きな改正があった。
var を非推奨にして、let/const を使う
オブジェクトの場合は、たいていconst を使う。
代入はできないが、オブジェクトの中身は更新できるから
const a = { x: 1 }
a.y = 'あ'
a //=> { x: 1, y: 'あ' }
a = 2 //=> エラー。再代入はできない！