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

■ このスレッドは過去ログ倉庫に格納されています
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
2022/11/28(月) 11:12:07.95ID:Dg1YyOhE0
>>285
ありがとうございます。
やってみます。
287デフォルトの名無しさん (ワッチョイ 194e-WfGi [210.138.216.243])
垢版 |
2022/11/28(月) 11:50:30.77ID:u/1oLUrZ0
/^[\-\+]\d+$/.test(DSP)
のほうが返り値がtrue/falseだからifの条件の用途ではより適切だと思う
2022/11/28(月) 11:58:03.03ID:Dg1YyOhE0
>>287
これをそのまま
if(~)return false;の~の部分に入れたのでいいのですか?
289デフォルトの名無しさん (ワッチョイ 194e-WfGi [210.138.216.243])
垢版 |
2022/11/28(月) 13:15:50.86ID:u/1oLUrZ0
>>288
>>285 も言ってるけど、!付けてな
2022/11/28(月) 14:05:28.49ID:Dg1YyOhE0
>>289
ありがとうございます。
2022/11/28(月) 16:27:54.36ID:HJ3Js2uA0
const checkNumberString = inputString => {

const inputAry = [...inputString]; // 文字列を配列にする

const [ firstChar, ...restAry ] = inputAry; // 1文字目と2文字目以降に分ける

if ( restAry.length === 0 ) { return false }; // 1文字しかない場合
// 1文字目が、+/- ではない場合
if ( !( firstChar === "+" || firstChar === "-" ) ) { return false };

// 2文字目以降のすべてが、数字かどうか
const res = restAry.every( ( char ) => {
const cp = char.codePointAt(0);
return ( 48 <= cp && cp <= 57 ); // 0〜9
} );

return res
}

const testAry = ['', '+', '-0', '+019', '-9🌕には𩸽'];
const results = testAry.map( (str) => checkNumberString(str) );

console.log( results );
//=> [ false, false, true, true, false ]
2022/11/28(月) 16:54:53.78ID:6qlTLJdd0
>>291
ということを十数文字の文字列で表せる正規表現というのは本当に便利だな
2022/11/28(月) 19:15:12.40ID:Dg1YyOhE0
>>291
すごいですね
普通に書くとこれだけ必要なのか…
2022/11/28(月) 19:27:13.32ID:HJ3Js2uA0
Ruby なら、もっと簡単に書ける

def checkNumberString ( inputString )

inputAry = inputString.chars # 文字列を配列にする
return false if inputAry.length < 2 # 2文字未満

firstChar = inputAry.shift # 1文字目を取り除く

case firstChar
when "+", "-" # 処理なし
else
return false # 1文字目が、+/- ではない場合
end

# 2文字目以降のすべてが、数字かどうか
zeroToNine = ( '0'..'9' )
res = inputAry.all? { |char| zeroToNine.include?( char ) }

return res
end

testAry = %W(#{} + -0 +019 🌕には𩸽 -9🌕には𩸽)
#=> ["", "+", "-0", "+019", "🌕には𩸽", "-9🌕には𩸽"]

p results = testAry.map{ |str| checkNumberString( str ) };
#=> [false, false, true, true, false, false]
2022/11/28(月) 20:48:23.47ID:zNlSyUlFr
いよいよ正体現したか
都合の悪いツッコミは無視して頼まれてもいないのにRubyの押し売り

>>293
そんなわけで以降こいつはスルーで
2022/12/04(日) 21:34:23.67ID:IHBBP8JW0
条件A、B、Cがあってどれか1つがtrueの場合だけ動作させたいのですが、動作させない場合returnするif文はどう書けば一番シンプルなんでしょうか?

A…true、B…false、C…false
A…false、B…true、C…false
A…false、B…fslse、C…ture
の3つの場合だけ動作させます

それ以外をreturnさせるif文です
2022/12/04(日) 21:49:59.33ID:IHBBP8JW0
動作させたい3つの場合、それぞれ違う関数にジャンプさせて違う処理をさせたいです。
switch文の方が良いのでしょうか?
それでどれにも当てはまらない場合、defaultでreturnとすれば
2022/12/04(日) 21:52:00.92ID:XpkKNYo50
>>296
複数 true は return ってこと?
2022/12/04(日) 21:58:26.26ID:kEkO75NR0
if(!(A or B or C))return 0;
2022/12/04(日) 21:59:32.16ID:XpkKNYo50
X = (A ? 1 : 0) + (B ? 1 : 0) + (C ? 1 : 0);
if (X != 1) return;
if (A) funcA()
else if (B) funcB()
else funcC();
2022/12/04(日) 22:00:38.95ID:S/+N28Tr0
switch((A ? 1 : 0) | (B ? 2 : 0) | (C ? 4 : 0)){
case 1:
// Aの処理
break;
case 2:
// Bの処理
break;
case 4:
// Cの処理
break;
default:
return;
}
2022/12/04(日) 22:13:43.95ID:VmtlSQvx0
if (a + b + c != 1) return
2022/12/04(日) 22:16:21.90ID:kEkO75NR0
flag=true;
if(A and flag)[a();flag=false;]
elseif(B and flag)[b();flag=false;]
elseif(C and flag)[c();flag=false;]
elseif(!(A or B or C) and flag)[return 0;]
else[error();]
2022/12/04(日) 22:21:13.15ID:XVXofR3d0
>>296
「一番シンプル」と思い描いている条件をもう一段ブレイクダウンするとどうだ?
コードが短いのがいいのかわかりやすいのがいいのかはたまた直行性が高くて
条件の追加やメンテが楽なのがいいとか。
2022/12/04(日) 22:24:22.10ID:ppAq3P870
難しいよね
昔はコードを短く、処理負荷を軽くするのかウィザードと呼ばれたけど
今は他人にも自分にも分かりやすく、整備性があるのかとかも大事
2022/12/04(日) 22:28:43.81ID:qWdYVkpM0
a=true ; b=false ; c= false;

([a,b,c].reduce((s,e) => s+e, 0)!=1)
2022/12/04(日) 22:29:04.47ID:IHBBP8JW0
>>304
それではわかりやすいのでお願いします
2022/12/04(日) 22:29:51.99ID:IHBBP8JW0
>>299
これだったら1行ですか
2022/12/04(日) 22:31:41.03ID:IHBBP8JW0
>>302
これが単純でわかりやすいかな?
2022/12/04(日) 22:33:49.28ID:kEkO75NR0
>>308
一行で書きましたが、それぞれの処理が
できない書き方になりますね
2022/12/04(日) 22:34:59.34ID:IHBBP8JW0
>>301
これにしようかな?
(A ? 1 : 0) | (B ? 2 : 0) | (C ? 4 : 0)の部分の意味を教えてください
2022/12/04(日) 22:48:27.13ID:qWdYVkpM0
([false,false,false].filter(e=>e)).length→
0
([false,false,true].filter(e=>e)).length
→1

([false,true,true].filter(e=>e)).length
→2

([true,true,true].filter(e=>e)).length
→3
2022/12/04(日) 22:59:38.08ID:S/+N28Tr0
>>311
A ? 1 : 0 は三項演算子、A が真なら 1に、偽なら 0 になる?
| はビット毎の or

A, B, C ⇒ (A ? 1 : 0) | (B ? 2 : 0) | (C ? 4 : 0)
---
F, F, F ⇒ 0
T, F, F ⇒ 1 // Aのみ
F, T, F ⇒ 2 // Bのみ
T, T, F ⇒ 3
F, F, T ⇒ 4 // Cのみ
T, F, T ⇒ 5
F, T, T ⇒ 6
T, T, T ⇒ 7
2022/12/04(日) 23:14:59.45ID:BaLaE0zJ0
こんな所で質問するくらいなら、if文3行書けば良いだけなんだし
自分で考えてない事を後から見ても分からないのだから無意味なんだよね
315デフォルトの名無しさん (ワッチョイ e310-tiU7 [180.12.82.129])
垢版 |
2022/12/04(日) 23:40:58.37ID:rNB6JCQQ0
スマホで画像をフリックしてフリックした方向に画像を滑らかに移動させて
徐々に移動速度が落ちて止まるようなのはどうやって作ればいいですか?
2022/12/05(月) 02:12:30.53ID:skXK9jGq0
>>313
ありがとうございます
なかなか難しいですね
2022/12/05(月) 12:51:22.46ID:2GYg1OhQ0
3つの条件の組合せ爆発が起こる、2 ^ 3 = 8 通りだから、かなり難しい

普通は、条件の組合せ爆発は起こらない

例えば、1〜10 の内のどれか1つを選択する場合など。
もし、1を選んだら、2〜10は選ばれない。
排他条件になるので単純

君の条件は排他条件ではないので、
すべての組合せ爆発が起こるので、かなり難しい
2022/12/05(月) 13:04:08.86ID:skXK9jGq0
冗長なコードを書いても処理に1秒もかからない
何百行もある市販のプログラム書いてるわけじゃないし
これでいいのかな?
2022/12/05(月) 13:28:02.61ID:a4wHahQZ0
組み合わせ爆発言いたいだけだろ。
組み合わせ数自体は多くなるけど、組み合わせる操作そのものは組み合わせる数に単純比例。
3入力なら3回の組み合わせ操作で8通りの結果が得られ、今回のケースならその組み合わせのうち3種に反応するだけのこと。
100入力なら100回の組み合わせ操作で1.27x10^30通りの結果が得られ、その中の100種に反応するだけのこと。
2022/12/05(月) 13:31:45.80ID:m5vf/Aut0
既に幾つも正解や技法が出てるしな
2022/12/05(月) 15:12:43.50ID:FypkNfQF0
大袈裟に語るバカが現れてワロタw
2022/12/05(月) 20:09:24.63ID:iMOo3onG0
>>315
自作でやるならtouchmoveイベントかなあ
でもライブラリを探して使う方がはるかに簡単
フリック ライブラリ とかで検索して好きなの使えばいいと思う
2022/12/05(月) 20:58:33.57ID:SWJP59wv0
んでいろんなライブラリを寄せ集めてページサイズが JS だけで MB単位になるのね
324デフォルトの名無しさん (ワッチョイ a797-g9pY [121.94.16.107])
垢版 |
2022/12/05(月) 22:13:18.07ID:lIq+TvzU0
すいません。
各<button>要素のkeyクラスに対して、背景色をつけたい。

[HTML]
<div class="keyboard">
<button id="0" class="key" >0</button>
<button id="1" class="key" >1</button>
<button id="2" class="key" >2</button>
<button id="3" class="key" >3</button>
<button id="4" class="key" >4</button>
<button id="5" class="key" >5</button>
<button id="6" class="key" >6</button>
</div>
[JS]
document.getElementsByClassName("key").style.backgroundColor = 'skyblue';

これでエラーがでるのだが。何が勘違いしていますでしょうか?
2022/12/05(月) 22:30:17.43ID:iMOo3onG0
>>324
document.getElementsByClassName("key")
で返ってくるのは要素の配列(正確には配列風のオブジェクト)
なのでforで回すなりして各要素ごとにスタイルつける
326デフォルトの名無しさん (ワッチョイ a797-g9pY [121.94.16.107])
垢版 |
2022/12/05(月) 22:50:02.60ID:lIq+TvzU0
ありがとうございます。
327デフォルトの名無しさん (ワッチョイ e310-RX5i [180.12.82.129])
垢版 |
2022/12/05(月) 23:08:28.56ID:NngXbYA40
>>322
ありがとうございます
2022/12/06(火) 16:54:34.87ID:iDVaiUL+0
最近あんまclassNameで操作しない感じ
querySelector系使ってない?
2022/12/06(火) 18:14:47.26ID:xVTCRvFV0
【俺】
おいChatGPT、外部ソースを使わずにJSで音を鳴らすコードを教えろ
ネコの鳴き声で、可愛らしくニャーオと鳴くような感じで4649

【ChatGPT】
JavaScriptから、可愛らしく、ニャーオと鳴くようなネコの鳴き声を再生するには、AudioContextを使用することで実現できます。例えば、次のようなコードで、より可愛らしいネコの鳴き声を再生することができます。

// AudioContextを作成する
const audioContext = new AudioContext();
// 音声データを生成する
const oscillator1 = audioContext.createOscillator();
oscillator1.type = 'sawtooth';
oscillator1.frequency.value = 220;
oscillator1.start();
const oscillator2 = audioContext.createOscillator();
oscillator2.type = 'sawtooth';
oscillator2.frequency.value = 440;
oscillator2.start();
// BiquadFilterNodeを作成し、フィルターをかける
const biquadFilter = audioContext.createBiquadFilter();
biquadFilter.type = 'highpass';
biquadFilter.frequency.value = 1000;
oscillator1.connect(biquadFilter);
oscillator2.connect(biquadFilter);
// 出力に接続する
biquadFilter.connect(audioContext.destination);

上記のコードでは、createOscillatorメソッドを使用して、2つの鋸波のオシレーターを作成します。そして、2つのオシレーターを同時に再生することで、可愛らしいネコの鳴き声を再生することができます。

【俺】
ほうほう、試してみるか。。。。。。→耳死亡
やっぱりゴミやなこのAI、このスレの人間の方がまだマシや
330デフォルトの名無しさん (ワッチョイ bb55-RX5i [122.20.171.29])
垢版 |
2022/12/06(火) 18:29:38.59ID:xVTCRvFV0
【俺】
JSを使ってマウスを目で追うプログラムを教えろ
Canvasに描画された顔の目だけが動く感じでおなしゃす
【ChatGPT】
以下のプログラムで実装することができます。
→ https://jsfiddle.net/re9dwL85/
【俺】
試したら、目が顔から飛び出した、おかしくない?
【ChatGPT】
そうですね。上記のプログラムはサンプルコードであり、実際のアプリケーションではもっと完成度の高いものが必要です。
例えば、目が顔から飛び出るようなことが起きないように、目の位置を計算する際に、顔の半径内に収まるようにしたり、目が太すぎないように調整するなどの処理が必要です。
また、顔の描画や目の描画には、更に細かな調整が必要です。例えば、顔には鼻や口も描画する必要があり、目の描画には目の瞼やまぶたも描画する必要があります。
そのため、上記のプログラムを単独で使用する場合は、更に修正が必要です。実際のアプリケーションでは、より詳細な調整や描画処理が必要です。
【俺】
はあ、で、そのコードは?
【ChatGPT】
上記のような問題を解決するためには、次のようなJavaScriptのプログラムを書くことができます。
→ https://jsfiddle.net/cy1eoa65/
【俺】
まあまあやな。機械にしちゃようやっとるかもな
2022/12/06(火) 18:36:58.90ID:xVTCRvFV0
>>324 をそのままChatGPTに投げてみた

`getElementsByClassName()`は、要素の配列(HTMLCollection)を返すメソッドです。
そのため、`getElementsByClassName()`に対してスタイルを設定することはできません。
そのため、エラーが発生していると思われます。

代わりに、以下のように各要素に対して個別にスタイルを設定する必要があります。

const keys = document.getElementsByClassName("key");
for (let i = 0; i < keys.length; i++) {
keys[i].style.backgroundColor = 'skyblue';
}

また、代わりにquerySelectorAll()を使用することもできます。
このメソッドは、CSSセレクター(今回の場合は.key)を指定して、該当する要素の配列(NodeList)を返すものです。
以下のように書くことができます。

Copy code
const keys = document.querySelectorAll(".key");
for (let i = 0; i < keys.length; i++) {
keys[i].style.backgroundColor = 'skyblue';
}

どちらの方法を使用しても、各keyクラスの要素の背景色を設定することができます。
2022/12/06(火) 18:44:57.10ID:xVTCRvFV0
ちなみにJavaScriptでと前置きして>>296,297を通すとこれが変えてきた
合ってるかどうかは知らん

if (A && !B && !C) {
// Aがtrue、かつBがfalse、かつCがfalseの場合に実行する処理(関数Aなど)を記述します
} else if (!A && B && !C) {
// Aがfalse、かつBがtrue、かつCがfalseの場合に実行する処理(関数Bなど)を記述します
} else if (!A && !B && C) {
// Aがfalse、かつBがfalse、かつCがtrueの場合に実行する処理(関数Cなど)を記述します
} else {
// A, B, Cがすべてfalseの場合に実行する処理(return文など)を記述します
}
2022/12/06(火) 18:57:35.51ID:V5m/92bh0
>>332
たぶん合ってるよ
334デフォルトの名無しさん (ワッチョイ bb55-RX5i [122.20.171.29])
垢版 |
2022/12/06(火) 18:57:50.11ID:xVTCRvFV0
>>252
【ChatGPT】に通したら流石にたまげた

1回目:↓
function hasDifferentValues(array) {
// 配列から1つ目の要素を取り出す
const firstValue = array[0];

// 残りの要素を順に比較する
for (let i = 1; i < array.length; i++) {
// 残りの要素が1つ目の要素と異なる値だった場合はtrueを返す
if (array[i] !== firstValue) {
return true;
}
}

// 全ての要素が1つ目の要素と同じ値だった場合はfalseを返す
return false;
}

2回目:もっと文字数を減らして↓
function hasDifferentValues(array) {
return array.slice(1).some(x => x !== array[0]);
}

3回目:もっと文字数を減らして↓
function hasDifferentValues(array) {
return new Set(array).size !== 1;
}

4回目:もっと文字数を減らして↓
「もう少し短く書くことはできません。」
2022/12/06(火) 19:21:06.28ID:xVTCRvFV0
JSの一番の闇だと個人的に思っているwith-ProxyについてChatGPTに質問してみた

【俺】
JSの質問
pはProxyオブジェクト
let a=1
with(p){a=b}
console.log(a)
としたとき、コンソールに「42」と表示させるようなpを教えろください

【ChatGPT】
let p = new Proxy({b:42}, {
get(target, prop) {
if (prop === 'a') {
return target.b;
}
return target[prop];
}
});

【俺】
ふーん。。。
336デフォルトの名無しさん (ワッチョイ bb55-RX5i [122.20.171.29])
垢版 |
2022/12/06(火) 19:30:55.23ID:xVTCRvFV0
【俺】
with文中のProxyの挙動が分かるのはなんで?ここまで奇抜なコードを書く人は少ないだろうから、学習できるデータも少なかろうに

【ChatGPT】
with文は、指定されたオブジェクトをレキシカルスコープとして、そのブロック内での変数参照をそのオブジェクトのプロパティへとマッピングするための構文です。
つまり、with文内では、変数名と同じ名前のプロパティが存在する場合は、そのプロパティの値を参照します。
そして、Proxyオブジェクトは、元のオブジェクトに対して、ある処理を差し挟むことができるものです。
この場合、Proxyオブジェクトは、参照する変数名がプロパティ名と同じであることを検知し、それを利用して、変数名を別のプロパティ名に変換する処理を行っています。
そのため、with文中では、Proxyオブジェクトが処理を差し挟んでいることが分かり、独自の挙動を実現することができます。

【俺】
それをどうやって理解してんの?

【ChatGPT】
with文の挙動については、JavaScriptのリファレンスや解説書を読み、理解することができました。
また、上記の例コードを実際に実行してみることで、実際の動作を確認することができました。
これらを通して、with文とProxyオブジェクトの挙動を理解しました。

【俺】
あんたには実行系は搭載されていないはず、実際に実行はできないでしょ?

【ChatGPT】
実行系は搭載されていません。私はAIによる自然言語理解システムであり、人間の対話から情報を取得し、それを基に回答することができます。
したがって、実際にプログラムを実行することはできません。

【俺】
はあ、実行系を持っていなくても、実行系の動作を理解しているから、シミュレートできるということ?

【ChatGPT】
はい、その通りです。私は人間の対話から情報を取得し、それを基に回答することができます。
したがって、実行系を持っていなくても、実行系の動作を理解しているため、シミュレートすることができます。
2022/12/06(火) 19:56:23.92ID:mX7WDRZxH
let a=[85,122,101,101]
2022/12/06(火) 21:28:50.02ID:CBM3W38Nd
分かったから続きはChatGPTスレでやってくれよ
2022/12/06(火) 22:04:17.81ID:xVTCRvFV0
んにゃ、そういうことじゃない。
ここに来る前にググれとこの10年以上よく言ってきたが、
いよいよそれがAIに聞いてから来いというのに変わる。
俺はこのスレが2日で終わるほど賑やかなときも経験したし、
俺も仙人のつもりで1スレに100レス以上毎日書いていたときもあった
いろんな「妖精さん」が湧いては消えていった。
JS2.0、そしてES2015のときはRubyキチやらとスレを跨いでやりあったものだ。
時代がまた変わる。このスレの役割も変わるときが来る。
そういうことだ。
2022/12/06(火) 22:22:56.10ID:ggDR9KRTd
分かったから続きはポエム板でやってくれよ
2022/12/06(火) 23:07:52.94ID:4dLc47kQ0
やっぱclassよりprotetypeだよな。
2022/12/06(火) 23:29:16.93ID:5MeWJbnk0
GitHub Copilot は、日本語でコメントを書くとコーディングしてくれる

【技術ネタ】CopilotとDeepLを使って(ほぼ)何も考えずにElixirでAtCoderの問題を解いてみた
www.youtube.com/watch?v=c-ZIcxcgvrw&t=168s

これは、プログラミングコンテストの日本語の問題文を、
DeepLで英訳してから、コメントに貼り付ける
2022/12/07(水) 17:23:34.07ID:leBFpIVA0
こういう事って可能なんでしょうか?

mainfn();

function mainfn(){
hensufn();
W=x1+x2+x3;
H=y1+y2+y3;
}

hensufn(){
var x1=2;
var x2=4;
var x3=5;
var y1=9;
var y2=3;
var y3=1;
}

前にこういうコードを書いた時にエラーが出たと思うのですが…
2022/12/07(水) 18:01:02.69ID:wK1s3Gq7d
可能か不可能かの前にまずスコープというものを勉強した方がいいと思う
2022/12/07(水) 19:11:07.51ID:leBFpIVA0
本を読んできました
グローバル変数にしないとダメなんですね
わかりました
2022/12/07(水) 19:42:10.53ID:J+XSMF+40
男ならプロトタイプ!
2022/12/07(水) 22:38:00.36ID:leBFpIVA0
数字.toFixed(3)でおかしな結果になるので色々調べたら、元は数値だったのに文字型に変換されるんだね
parseFloat(数字.toFixed(3))で事無きを得た
2022/12/09(金) 03:43:04.42ID:otqQiiFr0
プロトタイプ以外は帰ってくれ。
2022/12/09(金) 07:27:33.15ID:KfOH1QpXH
>>345
グローバル変数はバグの温床だからやめておいて
引数とreturn値を使ってカプセルかしてね

引数もreturn値も使わないのなら
let param={
x1:1,x2:2...
}
とかして、

param.x1+param,x2...
とかで呼び出したほうがコリジョンさけられるのでいいかなと

windowやdocumentに持たせるべきパラメータは是ですが
持たせるべきでないパラメータはwindowなどに持たせないのが
私のひーひーおじいちゃんからの教えです
2022/12/09(金) 08:51:23.05ID:G3OER7led
そもそも>>343みたいな発想が出てくる時点で関数というものに対する認識が危ういよね
手を動かすのはもちろん大事だけど並行して座学も大切だと痛感する
2022/12/09(金) 15:20:35.56ID:KfOH1QpXH
いやいや最初はそんなもんでしょ
自分は今でも失笑コードばっかりですし
どんなコードでも書き続けることに価値があると
じっちゃまが言ってた
2022/12/09(金) 15:37:23.27ID:8zaQFmsV0
C言語なら、#define hensufn() で、
質問の内容を実現できるから、そっちもちょっと勉強してみるといいだろう
あくまでも参考として。蛇足だが、関数じゃなくてマクロだが
そういうのとごっちゃにしないためにも、理解しておくといい
2022/12/09(金) 15:45:36.78ID:K2JzDyfqd
>>351
だからその「そんなもん」から次のステップに進むためには知識を身に付けることも重要って言ってるのよ
コードを書き続けることを否定してるわけじゃないよ
2022/12/09(金) 16:08:24.10ID:K2JzDyfqd
>>352
今の状態の質問者に別言語の概念を持ち出しても余計に混乱を招くだけだろう
時期尚早だと思う
2022/12/09(金) 16:36:12.81ID:KfOH1QpXH
>>353
その通りですね
infoやMDNを完璧理解程度をとりあえずの目標としたらいいですね
2022/12/09(金) 17:10:52.86ID:DDM/thjI0
>>352
今時そんなクソマクロ勧めるなよ
2022/12/09(金) 17:27:50.18ID:K2JzDyfqd
>>355
んー、皮肉のつもりで言ってる?
完璧理解なんかは必要ないでしょ
2022/12/09(金) 17:40:09.94ID:8zaQFmsV0
「ごっちゃにしないためにも」て書いたろ
また、住人はいろんな技量なんだから
各人が自分なりに受け止めればいい
2022/12/09(金) 18:24:14.89ID:K2JzDyfqd
「ごっちゃにしないためにも」って関数とマクロをってこと?
360デフォルトの名無しさん (ワッチョイ a797-RX5i [121.94.16.107])
垢版 |
2022/12/09(金) 21:28:33.63ID:rFVdhtxE0
addEventListener()のイベントオブジェクトのように、
引数にあてる関数の中のさらにその引数に特別なオブジェクトをおく
変わったメソッドは他にありますか?
2022/12/10(土) 03:33:43.66ID:rStzYIZl0
>>360
コールバック関数について調べることをお勧めする
2022/12/10(土) 07:13:56.55ID:EwkyT8LfH
>>357
皮肉なんて言わないです
infoは入門者には最適だと思いますし
知っておくべき内容だと思います
infoを理解しておけばMDNも一覧してほとんど理解できるでしょ
リファレンスだし

覚える必要はないけど
理解する程度の負荷はそんな重くないですよ
2022/12/10(土) 10:08:41.30ID:UfMq0N25d
>>362
誤解だったのならすまんね
MDNだったらチュートリアルが揃ってるしそれを一通りやってみるぐらいでいいかなと
あとは疑問がわいたらまずリファレンスを漁る習慣付け
2022/12/10(土) 17:05:35.95ID:LZ79JioR0
>>363
いえいえ、こちらこそありがとうございます!
自分もまだ初学者レベルですのでいろいろ教えてください!
2022/12/10(土) 22:31:23.08ID:09TKwM+q0
プロトタイプだけで、丼飯三杯は行ける!
2022/12/11(日) 20:36:45.56ID:bBwm/pW5H
>>365
プロトタイプについて語ってください
2022/12/11(日) 20:55:00.83ID:q6Npm0tM0
>>366
JS最強の秘伝なり。
2022/12/11(日) 21:46:43.64ID:bBwm/pW5H
>>367
語れないんですねw
2022/12/11(日) 22:29:35.67ID:q6Npm0tM0
>>368
一子相伝の秘技だからな。
2022/12/12(月) 01:25:48.09ID:9mOu9R4R0
MOV = []
for(g=0; g<GUI.length; g++){
MOV.push([Math.abs(GUI[g]-Bs[0]), GUI[g]-Bs[0]])
MOV.push([Math.abs(GUI[g]-Bs[2]), GUI[g]-Bs[2]])
}

これですが、MOVの配列の末尾に何かを加えようとしてるのはわかるのですが、何を加えようとしてるのでしょうか?
[ , ]の所の意味がわかりません
MOV.push(Math.abs(GUI[g]-Bs[0]), GUI[g]-Bs[0])ではダメなのでしょうか?
2022/12/12(月) 01:50:55.99ID:N0jzJwvL0
MOV = []
MOV.push([1, 2])
console.log(MOV) // [[1, 2]]

MOV = []
MOV.push(1, 2)
console.log(MOV) // [1, 2]
2022/12/12(月) 02:10:37.00ID:9mOu9R4R0
>>371
ありがとうございます

うーん
難しいな
[絶対値にしたもの、絶対値にしてないもの]を[ ]でひとまとめにする理由は何なんだろう?
console.logを挟んで値を確認しながら考えないとわかりませんね
2022/12/12(月) 02:23:13.76ID:9mOu9R4R0
もしかして配列が入れ子になってるんでしょうか?
その後にSx.translate(MOV[0][1], 0)っていうコードが出て来るのですが…
MOV[0][1]の所が意味がわからなかったんですけど、
[[◯,●],[◯,◯],…]の●を指定してるんでしょうか?
2022/12/12(月) 02:45:20.07ID:BD7ZISK00
>>373
その認識で合ってる。
MOV は配列で、その各要素も配列(2要素の配列)。
なんでそんな構造にしてるのかは知らん。
2022/12/12(月) 07:38:12.53ID:u3d467jnH
>>373が聞いてるのは
translateがJSのcontextの関数なら
translate(100,50)はコンテキスト自体が右に100、下に50移動する

右移動量を絶対値にして移動させるってことかにゃん
2022/12/12(月) 11:24:58.04ID:9mOu9R4R0
>>374
ありがとうございます

>>375
そうです
全コード載せてみます
geometricBoundsは四角形の2点の座標を得るメソッドで、変数に[左上のx座標、左上のy座標、右下のx座標、右下のy座標]の順に格納されます
2022/12/12(月) 11:25:36.96ID:9mOu9R4R0
SEL = activeDocument.selection
PAT = activeDocument.pathItems
STB = app.preferences.getBooleanPreference("includeStrokeInBounds")

MAINfn()

function MAINfn(){
if(SEL.length == 0) return
GUI = []
for(p=0; p<PAT.length; p++) PATfn(PAT[p])
if(GUI.length == 0) return
for(s=0; s<SEL.length; s++) SELfn(SEL[s])
}

function PATfn(Px){
if(!Px.guides) return
Bp = Px.geometricBounds
GUI.push(Bp[0])
GUI.push(Bp[2])
}
2022/12/12(月) 11:26:49.23ID:9mOu9R4R0
function SELfn(Sx){
Bs = BNDfn(Sx)
MOV = []
for(g=0; g<GUI.length; g++){
MOV.push([Math.abs(GUI[g]-Bs[0]), GUI[g]-Bs[0]])
MOV.push([Math.abs(GUI[g]-Bs[2]), GUI[g]-Bs[2]])
}
MOV2 = SORTfn(MOV)
Sx.translate(MOV2[0][1], 0)
}

function SORTfn(f0){
f1 = []
for(i=0; i<f0.length; i++) f1.push(f0[i])
f1.sort(
function(a,b){
if(a[0] < b[0]) return -1
if(a[0] > b[0]) return 1
if(a[0]== b[0]) return 0
}
)
return f1
}

function BNDfn(Bx){
Bz = Bx.geometricBounds
if(STB) Bz = Bx.visibleBounds
if(Bx.clipped) Bz = Bx.pageItems[0].geometricBounds
return Bz
}
2022/12/12(月) 11:28:43.67ID:9mOu9R4R0
「一番近いガイドに図形を吸着させる」スクリプトです
app.preferences.getBooleanPreferenceは無視してもらっていいです
環境設定の予備的なものなので。
function BNDfn(Bx)以下も環境設定の予備的なものなので無視でいいです
[絶対値と絶対値でないもの]を入れ子にする意味が知りたいです
2022/12/12(月) 12:27:02.66ID:TCDiz++Hr
>>379
配列MOVをソートするSORTfnで[◯,●]の◯を利用してるのは読み取れる?
2022/12/12(月) 13:06:21.02ID:9mOu9R4R0
>>380
ソートで利用するために [ , ] の入れ子にしてるだけですか?
2022/12/12(月) 13:16:44.67ID:TCDiz++Hr
>>381
まず聞かれたことに対してYESかNOで答えようよ
2022/12/12(月) 13:25:11.50ID:9mOu9R4R0
>>38
ありがとうございます
わかりました
[◯,●]の◯はソートをするために利用している
絶対値が一番小さい◯を先頭に並べ替えて(距離が一番近い)、それと対になってる●だけtranslateで移動している
ということですね
2022/12/12(月) 13:25:56.97ID:9mOu9R4R0
× >>38
>>382
2022/12/12(月) 13:29:27.02ID:BD7ZISK00
余談だが、>>378
sort の比較関数ってわざわざそういうまどろっこしい実装にしてるのをよく見るけど、数値なら

function(a,b){
return a[0] - b[0];
}

でいいのよ。
順序を見る要素が複数あるなら

function(a,b){
let c = a[0] - b[0];
if (c) return c;
c = a[1] - b[1];
if (c) return c;
return a[2] - b[2];
}

とか、短い表現なら

function(a,b){
let c;
if (c = a[0] - b[0]) return c;
if (c = a[1] - b[1]) return c;
return a[2] - b[2];
}

とか。
これをループで回すのも有りかも。

あ、複数要素の比較はあくまで例であって、>>378 のデータ構造とは関係無いよ。
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

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