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

+ JavaScript の質問� ..

88:Name_Not_Found
20/01/16 12:45:06 //pOUTQK.net
>>68 です。
みなさん、いろいろご回答ありがとうございます。
説明が下手ですみません。

ゲームのセーブデータのような使い方をしたいと思いました。
ネットを頼りに見様見真似で、保存していた
{ "aa": 963, "bb": 852, "cc": 741 }
を取得できたのはいいけど、この文字列をどうしたら便利に使えるか
（＝元のデータに復元できるか）、がわかりませんでした。
探し方がわるいのか、どの説明も上記の「文字列として取れます」で終わっていて、
その先の解説が欲しいなと…

それとも、文字列を取得できた時点で JSON の役目はおわっていて、
あとは csv 読み込みみたいに自分で切り分けて使うのでしょうか。
みなさんなら、この文字列どうするかんじでしょうか。。。

最悪、JSON使わなくても大丈夫そうな処理なのですが、
せっかくなので使って便利なら試したく思いました。

89:Name_Not_Found
20/01/16 13:35:55.10 .net
const obj = JSON.parse()
const yyy = new testClass(obj.aa, obj.bb, obj.cc)
yyy.aa // 963

90:Name_Not_Found
20/01/16 22:29:56 .net
>>88
データ形式によっちゃ使えないけど例だけ満たせればよいなら

const yyy = new testClass(null, null, null);
JSON.parse(json, (key, value) => {
　if (key) yyy[key] = value;
});

とかｗ

91:78
20/01/16 23:34:41 .net
>>78
みたいに、

new testClass( obj )
と、1つの引数のオブジェクト渡しに変えた方が、良さそう

引数を3つも渡すのは、面倒でしょ？

92:Name_Not_Found
20/01/17 03:55:24 .net
理由は面倒だから？ｗ
new testClass(1, 2, 3)
と書くのが面倒で、
new testClass({a: 1, b: 2, c: 3})
と書くのは面倒じゃないんだ？ｗｗｗ

93:Name_Not_Found
20/01/17 06:25:26.57 .net
頭が悪いね
大ヒント：obj.a

94:Name_Not_Found
20/01/17 06:40:13.58 c4cACoID.net
テトリスくらい作れないと話になりませんか？

95:Name_Not_Found
20/01/17 08:13:00.78 gip8AQMU.net
WebフォームとDBいじるだけならテトリス要らないと思われ
ゲーム作るならテトリスをコピーするのは大事だけど、新しい落ちゲー作るアイデアのが大変

96:Name_Not_Found
20/01/17 08:21:36.97 c4cACoID.net
新しいおちげー作るにしてもテトリスは基本になるかなと
ゲームエンジン使ってるんですけどね

97:Name_Not_Found
20/01/17 15:43:36 s+p7yde/.net
みなさん本当にありがとうございます。

>>89
すみません、保存するのは何かのポイントのように変わるものです
数字は固定じゃないです

>>90
アロー演算子わかんないです…

>>91
ちょっと何言ってるかわかんないです…（自分の習熟度が低すぎて）
localStorage.getItem ( "testKey" ) から取れた値を復元したいです

>>92
var aaa = new testClass ( 1, 2, 3 );
localStorage.setItem ( "testKey", JSON.stringify( aaa ) );
var bbb = new testClass( localStorage.getItem ( "testKey" ) );

で、bbb が {aa: "{"aa":1,"bb":2,"cc":3}", bb: undefined, cc: undefined} になっちゃった…
おしい…？
でも、そんなニュアンスのことをしたかったです。

>>93
はい（真顔）
なんで皆さんが頑なに　localStorage.getItem ( "testKey" )　を起点に答えてくれないのか
未だにわかっていません…
{"aa":1,"bb":2,"cc":3}　になった時点で再利用できないデータなのか。。。

－－－
初歩から出直すべきですかね…　（＾＾；；；

98:Name_Not_Found
20/01/17 17:05:22.40 .net
出直すべきだね

99:Name_Not_Found
20/01/17 20:08:42.03 .net
最近不思議に思っていることがあります
各ブラウザがサードパーティクッキーを制限すると発表して騒ぎになっていますが、
別に広告主が提供先サイトにＪＳを埋め込ませれば好きなように好きなだけ広告主のサーバーとやり取りさせられますよね?
サードパーティクッキーを制限すると、どんな問題が本質的に解決するのでしょうか?

100:Name_Not_Found
20/01/17 20:11:14.10 .net
広告主に「たくさん広告表示されました！だからお金ください！」って
請求できるってこと？

101:Name_Not_Found
20/01/17 20:45:00 .net
>>99
> 別に広告主が提供先サイトにＪＳを埋め込ませれば好きなように好きなだけ広告主のサーバーとやり取りさせられますよね?

URLﾘﾝｸ(developer.mozilla.org)

102:Name_Not_Found
20/01/17 21:20:12 .net
>>101
それは広告主のサーバー側の設定の話なので問題にはならないのでは？

103:Name_Not_Found
20/01/17 21:25:38 .net
>>100
それはCookieでもできますよね？
だから最近は表示ではなくほとんどクリックベースになっているのでは？

104:78
20/01/18 00:18:02.34 .net
>>97
JavaScript では、他の言語のように、constructor の多重定義が出来ないから、
設計する際、どちらかを選択しないといけない！
Test は引数を、1つのオブジェクトとして渡す方法で、
Test2 は各引数を、別々に渡す方法だけど、
Testの方が分かりやすいかなと思って
class Test {
constructor ( obj ) {
this.a = obj.a;
this.b = obj.b;
} }
var obj = new Test ( { b: "2", a: 1 } );
console.log( obj );
// Test { a: 1, b: '2' }
次へ続く

105:78
20/01/18 00:18:40.19 .net
class Test2 {
constructor ( a, b ) {
this.a = a;
this.b = b;
} }
var obj = new Test2 ( 1, "2" );
console.log( obj );
// Test2 { a: 1, b: '2' }
各引数を別々に渡す方法だど、引数の順序で決まるから、
下のように、引数を逆の順番で渡せない！
つまり、順番を確認しないといけないので、ややこしく、バグりやすい設計
var obj = new Test2 ( "2", 1 );
console.log( obj );
// Test2 { a: '2', b: 1 }

106:78
20/01/18 01:02:28 .net
>>97
【JavaScript入門】JSONの作成とparse() / stringify()の使い方！
URLﾘﾝｸ(www.sejuku.net)

var js_obj = {
a: 1,
b: "2"
}
console.log( js_obj );
// { a: 1, b: '2' }

// JSON.stringify で、JavaScript(JS)のオブジェクトを、JSON に変換する
var json_obj = JSON.stringify( js_obj );
console.log( json_obj );
// {"a":1,"b":"2"} JSONは、プロパティ名が文字列になっている！

// JSON.parse で、JSONをJSオブジェクトに戻す
js_obj2 = JSON.parse( json_obj );
console.log( js_obj2 );
// { a: 1, b: '2' }

107:78
20/01/18 03:41:24 .net
>>106
の続き

JSON.parse で、JSONをJSオブジェクトに戻した、js_obj2 は、{ a: 1, b: '2' }

ここで、>>104
で述べた、constructor の引数に、1つのオブジェクトとして渡す方法が、便利！

class Test {
constructor ( obj ) {
this.a = obj.a;
this.b = obj.b;
} }

var obj = new Test ( js_obj2 );
console.log( obj );
// Test { a: 1, b: '2' }

108:Name_Not_Found
20/01/18 07:13:59.10 .net
元々がオブジェクトならそのまま渡せた方が便利だが
他の呼び方もされるならその限りではない

109:Name_Not_Found
20/01/18 11:07:03.62 GuxRgmIP.net
javascriptでゲーム作ってる人はすくにゃいですか？

110:Name_Not_Found
20/01/18 12:23:16.51 .net
>>104
ああああああああああああああああああ
できちゃあああああああああああああああああ！！
やったーーーーー！！！！　んほおおおおおお！！
ありがとうございます、そのままコピペでコメント付きソースになるの大感謝です！
いったん頂いたソースで動きを確認して、自分の使いたい方のソースに一行ずつ置き換えたら、
『オブジェクトごとstringifyでローカルストレージへ保存、
　ローカルストレージからparseでオブジェクトに復元』
の流れができました！
引数の入れ替わりの考慮や、プロパティ名のところなど、細かい解説もたすかりました！
あったけぇ…（；；）　ありがとうございます…！
>>78で既にほぼ正解近くの回答もらってたんですね、他の方もありがとうございました。

111:Name_Not_Found
20/01/18 13:00:40.61 .net
ぶっちゃけると2020年からは
オブジェクトを保存したいのならKVS推奨なんだけどね

112:Name_Not_Found
20/01/18 13:07:32.53 .net
何と比較してどういう理由でKVS推奨と言っているのか気になる

113:Name_Not_Found
20/01/18 13:17:03.43 .net
24時間営業だから

114:Name_Not_Found
20/01/18 13:43:53.19 .net
CVS?

115:Name_Not_Found
20/01/18 18:19:36.97 .net
SVGやその中のpathの幅や高さは実際の見た目ではなく余白のあるキャンバスのサイズになりますが、実際に表示されている線の幅・高さを取得する方法ってありますか？
JSで頑張って取得するより、余白なしのSVGを用意した方が手っ取り早いかな…

116:Name_Not_Found
20/01/18 21:05:17.42 .net
昨今のデバイスはD2Pでないので実際の見た目は検則できない

117:Name_Not_Found
20/01/19 11:18:27 .net
>>115
URLﾘﾝｸ(developer.mozilla.org)
URLﾘﾝｸ(developer.mozilla.org)

118:Name_Not_Found
20/01/19 13:31:00.35 .net
計算上の内部の値で必ずしもSVG要素の見た目が判別できるわけではない

119:Name_Not_Found
20/01/19 15:14:44.62 .net
「SVG要素のサイズ」なら、既出の方法で良いかと

120:Name_Not_Found
20/01/19 19:00:35.69 .net
そういえば数年前くらいにjavascriptを埋め込める？もしくは
読み込んだ画像データをjavascriptで操作できるみたいなコンセプトの画像フォーマットがあったと思うのですが結局あれはどうなったんですか

121:Name_Not_Found
20/01/19 20:47:57 .net
初歩的な質問なんだけど
githubで公開されてるライブラリって基本的にどのフォルダをダウンロードすればいいの？

122:Name_Not_Found
20/01/19 23:49:24.78 .net
GitHub と、ローカルPC 双方の、プロジェクトルートをシンクロさせるのじゃないの？

123:Name_Not_Found
20/01/19 23:50:00.25 .net
全部
git cloneしろ

124:Name_Not_Found
20/01/20 00:21:35.31 .net
車ってどうやって操作したらいいの？みたいな質問やな

125:Name_Not_Found
20/01/20 08:14:59.85 .net
初歩を押さえない初心者しかいない件

126:Name_Not_Found
20/01/20 08:29:24.95 .net
聞き方が悪かったわ
srcとかdistとかdocsとかあるけどどれ使えばいいの？

127:Name_Not_Found
20/01/20 13:59:53 Yq2mEYPn.net
>>126
すれ違いだからググってほしいところだけど
とりあえずdistの中で

128:Name_Not_Found
20/01/20 16:29:37.72 Lw8sfmye.net
pdfの特定のページにテキストフォームを作成する方法ってありますか？？
普通にやっても1ページ目にしかできない…

129:Name_Not_Found
20/01/20 18:54:12.69 OuXSc3i7.net
128ですが、自己解決しました。スレ汚しすみません

130:Name_Not_Found
20/01/21 07:54:06.48 RMnuU/zx.net
chrome のデベロッパーツールのコンソールログのところで、
右クリックすると　hide messages from XXXXX　って出ると思うんですが、
間違ってこれを押したからか、エラーが表示されなくなってしまいました。
hide しちゃったのは、どうやったら再表示できるんでしょうか。

131:Name_Not_Found
20/01/21 08:17:16.80 .net
解決しました、失礼しました

132:Name_Not_Found
20/01/21 22:22:18.84 .net
document.writeで書いたhtmlのスタイルシートが完全に効かない

133:Name_Not_Found
20/01/21 22:31:14.79 6qHPAlz+.net
>>132
なにか間違ってんじゃないかなー
URLﾘﾝｸ(jsfiddle.net)

134:Name_Not_Found
20/01/21 23:30:42.80 .net
>>133
ありがと
出先だから後で見るね
body内からdocument.writeしていたのを
header内に移動しただけだから
動きは保証されてるはずなのにぃ

135:Name_Not_Found
20/01/22 12:49:36.64 .net
>>133
132だけど、このツールしらなかった、ありがと
とはいえ、ちょっと複雑なscriptにしちゃってるから、
すんなり見ることはできなさそう。。。
bodyに移動したらやっぱり普通に見れたから、
document.writeの仕様的な何かなんかな

136:Name_Not_Found
20/01/22 12:58:14.02 rrQ3wlRN.net
>>135
関係ないと思う
ふつうにセレクタ間違ってるだけかと

137:Name_Not_Found
20/01/22 16:13:49 N+cpHnLv.net
>>135
document.writeが完了したら

適用されてないスタイルのセレクタをコピーし
ブラウザの開発ツールを開き、consoleタブを選択して

document.querySelector('コピったセレクタをペースト');

と打ってenterして要素が返ってこない、もしくは
開発ツールのelementsタブを選択して、⌘+Fして検索窓を開き
コピったセレクタをペーストして
要素が選択されない場合は

セレクタが間違っているよ

138:Name_Not_Found
20/01/22 19:47:16.78 SRoKId4J.net
pdfフォームのテキストフィールドのフォーマットを数値にする方法を教えてください
AFNumber_Format使ってもカスタムにしかならないから送付先がタブレットとかだと動かないんです

139:Name_Not_Found
20/01/22 19:49:19.06 .net
ビューワ側の問題なんじゃない？それ

140:Name_Not_Found
20/01/23 00:15:03.22 .net
>>134-135
>body内からdocument.writeしていたのを、header内に移動しただけだから、動きは保証されてるはず
これは、全く保証されていない！
だって、body は、header 後に出力されるから、headerの内容は消されないのでは？
一方、header内でやると、その後のheader内の処理はされないとか、
bodyを作った後に回されて反映されないとか、動作が保証できないだろ？

141:Name_Not_Found
20/01/23 05:23:49.27 .net
みんなありがとーだよー
 >>136
>>137
ちゅまんセレクタ使ってないの…
.unchi {}みたいなのを作って、classでテキトーに呼んでるんだぅ
 >>140
あるとしたらその辺かもー
いっこ気になるのが、同期処理したくてasync使ってることかなぁ
<header>
document.write(link rel の cssインポート)
document.write(各種javascript外部ファイル)
async開始
　　csvファイル読み込み
　　読み込んだcsvを使う<body>＆<table>のhtml(document.writeで書く)
async終了
</header>
<body>
上書きされる元々のbody内
</body>
これを動かすと元々の<body>が無かった事になって、async内の<body>が表示される感じ
css効かせてるのは、このasyncで書き込む方
するとtableは普通に出るけど、cssだけ抜け落ちてる
css読み込みまでは非同期でも読み込みが間に合わないとは思えないくてナンデカナーって
asyncの実行順はログで確認済み

142:Name_Not_Found
20/01/23 08:46:59 .net
あれ、ひょっとしてbodyの上書きってより
html全体の上書きになってるのかな？
帰ったら調べるべ

143:Name_Not_Found
20/01/23 10:52:45 .net
>>132です、解決したー　↑がビンゴでやんした

header内のdocument.writeをやったことで、
それまでに読み込んでいた各種cssやjavascript等全て消え去って、
まっさらな状態で<body>からの記述だけになってたー
開発ツール上でいわれた通りソース見て確認した！

ヒントくれた人、開発ツールの使い方教えてくれた人、
サンクスぅぅぅ

144:Name_Not_Found
20/01/23 12:25:35.87 .net
document.writeはFPにも設定があるように相当に非推奨

145:Name_Not_Found
20/01/23 14:51:20.51 .net
document.writeで要素を書いて
CSSやJSファイル読み込むのはだいぶ前にできなくなったんじゃないか
以前それやってて、動かなくなるってChromeの中の人が言いだしたんで
いろいろ改修した覚えがある

146:Name_Not_Found
20/01/23 21:35:11.28 .net
>>144-145
ファイル名？時間　で取得して
キャッシュ使わないようにしてるんだけどダメ？
キャッシュ対策その後なんか出たっけ
ページ読むたび、絶対最新取得するオプションとか

147:Name_Not_Found
20/01/23 21:46:05.19 ZoMVOw6M.net
>>146
キャッシュと何の関係が

148:Name_Not_Found
20/01/24 00:16:44.89 .net
document.write を使わない方がよい
あらかじめ、container, main, app などのid を作っておいて、そこにDOM を追加すればよい。
<div id="container"></div>
それか、Ruby on Rails などのフレームワークでは、
各部品は各部品用のテンプレートファイルに書いておいて、
それらをメインのapplication.html に読み込んで、全体像を作る

149:Name_Not_Found
20/01/24 02:04:43 .net
>>148
なるほど、そっちでやるのか

ちなみに、どの画面でも表示するルートメニューみたいなの、変更あった時いちいち全htmlを修正するの面倒だからjsに逃してdocument.writeで共通化してるけど、それもダメなんけ？
htmlって外部データのインポートあったっけ

150:Name_Not_Found
20/01/24 03:44:22 .net
URLﾘﾝｸ(developers.google.com)
URLﾘﾝｸ(developers.google.com)
↑Googleはdocument.write()を使うなってさ。

単純に全ページ共通で読み込まれるブロックを1つ作ればいいんじゃない
フレームワーク未使用で静的ページだからそれが面倒ってならもNuxt.jsだのGatsby.jsだのに移植したほうが今後の改修に耐えられるような。

151:Name_Not_Found
20/01/24 05:02:45 .net
>>150
>単純に全ページ共通で読み込まれるブロックを1つ作ればいいんじゃない

ううぅ… そんな事できんの…？
出来るならもちろんそうしたい
ひんとか検索キーワードだけでもプリプリプリーズ💩

152:Name_Not_Found
20/01/24 06:38:37 .net
jQueryの.loadで共通のhtml1個作って読み込んでくれば？
ただ、そういう面倒な部分を共通化しいてきたいのなら、
PHPだのjsのフレームワーク使ってやったほうが生産性大分上がると思うよ。
毎回DOMいじってどうこうしてたら面倒でしょうがないと思う。

153:148
20/01/24 06:43:49 .net
SASS なんかも、Partial

application.scss
_reset.scss
_variables.scss

この3つのファイルがあって、application.scss 内に、

@import "reset";
@import "variables";

で読み込める！

どのフレームワークでも、Partial

154:Name_Not_Found
20/01/24 06:57:51 .net
>>151
template要素を使うとか、createElementとか

155:148
20/01/24 07:03:26 .net
Ruby on Rails では、application.html.erb の中で、各部分テンプレートを読み込む。
_header.html.erb, _footer.html.erb に、その部分だけを作っておく

ERB テンプレート内では、<% ～ %> 内に、Ruby のコードを書いて、それをHTML へ変換する。
<% 式 %>, <%= 式 %>

<div id="container">
<header>
<%= render "header" %>
</header>

<footer>
<%= render "footer" %>
</footer>
</div>

このように、どのフレームワークでも、Partial で作る！
React, Vue.js, Electron なども同じ

156:148
20/01/24 07:11:51 .net
フレームワークを使わない場合の、Partial は、
Document.createDocumentFragment( ) とかかな？

例えば、メモリー内で、header, footer 用のDOM 木を構築しておいて、
<div id="container"> に読み込むとか？

157:148
20/01/24 07:36:43.52 .net
lodash にも、template がある！
URLﾘﾝｸ(lodash.com)

158:148
20/01/24 07:50:29.01 .net
lodash の、template
<% ～ %> 内に、JavaScript のコードを書いて、それを文字列へ変換する
<% 式 %> 値を埋め込まない
<%= 式 %> 値を埋め込む
<%- 式 %> HTML エスケープする
var compiled = _.template(
'<% _.forEach(users, function(user) { %>
<li><%- user %></li>
<% }); %>'
);
compiled({ 'users': ['fred', 'barney'] });
// => '<li>fred</li><li>barney</li>'

159:Name_Not_Found
20/01/24 13:37:57.31 .net
>>152
jQueryはじめてつかったけど、できちゃああ！　ありがとうー
でも、jQueryって将来性大丈夫なのかな。。。(´ρ`)
あ、公式のjs落としておけば、js生きてる限り平気なのか（中身ｊｓだから？）
>>153-158
いろいろありがと、SASS自体しらなかった、CSSまとめるの楽になりそうー
久しぶりに触ってるので、新しい情報いっぱいで感謝。
templateも見てみるけど、Rubyはちとなじみ無いかも(むつかしそう…)
>>144-145
document.writeメッチャつかってたから、非推奨情報たすかった！
💩 < さんくぷー！

160:Name_Not_Found
20/01/24 21:02:29.32 .net
DOMを知らないコピペプログラマ増えたなー

161:Name_Not_Found
20/01/24 21:15:23.30 .net
10年前に比べたらむしろ激減してるよ

162:Name_Not_Found
20/01/24 21:26:42.09 .net
結局、オブジェクトのディープコピーの定番はなんなん？

163:Name_Not_Found
20/01/24 21:43:09.91 .net
>>162
自分はlodashのcloneDeepに頼るか
むかし作ってメンテし続けてる自前関数でやってる

164:Name_Not_Found
20/01/24 21:44:37.64 a4Ae8CKG.net
>>161
10～15年くらい前が
いちばんどむどむ言ってた気もする
けっこういろいろ自前でやらにゃならんかった頃だし

165:Name_Not_Found
20/01/24 21:52:54.11 .net
>>163
lodashか・・・試してみるか・・・
jQuery信者なので$.extend使ってるんだけど
未だにjQueryはJKにも笑われちゃうよな・・・

166:Name_Not_Found
20/01/24 22:56:37 .net
>>165
そうでもない気もする

俺の身の回り限定だけど
jQ以降の世代は、今のESになって盛んに脱jQを叫んでいるけど
jQ以前の世代は、便利なものもあるんだけどなーと思ってる

167:Name_Not_Found
20/01/24 23:06:09 .net
DOM1箇所いじるだけならjQueryで十分いいし使えるんだけど、
それ以上の用途だと逆に面倒でとても使ってられんからなぁ。

前に、クライアント側にもフォームのバリデーション追加してくれって話しになって
一度決まったものを作るだけならよかったものの、そっから改修で弄り始めた途端に一瞬でカオス状態になったよ。

168:Name_Not_Found
20/01/24 23:51:18.85 .net
>>162
型情報が失われるなど、あまり良くないやり方では、
JavaScript(JS)オブジェクト/JSON 文字列の変換により、新しいオブジェクトを構築するとか
JS Object → JSON 文字列 → JS Object(新しいオブジェクト)
Haxe のSerializer では、型情報を維持したまま、
異なる言語間でも、文字列で通信できるけど
ただし、抽象クラスには対応していない

169:Name_Not_Found
20/01/25 00:22:59.79 .net
>>168
それって
例えばプロパティの値が日付オブジェクトだった場合
メソッドはどうなってしまうん？

170:168
20/01/25 00:55:31 .net
JSON では型情報が無くなるから、メソッドを呼んだりできないでしょ？

単純なデータを入れるだけの使い方をして、
型情報などは、別の文書に書いておく

この文書を管理する手間が掛かるから、面倒！

だから各言語には、通信先のホストで、オブジェクトを再構築できる、Serializer がある

各言語のオブジェクト → 文字列で通信 → オブジェクトを再構築

171:Name_Not_Found
20/01/25 12:23:44 .net
>>168
json経由すんのってなんか遠回りでやだよね
結局定番らしい定番は無いってことやんね
その都度適当な方法でコピるしかないのか

172:Name_Not_Found
20/01/25 12:39:30 .net
コピペプログラマは永遠になくならないな

173:Name_Not_Found
20/01/25 12:58:13 .net
コピペプログラマが有識者にネタを求めて質問するのが、ここの日常だから

174:Name_Not_Found
20/01/25 13:16:09 .net
>>164
だからこそ内容の全くわかってないコピペで動かない厨が多かった

175:Name_Not_Found
20/01/25 13:18:25 .net
>>162
非同期で良いならMessageChannelを使うのが良い
もしくは標準で議論が進んでるからそれに近いポリフィルを作って使うかの２択

176:Name_Not_Found
20/01/25 13:31:23 .net
>>172
そのコピーすらロクにできないんだよJavaScriptは！

177:Name_Not_Found
20/01/25 14:08:03 .net
JSのオブジェクトはJSからは参照ができない内部スロットがあるのでコピーは難しい
うかつに完全なクローンが作れたらセキュリティにも影響するかもしれないし

178:Name_Not_Found
20/01/25 14:57:36.80 .net
というかコピーはどの言語でも難しい問題だよ
そもそも関数を値としてみるかどうかだからな
値として見るならコピーした時、それは複製されていなければいけない
だけど大体の言語は値としてみなしてないだろう？
例えばアプリの特定のバージョンでオブジェクトをコピーというか
データとしてファイルにシリアライズする。
そしてアプリのバグを修正したバージョンで、データを読み取る
そうすると、その保存したデータに含まれる関数は
バグ修正の前のものであるべきかどうか
という話をすれば、コピーしたときに関数の情報はデータとして
含まれるべきかどうかという問題が難しいってわかるだろ？

179:Name_Not_Found
20/01/25 15:21:41.89 .net
保存がしたい場合は別だけど、最初から複写されることがわかっている場合は
操作対象は元のオブジェクトに必ずプロキシを噛ませて使うことにしたら良い
値に変更が及んだ場合のみそのプロパティは以後そのプロキシでキャッシュされる
そうすればメソッドのコピーを考えなくても良い

180:Name_Not_Found
20/01/26 22:41:01.29 .net
Windows10でGoogle Chromeを使っています。
URLﾘﾝｸ(blog.capilano-fw.com)
上記の画像認識のリンクの中で
「特定の顔が誰なのかを判別する」
という項目がありますがそのプログラムの中で
const detection = await faceapi.detectSingleFace(image)
.withFaceLandmarks()
.withFaceDescriptor();
の内容をconsole.logで出力してみるとundefindedになります。
どなたかこのプログラムを試した方いらっしゃらないでしょうか。
ちなみにhttpsをアパッチで立ち上げていて、オレオレ証明を使っています。

181:Name_Not_Found
20/01/27 13:57:36 .net
正確には顔認識じゃなくて、簡単な絵の画像認識をしてみたいのですが
いい方法がないでしょうか。

182:Name_Not_Found
20/01/27 19:00:54.23 .net
Three.jsでレンダリングされたcanvasが、
ダウンロードバーの出現のせいで大きさが変わって困ってます。
ダウンロードの開始・終了は検知できるので
その間だけ自動サイズ調整を無効にするにはどうすればよいですか。

183:Name_Not_Found
20/01/27 19:14:08.89 .net
>>182
スクロールバーを消せばよいのでは

184:Name_Not_Found
20/01/27 19:22:10.17 .net
vanilla jsは文法は覚えたくらいのレベルの次となる、上のステップに行くには何をするのが学習する上で有効ですか？
おすすめの課題などがあれば紹介していただけると嬉しいです

185:Name_Not_Found
20/01/27 19:38:40.29 .net
>>184
文法はバニラでなくても必要
ES2019を学べ

186:Name_Not_Found
20/01/27 22:28:57.55 .net
180です。
ごめんなさい、絵の顔を認証させようとしてしていましたが
実写の写真じゃないとダメでした。

187:Name_Not_Found
20/01/28 02:47:15 .net
>>185
既に文法をずっと学んでいて質問しました。
実践的なもので役立つ課題みたいなのってありますか？

188:Name_Not_Found
20/01/28 07:59:45.25 .net
>>187
「ES2019の文法だけ」を覚えても仕方がない
文法以外も学習が必須

189:Name_Not_Found
20/01/28 08:17:42.81 .net
>>187
ES2019 !== 文法　　　　　　　

190:Name_Not_Found
20/01/28 15:37:17.53 .net
>>187
JSわかってるなら問題ないよ
ドキュメントとリファレンスとサンプル見れば
あーなるほどねーって使える
それがライブラリやフレームワークってもんよ

191:Name_Not_Found
20/01/28 19:26:48 .net
まあ、文法だけ覚えてるなら、課題やる前に覚えることはあるだろうね
制御構文とか、オブジェクトとか、プロトタイプとか、いくらでもある

192:Name_Not_Found
20/01/28 23:03:05.08 .net
エクセルにjsが採用されてますます需要が高まるな

193:Name_Not_Found
20/01/29 15:12:08.24 .net
実際jsコーディングする時って何を作るのが実践でも役立つ？
題材でよかったもんとかある？

194:Name_Not_Found
20/01/29 16:37:35.51 .net
>>193
ES6以降のPolyfill
SelectorsvAPIのPolyfill

195:Name_Not_Found
20/01/29 18:12:21.86 .net
>>193
markdownからDOMノードへの変換気

196:Name_Not_Found
20/01/29 18:24:25.27 .net
とりあえずhtmlなり何かしらweb系を絡ませないと
js使う意味なくなってpythonとかでよくねになる気がする

197:Name_Not_Found
20/01/29 19:35:19.84 .net
>>187が安易な答えを求めて、>>193の質問をしただけ
題材だけ揃えてもあかん

198:Name_Not_Found
20/01/29 20:39:39 .net
ｊｓのさらに真価が発揮されるのは５G、６Gでのweb4.0時代

199:Name_Not_Found
20/01/29 22:12:00.74 .net
JSの真価は言語的に仕様が小さくて拡張性があったことだが
ES6から10までの間に半分以上の可能性を消費していて
今が一番真価が発揮されている壮年期
かといって別の言語なら2030年代に革命を起こせるかというとそうではない
そろそろ既存の言語の進化系ではなく、
非同期の大量のタスクを圧倒的自然で素敵に捌ける
新しい仕組みを持った言語が必要ということ

200:Name_Not_Found
20/01/29 22:32:59 .net
async,awaitって使う頻度低くないですか・・？

201:Name_Not_Found
20/01/29 22:39:06 .net
俺が書いたあるプログラムは全体の行の50%にawaitが付いていた。

202:Name_Not_Found
20/01/29 23:05:37 .net
キュー=[await処理１,await処理２,await処理３,,,,,,];
みたいな感じでawait処理が全部終わったら、また同じ順番で再帰しつつ失敗したawait処理はスルーしたいとき
結局、await処理それぞれの”完了・成功したか否か”を保持しないといけないので、async/await使わずに
async/awaitっぽく実装した処理にまとめ書いた方が短く書ける、ような気がした

203:Name_Not_Found
20/01/30 06:46:43 .net
>>201

function foo() {
　async なんたら
　if なんたら
　async なんたら
　for なんたら
　async なんたら
　return
}

こんな感じ？

204:Name_Not_Found
20/01/30 07:11:05 .net
>>200
逐次処理版Promise.allを定義しておけば、使う機会はほぼない

205:Name_Not_Found
20/01/30 08:26:29.10 .net
>>203
awaitだけどまぁそんな感じ。
同期関数のコールツリーの深いところでasyncしかない関数を呼び出す必要が出てきた時
変更が大変になるから、最初からなるべくasync関数にするようにしたらそうなった。

206:Name_Not_Found
20/01/30 10:59:04.00 .net
手続き型思考の人はawaitを多用するのだろう

207:Name_Not_Found
20/01/30 13:06:27.81 .net
使う頻度なんて気にしても仕方ないと思う
一般解なんてないし、自分の好きにやればいい

208:Name_Not_Found
20/01/30 13:43:36.95 .net
ところでasyncとawaitの読みって
えいしんく、あうぇいと、でいいんでしょうか？

209:Name_Not_Found
20/01/30 14:43:00.27 .net
>>208
アシンクです

210:Name_Not_Found
20/01/30 14:48:39.16 .net
>>208
あわいと

211:Name_Not_Found
20/01/30 14:51:04.12 .net
投げっぱなし質問ばかりなのは、やる気がないからでしょうか？

212:Name_Not_Found
20/01/30 16:57:10.80 .net
イベント発生順序について質問です
【環境】 OS: Windows10, ブラウザ: Google ChromeVersion 79.0.3945.130 (Official Build) (64-bit)
【何をしたのか】クリック対象の要素へ4イベントを下記の順番に追加した後、これ自身または子要素をクリックしました
> addEventListener("click", func1, true)
> addEventListener("click", func2, false)
> addEventListener("click", func3, false)
> addEventListener("click", func4, true)
【期待する結果】発生順は常にfunc2,3,1,4 (capture,bubbleの順)
上記環境下にて、この要素自身をクリックした時はfunc1,2,3,4の順に発生しました
クリック対象の登録イベントがcapture,bubbleで区別されないのはjavascript共通ですか？それとも環境固有でしょうか

213:Name_Not_Found
20/01/30 17:04:54.29 0.net
訂正します。期待する発生順はfunc1,4,2,3 (capture,bubbleの順)です

214:Name_Not_Found
20/01/30 18:28:39 .net
そりゃイベント付加した要素、ターゲットがひとつ？だから普通に登録順にイベント発生しただけじゃない？
> addEventListener("click", func1, true)
>
の順番を入れ替えて登録したらその順番で発生しそう

215:Name_Not_Found
20/01/30 18:46:44 .net
>>212
URLﾘﾝｸ(triple-underscore.github.io) に書いてある

216:213
20/01/30 20:09:40.17 0.net
>>214-215
ターゲットフェーズの存在を知りませんでした
分かりやすいページを教えていただきありがとうございます
>213は解決しました

217:Name_Not_Found
20/01/30 21:02:31.02 .net
addEventListenerの第３引数にはオブジェクトを渡しましょう

218:Name_Not_Found
20/01/30 22:51:04.86 .net
>>206
じゃあ手続き型思考じゃない人はどうしてるの？
- await使わずPromise.then()を使う
- Promise自体使わない

219:Name_Not_Found
20/01/31 06:20:55.57 .net
awaitは使うけれど、Promise.allを使ったり、より順不同でパラレルに動くようにしようということだろう
上の話のように完全に順序を守ってawaitしていってるだけなら

220:Name_Not_Found
20/01/31 09:37:54.08 .net
なんか会社でJS勉強しろって言われてる者なんですけど、効率良い勉強方法ありますか？
GSUITE入れるからやらないといけないみたいです

221:Name_Not_Found
20/01/31 12:51:50.92 .net
>>218
どちらもある
そもそも、ケースバイケースで使い分けるから一つの方法に固定しない
「たった一つの冴えたやり方」を探す人がいるが、選択肢を減らすのは悪手だと思う

222:Name_Not_Found
20/01/31 12:53:52.60 KgBKRxWM.net
>>220
勉強のスケジュールをきつめに立てて
週一で進捗をチェックして、遅れたら爪を一枚剥がそう
1週目は怠けてしまうかもしれないけど
2週目からは痛みと恐怖が嫌でも勉強させてくれるよ

223:Name_Not_Found
20/01/31 22:28:08.79 .net
await使うかthen使うかなんて手段の話で、思考の違いが表れるほどのものとは思えんけどな。

224:Name_Not_Found
20/01/31 23:17:30.67 .net
【環境】Android 4.4.2以上
【条件】以下の現状改善にJS(XHR)でいいのか他の方法がいいのか、道筋をまず導いて欲しい
現状
・クライアントPCよりWEBサーバーにCSVが不定期にアップロードされる（そんな頻繁ではない）
・Android端末でWEBサーバーにアクセスし、CSVを元に作成されたページを表示する
・ページの作成はPHPで行われている
・ページの表示は数秒おき（CSVの内容で多少変動する）にリロードされる
・このページを表示するのは１台のAndroid端末のみ
・簡単な情報を表示し続けるシステム
・質問者はC/C++は分かりますが、PHP,HTML,CSSは超初級、JSを初めて触ります
改善したい点三つ
・CSVに変動があろうがなかろうがリロードするのが無駄なので止めたい、
　CSVに変動があったときだけリロードしたい
・欲を言えば変動があった部分のみ表示を更新したい（突き詰めるとPHP要らないんじゃ・・・）
・リロードされる度に、読み込み中の青いバーが画面上に表示されるのを回避したい
　（幸い、リロード時に画面全体が再描画されてチカチカするなどの問題は今のところありません）
考えていること
・まずXHRやfetchを使って必要最小限の「CSVが何時更新されたかどうか」という情報のみを
　読み込み、ブラウザ・JSの変数にて保持しておき、これを定期的に読み込み、何時更新されたという
　情報に差異が出たらリロードすればかなりマシなのでは？
以上ですが、そもそもこれで可能かどうかすら分からない次第なので、この方向でいいのか
悪いのかをご指南いただければと思いました
上記の考えで基本的に可能だとしても改善したい点が単純に全て解決できるとは思っていませんが、
改善したい点の一つ目だけでも改善できればと思っています
よろしくお願いします

225:Name_Not_Found
20/01/31 23:20:45.72 .net
>>220
言語は勉強するものではない
使われてるのを見聞きして使って感覚に慣れるものだ
赤ちゃんが音節を発するように、何事もまずコピペ
人間の脳の仕組みの大原則として、自分が行えない物事を理解することはできない
理解できるから行動ができるのではなくて、行動ができるから理解ができるのだと言う科学的事実は知っておくと良い
まずは意味がわからなくてもそっくり真似をしてどんな要素があるかを感覚で掴むことが大事
それが苦になるようなら向いていないということ
真似をして書いて動いているのをみてから、徐々にその仕組みを覚えていく
そういうイメージでやると良い

226:Name_Not_Found
20/01/31 23:30:26.86 .net
>>224
サーバーから通知を送ってもらいたいということで、WebSocketを使うのが賢い
どうしてもHTTPでやりたければ、なんども通信し直すのは変わらないのだけれど、
通信をできるだけ切らずに維持してサーバーからの返答を長く待つという古来からの方法があり、
それを扱いやすくしたSSE(EventSource)APIがあることにはあるが、
それは今どき川に洗濯に行くようなもので、導入コストは少々かかったとしても
素直に洗濯機を買ってWebSocketを使うことを強く進める

227:Name_Not_Found
20/02/01 00:29:11.61 .net
>>226
レスありがとうございます
仰るとおり、サーバーからの通知が最善のはずだと、WEB PUSH など用語すら
分かってない状況でググり倒し、情報が多すぎで判断付かずここに駆け込んできました
ソケット通信はC/C++でもやってますので何とかなりそうな気はしましたが、
サーバー側をどうすればいいのか中々分かりませんでした
PHPでもいいのかな？できるかも？という程度の情報には今たどり着きましたが、、
質問で書き忘れていましたが使用しているサーバーはXserverでして、
このサーバーだとちょっと難しいような（ポートの問題がある？）情報を
見つけてWebSocketを躊躇しているところです
SSEだとサーバーを問わないのかな？（分かりませんが）
WebSocketやnode.jsは、ググり倒している間に訳分からないまでも見かけては
いましたが、SSEは初見でした
これなら最悪、やりたいことはできそうなのが幸いです
情報ありがとうございます

228:Name_Not_Found
20/02/01 00:45:38.05 .net
>>224
CSV ファイルの更新時刻をどこかに保存しておいて、毎回それと比べれば、
CSVファイルが更新されたかどうか、判別できる
Ruby なら、index.html.erb みたいなテンプレートに、内容を埋め込む。
ERB は、あらゆるファイルに、Rubyの式を、embedded 埋め込める
<div><%= Rubyの式 %></div>
または、JavaScript/jQuery のAjax で、動的に内容を変えられる
本当は、RubyのSinatra などでサーバーを作って、
CSVファイルの更新時刻をチェックする処理を作ってもらうとか、
サーバー側に、新しい処理・ルーティングを追加して、
Android からは、直接サーバー側のファイルを参照しないのが良い！
0から手を動かして作るRailsチャットアプリ【チュートリアル】
URLﾘﾝｸ(www.youtube.com)
Ruby on Rails で、websocket を使った動画

229:Name_Not_Found
20/02/01 01:15:10.40 .net
>>224
URLﾘﾝｸ(dev.classmethod.jp)
AWS S3にアップロードされたものをLambdaで探知してブラウザリロードすれば？

230:Name_Not_Found
20/02/01 14:45:21.22 .net
>>223
設計思想

231:Name_Not_Found
20/02/03 02:11:47 .net
const fizzBuzz = () => {
for (var i = 1; i < 101; i++) {
switch (true) {
case i % 3 === 0 && i % 5 === 0:
console.log('FizzBuzz');
break;
case i % 5 === 0:
console.log('Buzz');
break;
case i % 3 === 0:
console.log('Fizz');
break;
default:
console.log(i);

}
}
}
fizzBuzz();

fizzbuzzをやろうとして、自分は↑を書いたんですが
これとくに問題ないですか？
調べてみると賛否両論(switchのtrueの箇所?)がどうのでてきて不安になり質問しました。

232:Name_Not_Found
20/02/03 05:10:20.27 .net
賛否両論と知ってるくせにとくに問題ないですか？と聞ける精神が問題だ
ここはお前の漠然とした不安をケアする場所ではない
自分の行動くらい自分で責任を持って決めろ

233:Name_Not_Found
20/02/03 08:27:46 .net
>>200や>>220もそうだが、複数の選択肢がある時、彼らは唯一解しか満足しない
「一概にはいえない」や「前提条件次第」という考えは彼らの頭にはない
一つの解にして、他を考えるのを止めるのが目的だから、考える過程が増えるのは彼らにとっては本末転倒なのだ

234:Name_Not_Found
20/02/03 12:41:20 .net
というか適当に質問してるということが丸わかり
自分で難しい質問をして難しい答えが帰ってきても反応しないんだもの
実際困ってもいないくせに人の反応を見るために質問したりするイカレポンタンは害悪でしかない

235:Name_Not_Found
20/02/03 13:02:51 .net
なんで問題ないかわからないんだろお前等
答えられないんだろ？

236:Name_Not_Found
20/02/03 13:35:16 .net
>>234
正解

237:Name_Not_Found
20/02/03 14:15:28 .net
>>231
そもそもお前(ら)が何を問題とするかだ

コーディング規約でswitch(true)禁止等があるチーム開発でそれを無視して使用している、等なら無視している時点で問題になるだろうが、こんな個人のメモ書き程度のFizzBuzzで何を使おうが問題にならんと思うが。

switch(true)自体の機能に疑問があるという話なら、まずは関数化していろいろな入力を試すなどしてデバッグし、それでも疑問が残ったり問題が顕在化したら他者に協力を仰げ。

賛否両論がどうの、程度ではなく自分でもっとしっかり読んで理解しろ。
なんの記事を読んんだのかは知らんが、それすら理解していないお前が、このスレの人間に「問題無い」と断言されたとしてただ鵜呑みにするのか？

賛否両論であるということを認識した上で、それでもなお利用するのなら、なぜそれを利用する必要があったのか説明できるようにしろ。

238:Name_Not_Found
20/02/03 22:29:21.31 .net
>>235
何が問題かを決めるのは他人ではない
俺たちはお前のオカンやオトンではない

239:Name_Not_Found
20/02/04 00:39:36 .net
屁理屈ばかりで理由の一つも論理的に言い返してる人いないやんw

240:Name_Not_Found
20/02/04 01:29:20.77 .net
どいつもこいつもどこから突っ込んでいいのやらｗ

241:Name_Not_Found
20/02/04 04:04:27 .net
>>231
switch ( 式 ) {
case 値1: // 式の値が「値1」と一致した場合の処理
break;

case 値2: // 式の値が「値1」と一致した場合の処理
break;

default:
break;
}

普通、式には変数など、変動するものを使う。そして、case の方に定数。
君のは逆になってるから、変

それとコーディング規則では、
後で修正することも考えて、default: にも、break; を付けておく。
また、意思を明白にするために、fall-through, no-break のコメントも付ける

switch ( a ) {
case 10:
// break; fall-through, no-break
case 20:
break;

default:
break;
}

次ページ