JavaScript情報交換所(プログラミング既習者専用） [無断転載禁止]©2ch.net

**デフォルトの名無しさん** · 2015/12/07(月) 07:26:33.87

実際にJavaScriptを書いている人の情報交換所です。
プログラミング既習者専用です。初心者の方はご遠慮下さい。
玄人の方、歓迎致します。

**デフォルトの名無しさん** · 2017/01/01(日) 19:00:23.75

>>510を認めておいて何を小難しい解釈してるんだ？
読解力が足りない文盲はこれだから…

**デフォルトの名無しさん** · 2017/01/02(月) 00:16:58.11

>>521
いや、お前が馬鹿すぎるから、矛盾する2つ以上の状況が出てくるだけ。
それに気づいていない時点でちょっと引くレベルでバカじゃん。
さらに指摘されても気づいてないとか。
頭の中のおがくず一回入れ替えてきたら？クワガタの幼虫程度の知能にはなれるんじゃない？

**デフォルトの名無しさん** · 2017/01/03(火) 08:27:03.92

>>513
WebAPIじゃなくてRESTと言って。
WebAPIはJSから触れるAPIを指す言葉。

**デフォルトの名無しさん** · 2017/01/19(木) 22:43:27.75

クエリパラメータでURLを受けとってクエリパラメータを追加してそこの遷移するって危険？
画面Aで検索ボタン押す→画面Aのアドレスをクエリパラメータに追加して画面Bに遷移する
画面Bで検索を行い1つ選択して戻るボタンを押す→検索結果をパラメータにして画面Aに遷移する
こういう感じの入力支援機能を作りたいんだけど

**デフォルトの名無しさん** · 2017/01/20(金) 00:35:32.81

一つのページで上手く完結させたほうがきっと良い

**デフォルトの名無しさん** · 2017/01/20(金) 01:04:21.61

俺もそう思う。

**デフォルトの名無しさん** · 2017/01/29(日) 15:36:11.92

JavaScript ベスト・オブ・ザ・イヤー 2016
https://risingstars2016.js.org/ja/

JavaScriptコミュニティは日々進化しています。今日のトレンドも数か月後には陳腐化しているなんてことは日常茶飯事です。

2016年は終わってしまいましたが、何か重要なことを見逃したのではないかと感じているそこのあなた！ 2016年の主要なトレンドをおさらいして、そんな不安を払拭しちゃいましょう。

過去12か月に獲得された Github のスター数を比較して、2016年に支持を集めたプロジェクトを数値に基づいて評価していきます。

2015年はなんといっても React でした。そして、Flux 実装を席巻したのは Redux でしたね。 2016年、JavaScript の人気プロジェクトはどのようなものだったのでしょうか？

**デフォルトの名無しさん** · 2017/01/29(日) 18:44:38.75

スタートアップで作ってるメンバーは気楽でいいよね
10年後か20年後かに腐りきったフレームワークに依存した数多のシステムを保守する人が憐れ

**デフォルトの名無しさん** · 2017/03/25(土) 00:53:22.16

switch caseは嫌いだから
javascriptの時は配列で代用してるわ

switch (weather){
　case "快晴":
　　return "f.png";
　case "晴れ":
　　return "f.png";
　case "くもり":
　　return "c.png";
　case "雨":
　　return "r.png";

これより

Select =[
　"快晴" : f.png,
　"晴れ" : f.png,
　"くもり" : c.png,
　"雨" : r.png
]
Select(weather);

の方が見やすいやん

**デフォルトの名無しさん** · 2017/03/25(土) 00:54:36.43

switchなんて所詮はif文の連続の糖衣構文だからな
javascript連想配列でデフオルト値設定する時は
if(hoge[x]===undefined)一文を付け加えるだでオケ

あと、普通はswitch case文でやりそうな

hoge = [
　"快晴" : function(){　処理1　},
　"晴れ" : function(){　処理2　},
　"くもり" : function(){　処理3　},
　"雨" : function(){　処理4　}
]

hoge[weather]();

みたいのもよくやるわ
それくらいswitch case使いたくない

**デフォルトの名無しさん** · 2017/03/25(土) 01:04:50.07

突然マルチポスト？
http://echo.2ch.net/test/read.cgi/tech/1472426483/783-784

**デフォルトの名無しさん** · 2017/10/29(日) 07:37:41.42

>switchなんて所詮はif文の連続の糖衣構文だからな
mjd!?

むしろ>>529式の配列の糖衣構文だと思ってたわ
caseの記述順序がパホーマンスに影響するのか㌧クス、

**デフォルトの名無しさん** · 2017/10/29(日) 11:02:46.12

質問なのですが、HTML5のcanvas要素が1ページ内に1000個あり、
それらに対してgetImageData()とputImageData()を周期的に行わねばならないとして、
　(1) 「canvas iを処理するタイマイベントi」を1000個起こす
　(2) タイマイベント1個の中でcanvas 1～1000を処理する
という2種類の実装方法の間でブラウザのレンダリング回数に違いは生じますか？
やっぱ(2)の方がパホーマンス上目に見えて有利？

**デフォルトの名無しさん** · 2017/10/29(日) 12:15:24.08

>>533
(2)の方が効率的だと思うが、掲示されてない条件もありそうだし、速度は実装依存なので、実測するのが原則
複数のブラウザで実測するといい

**デフォルトの名無しさん** · 2017/10/29(日) 12:35:01.00

requestIdleCallback内で可能な個数だけを処理するのがいいと思うよ

**デフォルトの名無しさん** · 2017/10/29(日) 12:48:10.75

タイマイベント自体はどの程度の周期で発生するんだろ
短ければ短い程良いって感じなのかな

**デフォルトの名無しさん** · 2017/10/29(日) 18:50:15.75

1000個、というのが疑念（更新が間に合わない場合を含んでいるのでは等）を呼んでしまったようなので
質問を修正させていただきまする

Q1. canvas要素の書き換えは即座にブラウザの再レンダリングを招く？
　　それともハンドラが終了してからまとめて再レンダリングされるもの？
　　あるいはその他？（何か別のトリガーがある？）

Q2. ブラウザの再レンダリングがいつ起きたか直接的に確認する手段があればｷﾎﾞﾝ

なおハンドラ内で行うのはcanvas内容の参照と書き換えのみとします。
（明白に再レンダリングを招くoffsetTop/Left/Width/Height等、要素の配置座標に関わる参照や書き換えは含まない。）

**デフォルトの名無しさん** · 2017/10/29(日) 19:36:44.29

デバッガを使えば確認できる。基本的にディスプレイのリフレッシュ毎に一回。

**デフォルトの名無しさん** · 2017/10/29(日) 21:04:51.00

(2)の方法なら終了するまでレンダリングが起きようがない

**デフォルトの名無しさん** · 2018/02/16(金) 06:16:17.56

☆ 日本の、改憲を行いましょう。現在、衆議員と参議院の
両院で、改憲議員が３分の２を超えております。
『憲法改正国民投票法』、でググってみてください。国会の発議は
すでに可能です。平和は勝ち取るものです。お願い致します。☆☆

**デフォルトの名無しさん** · 2018/05/23(水) 21:23:56.11

僕の知り合いの知り合いができたパソコン一台でお金持ちになれるやり方
役に立つかもしれません
グーグルで検索するといいかも『ネットで稼ぐ方法　モニアレフヌノ』

5PLLK

**デフォルトの名無しさん** · 2018/07/05(木) 00:34:01.49

4HA

**デフォルトの名無しさん** · 2019/03/09(土) 13:19:47.50

受託の人たちでPWA対応って結構ある？

**デフォルトの名無しさん** · 2020/05/04(月) 16:17:26.83

「Objectオブジェクトは、すべてのオブジェクトの基本オブジェクトである」

↑これJavaScriptのある本に書いてあったのだけど、どういうこと？(ﾜﾗ

**デフォルトの名無しさん** · 2020/05/04(月) 22:21:44.35

>>544
そのまんまだろ
基本→基底でもいいが
C#のObjectと同じ立ち位置ということ

それで分からないのなら、無視でいい
アップキャストとか考える必要のある言語でもないし、どうせ使わない
他の静的型あり言語同様、全ての型は別物、と考えていても特段問題はない
プログラミング言語なんて「知識」よりも「技能」に近いから、分からないなら分からないなりに進めばいいだけ

元の書き方でも十分分かりやすい
それで分からないのは君がオブジェクト指向を理解出来てないからだが、
どのみち無視でいい

**デフォルトの名無しさん** · 2020/05/04(月) 22:38:13.60

いやJavaはひととおりマスターしたから
オブジェクト指向はバッチリ理解している。

JavaScriptは気持ち悪いことが多すぎる。関数が変数に代入できることとか。
まるで物理で光が粒でもあるし波でもあるという二重性のことを習ったときのように頭が混乱する。

このへんの考え方について詳しくコツを教えていただけませんか？

**デフォルトの名無しさん** · 2020/05/04(月) 22:39:31.98

Javaは体系的にスッキリしてるから実に分かりやすい。
この気持ち悪いJavaScriptは何なの？

**デフォルトの名無しさん** · 2020/05/04(月) 22:52:19.81

オブジェクト指向の理解とは関係ないJavaScript固有の話だと思うがな。
前半部分は"Object"という名前のオブジェクトがグローバルに存在するということに
想像が及ばないと理解しづらいだろうし、後半は「基本オブジェクト」というwell-definedでない
言葉で説明しているが、これもオブジェクトが他のオブジェクトのプロパティを継承する
prototype継承を知らなければこの文章だけからは理解しにくいだろう。

**デフォルトの名無しさん** · 2020/05/05(火) 00:28:49.85

>>546
> 関数が変数に代入できることとか。
Javaも出来るようになっただろ
というかメジャー言語で出来なかったのはJavaだけで、それ以外の言語は全部出来てる
Cでもだ
コツ？そりゃお前が何も知らない馬鹿だとちゃんと自覚することだよ
他言語少しでもかじってれば、そんなところで引っかかることはない
(ただしJavaの連中はこのタイプ＝他言語なんて全く知らない馬鹿も多いとは聞くが）

>>548
そうか？こいつは分かったつもりの馬鹿だと思うぞ
確認したが、JavaもObjectクラスあるし、使い方としてはJavaのObjectとも同じ立ち位置だ
> クラス ArrayList<E>
> java.lang.Object
> java.util.AbstractCollection<E>
> java.util.AbstractList<E>
> java.util.ArrayList<E>
> https://docs.oracle.com/javase/jp/7/api/java/util/ArrayList.html
これを
> 「Objectオブジェクトは、すべてのオブジェクトの基本オブジェクトである」
と表現されて理解出来てないのだから、Javaもオブジェクト指向も分かってない馬鹿だよ
この部分はまだプロトタイプベースがどうとか以前の問題だ

まあ正直俺はプロトタイプベースに大して戸惑わなかったし、
今でもプロトタイプベースの方がクラスベースより表現範囲が広いので良いと思ってる
そしてこいつはいわゆる「クラス脳」で永遠とプロトタイプベースを理解出来ないのだろう
といっても実際にプロトタイプベースでないと組めないような事をするのは希だし、
クラス脳の為にクラス構文も入ったので、別段問題でもないけど

**デフォルトの名無しさん** · 2020/05/05(火) 02:37:44.95

class Abc
end

多くの言語では、このように継承元を書かずに、クラスを定義した場合は、
Object クラスから直接継承したとみなされる

普通は、継承チェーンを遡ると、Object クラスに突き当たる。
すべてのクラスの祖先

この板のJavaScript のスレは、荒らし対策で緊急避難用に作られたもの。
web 制作管理板のスレへ書き込んだ方がよい

こちらには、荒らししかいない

荒らしは必ず、2回書き込む。
自分のレスに、リンクを付けて「そうだよな」みたいに自演する

多くの人が言ってるように見せかける。
午前、3時とかでも、同時に2つのレスを書くw

**デフォルトの名無しさん** · 2020/05/05(火) 02:42:45.62

ほとんどの言語で、関数も変数に代入できる。
別名みたいなもの。Functor

変数 = f
変数 = f( )

上は、関数の代入で、
下は、関数の呼び出し

( ) が、関数呼び出し演算子

**デフォルトの名無しさん** · 2020/05/05(火) 10:37:45.75

>>550
Web制作板確認したが、相変わらずだな
まあ俺はこのレベルの馬鹿を引き取ってくれることには大賛成だから、どうぞよろしく、でしかないが

**549** · 2020/05/05(火) 10:39:12.27

>>548
お前もprototype継承を特別視過ぎ

> 前半部分は"Object"という名前のオブジェクトがグローバルに存在するということに想像が及ばないと理解しづらいだろうし、
Javaにも全く同じ立ち位置のObjectが存在してる
Javaを知らないか、知っててピンと来ない＝単なる馬鹿か

> 後半は「基本オブジェクト」というwell-definedでない言葉で説明しているが
C#でも全く同じ表現だ
> Object クラス
> これは、全 .NET クラスの基本クラスであり、型階層のルートです。
> https://docs.microsoft.com/ja-jp/dotnet/api/system.object?view=netcore-3.1
prototypeベースだからクラスではなくオブジェクトとなっている
だからこの表現で正しいんだよ

> オブジェクト指向の理解とは関係ないJavaScript固有の話だと思うがな。
これもダウト
> 多くの言語では、このように継承元を書かずに、クラスを定義した場合は、Object クラスから直接継承したとみなされる (550)
ホントかよ、と思ったが、少なくともJavaとC#ではそうなるようだ(JavaScriptもだが）
これは本来は言語ではなくフレームワークの仕様であり、C++はそうなのだが、
少なくともJavaとC#は最初からオブジェクト指向大前提（のフレームワークを使う前提）でしか使えない仕様らしい
が、それはさておき、全ての型のルートを持ってボックス化出来るようになっており、それを利用する、というのは、
典型的なオブジェクト指向の使い方であって、JavaScript固有の話でも何でもない
というか、むしろ、JavaScript固有の話なんて何もない
prototypeも別にJavaScriptが発明したものでもない
初見だとそれなりに戸惑う、というだけ
ただしJavaScriptのオブジェクト指向なんてJava/C#のオブジェクト指向からすると全く使い物にならない物だし、
実際にボックス化やアップ/ダウンキャスト等を考える必要なんてほぼ無いだろ

お前自身もオブジェクト指向を正しく理解出来てないのだと思うぜ

**デフォルトの名無しさん** · 2020/05/05(火) 10:56:56.68

「Objectオブジェクト」といきなり言われて、それがJavaのObjectクラスのようなものと
想像できなくても別に不思議はないかと。

**デフォルトの名無しさん** · 2020/05/05(火) 11:16:54.06

>>554
ねえよ
俺はそれは単なる馬鹿だとしか認識しない
少なくともこの馬鹿はJavaもオブジェクト指向もマスターしてるつもりなんだぜ

自分が何も知らないことを自覚できず、
> (ﾜﾗ
とかやってるから馬鹿のままなんだよ
こいつは既に老害化してる
JavaですらJava8(2014)から関数ポインタを使えるようになってる
こいつはこのことすら知らない
といっても実際Java界隈なんてその程度だとは思うが

オブジェクト指向を利用してコードを共通化しようとすると、どうしても
C++のように型消去するか、
JavaやC#やJavaScriptのObjectのような型階層のルートが必要になってくる
これらの言語で全てそれが「Object」という名前で統一されているのは偶然ではない
オブジェクト指向(＝ObjectOriented)のルートだからObjectなんだよ
今時のメジャー言語は全てオブジェクト指向出来るようになってるし、
逆に、「Object」とかいう物が出てきたら、これか！とピンと来ない方がおかしい

つっても重ねて言うが、Javaの連中なんてその程度なのも事実だが

**デフォルトの名無しさん** · 2020/05/05(火) 11:26:22.49

>>555
関数ポインタと参照は違うって知ってる？

**デフォルトの名無しさん** · 2020/05/05(火) 11:39:37.07

>>556
勿論知ってるぞ

Javaのが「関数ポインタ」ではなく「関数参照」だというのならそうなのだろう
見て分かるとおり、俺はJavaは使ってないからその辺は正確ではない

ただぶっちゃけ、ポインタと参照はほぼ等価だし、
C++のようにそれらが別物だと明示的な言語以外では混同してても全く問題ないと思うが
実際、JavaScriptにおいて「参照」を「ポインタ」と言い換えても何ら問題ないだろ

どう見ても俺の揚げ足取りをしようとしているように見えるが、
それが価値あると思うなら頑張ってどうぞ
ただし俺は馬鹿と話す意味はないと見たらすぐ降りる
その場合はお前の勝ちでいい

んで、関数ポインタと参照の違いを知っているお前は、どんな素晴らしい知見を披露してくれるの？
是非よろしく

**デフォルトの名無しさん** · 2020/05/05(火) 11:48:55.80

> 実際、JavaScriptにおいて「参照」を「ポインタ」と言い換えても何ら問題ないだろ

だめ。ポインタは数値で置き換えられるアドレスであり
ポインタはアドレス加算などの演算ができるもの
アドレス加算ができない以上それは参照であってポインタではない
そしてJavaで参照はずっと前からできる

**デフォルトの名無しさん** · 2020/05/05(火) 12:10:13.42

>>558
> そしてJavaで参照はずっと前からできる
Java8で新しく出来るようになったのは、『関数』参照な
話をずらすな
そして>>546が理解出来てないのはこれだ

> ポインタはアドレス加算などの演算ができるもの
> アドレス加算ができない以上それは参照であってポインタではない
それはC++での定義な
RustやGoも「ポインタ」を扱えるが、こちらは最初から加算なんて出来ないようになっている（確か）
少なくともRustやGoの定義する「ポインタ」はそう

というか、C++の参照自体が「ポインタは危険なのでコンパイラ側で対策して『参照』と命名しました」でしかないし、
JavaやC#で言う参照も全くこれと同じなのだが、当然実体は「ポインタ」でしかなく、
当然関数呼び出しの引数にはまんま「ポインタ」が積まれる

というかそこら辺理解出来てないのはやっぱりJavaしか知らない馬鹿だからだ
ポインタと参照が実体は同じだ、ということを理解出来ないのも
（論理的な意味が違うだけで、物理的な意味や値は同じ）

いずれにしてもJavaってのはかなり簡素化された言語で、
コンピューターの実体（物理構造）を知らなくてもいいように出来ている
これ自体はいいことなのだが、
その程度の知識なのに「ポインタと参照は違う(ｷﾘｯ」とかやるのは間違ってる
自分の知識が全く足りてないことを認めて、きちんと学んだ方がいい
ポインタはCの鬼門だとされているが、現実として、ポインタを扱った方が動作効率が圧倒的によく、
結果的にJavaでもJavaScriptでも、或いは他言語でも、内部動作はポインタで作られているので、
どうしてこういう動きをするのか、どうしてこういう仕様なのか、を理解するのは、ポインタの理解が不可欠だ
ある程度以上のプログラマになる為には、ポインタの理解から逃げているようでは無理だ
これが逆にJavaプログラマが相変わらず糞な遠因でもある

**デフォルトの名無しさん** · 2020/05/07(木) 13:23:56.11

>>546
> いやJavaはひととおりマスターしたから
> オブジェクト指向はバッチリ理解している。

>547
> Javaは体系的にスッキリしてるから実に分かりやすい。

プログラミング言語をJavaしか使ったことないJavaおじさんか？

**デフォルトの名無しさん** · 2020/05/07(木) 22:35:41.72

>>560
この話題を続ける意味もないと思うが

Javaおじさんですらないはず
多分Java若者馬鹿老害

Java8で関数ポインタが導入された為、
それ以前に完全にJava7をマスターしている「Javaおじさん」なら導入するかどうかの大議論をしているはず
少なくともJavaの一線で働いている奴が知識を6年間もupdateしてないとは考えづらい
使ったことが無くても、また、（コーディングルール上）職場で使えないとしても、全く知らないというのはない（と思いたい）
そしてオブジェクト指向への理解も皆無だ、これは「Javaおじさん」ならあり得ない

最近の若者はプログラミング言語の選択肢が多く、若干戸惑っているように思える
ぶっちゃけ最初の最初の言語なんてどれでも大差ないのだが、「僕が選んで学んだ言語すごい＝僕すごい」をやる奴が多すぎる
こいつも何らかの理由でJavaを選択し、「Javaすごい」とポジショントークをしているだけ
おそらく年齢は20代、プログラミング言語はJavaしか知らず、Java7の本でJavaを勉強した人だ
ただこの時点でこの老害っぷりは酷い
一応言っておくが、年齢ではなく、自分の考え方が絶対に正しいと固執し始めると老害になる
546はもうちょっと真摯にプログラミングをした方がいい

ただしJavaがスッキリ、というか、簡単なのは事実だ
だから大受けした
そしてPythonの方がもっと簡単だから、もっと大受けしつつあるだけ

ただ現実問題として、JavaScriptのオブジェクト指向なんてどうせ使い物にならないから、無視でいい
しかしまた現実として、今現在のシェアはJavaScript>Javaなのだから、
どうしてそうなったのかが理解出来ないうちは「Javaすごい＝僕すごい」みたいな幼稚な考え方は止めた方がいい
Java自体が凄かったのも事実だが、それも過去になりつつある

**デフォルトの名無しさん** · 2020/05/12(火) 13:08:44.44

'(シングルクウォーテーション)と"(ダブルクウォーテーション)の使い分けに悩みます。
悩みを消しこれだと自信を持って使う考え方はありますか？
どっちを使ってもいい場合とどちらか限定の使い方があるので気持ち悪いですw

**デフォルトの名無しさん** · 2020/05/12(火) 13:33:40.94

>>562
シェルスクリプトだと、'と"とは、展開の有無等であきらかに異なるから、
それにしたがって使い分ける。

どちらも同じって場合は、文字列に空白が含まれる場合や入れ子になる場合に"を使って、
その他、基本的には'でくくってる。
jsやpythonなんかがこれに該当。

"しか使えないバッチファイルは文句なしに"。
ただし、*nix由来のプログラムの場合、オプション内部で'を入れ子で使うことがある。

こんな感じ？

**デフォルトの名無しさん** · 2020/05/13(水) 06:16:03.92

VSCode のデフォルトが、Beautify だろ。
拡張機能のPrettier とか

'・" かどうかは、これらの設定で変わる

HTML の属性が、" で囲むから、それらの文字列をさらに囲むには、' を使う

JavaScript の話は、web 制作管理板の方で聞いてください！
この板には、あまり人がいないから

**質問者** · 2020/05/13(水) 13:14:18.33

こちらで良いかわかりませんが、
・web上でモニタリングをしたい
・10秒ごとに自動更新
・固定htmlに要素を用意。javascriptで変数を持ち、値によって要素の画像を切り替える。
getElementById(*).src=****
setTimeout(this,10000)
これをサーバーに置いて10人くらいがアクセスしたら、サーバーの負荷はどうでしょうか？
画像切り替えるときにサーバーにアクセスするので、やはりだめでしょうか？
わかる方いましたらお願いいたします。

**デフォルトの名無しさん** · 2020/05/13(水) 13:59:35.07

数枚程度なら、すべての画像を送ってしまって、
ブラウザ側で、スライダーなどで切り替える

Google map みたいに、無数の画像があるなら、
ajax でサーバー側にアクセスして、必要な画像を送ってもらう

JavaScript の話は、web 制作管理板の方で聞いてください！
この板には、あまり人がいないから

**デフォルトの名無しさん** · 2020/05/13(水) 14:02:19.06

>>565
いろいろイミフ

>・web上でモニタリングをしたい
誰が何をどうやってモニタリングするの？

>・10秒ごとに自動更新
何を更新するの？

>これをサーバーに置いて10人くらいがアクセスしたら、サーバーの負荷はどうでしょうか？
クライアント側JavaScriptの話でサーバー負荷とどう関係があるの？

**デフォルトの名無しさん** · 2020/05/13(水) 14:12:08.64

>>563
そうざますかありがとう
どっちみち慣れないうちは混乱しますね
JSだけのエンジニアなら当然その人の哲学や宗教により迷わず判断してると思うけど
こっちはJSは片手間でやっててさわるのが数年ぶりということがあるから混乱しますわ

**デフォルトの名無しさん** · 2020/05/13(水) 14:14:46.69

何の要素か知らんが、
「cssで作るスライドショー」とかでググったら答えが落ちてそう

**デフォルトの名無しさん** · 2020/05/13(水) 14:21:07.89

>>568
自分で決められないならとりあえずビッグネームのstyle guideに従っとけばいい

JavaScript =>single quote
HTML => double quote
CSS => single quote
https://google.github.io/styleguide/jsguide.html#features-strings-use-single-quotes
https://google.github.io/styleguide/htmlcssguide.html#HTML_Quotation_Marks
https://google.github.io/styleguide/htmlcssguide.html#CSS_Quotation_Marks

**質問者** · 2020/05/13(水) 15:12:19.72

>>566
ありがとうございます。

>>567

>>・web上でモニタリングをしたい
>誰が何をどうやってモニタリングするの？

やりたい事は、100個のセンサや機械の情報をブラウザ上にリアルタイムで表示して、異常ならば、ブラウザを見てる人に通知したいということです。

>・10秒ごとに自動更新
センサーや機械の情報です。

>>これをサーバーに置いて10人くらいがアクセスしたら、サーバーの負荷はどうでしょうか？
>クライアント側JavaScriptの話でサーバー負荷とどう関係があるの？

javascriptで動的にイメージ画像を切り替えたら、結局サーバーにアクセスすることになってしまうのではと思ったのです。
画像イメージはサーバー上に置かれているので。一回アクセスしたらキャッシュされるかもしれませんが。

>>569
ありがとうございます。

**デフォルトの名無しさん** · 2020/05/13(水) 15:52:15.36

>>571
なるほど

サーバー側のセンサーや機械の状態更新を
クライアントからのアクセスによってトリガーする仕組みだと不味いけど
そうじゃなくてサーバー側ですでに存在してるデータに対して
10人くらいが数秒に1回アクセスするんなら
その負荷は微々たるものだよ

各状態に応じた画像は
最初にモニタリング用画面にアクセスした時に全部ダウンロードさせておいて
数秒に1回AJAXでサーバー側の状態のみ取得してその値によって画面表示を切り替えればいい

**質問者** · 2020/05/13(水) 16:03:47.03

>>572
そうです。

>最初にモニタリング用画面にアクセスした時に全部ダウンロードさせておいて

この技術がわかりません。何をキーワードにして調べれば良いのでしょうか、すみませんが、お願いいたします。

**質問者** · 2020/05/13(水) 16:51:28.10

すみません。解決しました。
最初にリロードしたときに正常な画像だけでなく、異常な画像もリンク(表示しない)しておけばよいのですね。
そうしておけばブラウザ側にキャッシュされるので。

**デフォルトの名無しさん** · 2020/05/13(水) 17:25:36.80

>>574
いろいろ方法あるけど一番堅いのはCSSスプライト
https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Images/Implementing_image_sprites_in_CSS

他には
- visibility: hidden
- JavaScriptでページロード時に画像を読み込む
- 凡例として異常時の画像も一つ表示しておく
など

この辺の話はJSのプログラミングの話じゃないので
誰か書いてたけどweb制作板で聞いたほうがいいかも

**質問者** · 2020/05/13(水) 17:50:05.96

>>575

本当にいろいろとありがとうございました。

**564** · 2020/05/13(水) 18:01:05.87

>>568

>>564
にも書いたけど、

VSCode のデフォルトが、Beautify で、拡張機能のPrettier が有名

Ruby on Rails で有名な、Airbnb などのStyle Guide だろ

**デフォルトの名無しさん** · 2020/05/13(水) 18:09:08.10

>>571
>画像イメージはサーバー上に置かれているので。一回アクセスしたらキャッシュされるかもしれません
確かに、同じファイルパスなら、キャッシュを使う

データは、ajax で、JSON でやりとりすることが定番

**質問者** · 2020/05/14(木) 00:27:54.68

>>578

はい、ありがとうございます。

**デフォルトの名無しさん** · 2020/06/20(土) 11:09:53.20

できる訳ないだろうなと思いつつ聞くんだけど、javascriptでローカルのファイルを別のディレクトリに移動させたりすることってできる？

**デフォルトの名無しさん** · 2020/06/20(土) 13:24:24.10

つNode

**デフォルトの名無しさん** · 2020/06/20(土) 13:27:05.74

つcscript/wscript

**デフォルトの名無しさん** · 2020/06/20(土) 20:45:20.50

>>581
これはサーバサイドでjs書いたときの話だもんね

ユーザーがブラウザ操作してる時に動くブラウザ上のjsでファイル操作がしたいんだよなあ
そんなこと出来たらやべーからまあ無理なんだろうけど、なんか代わりの手段ないものか

**デフォルトの名無しさん** · 2020/06/20(土) 21:17:03.49

>>583
プラットフォームとしてブラウザが欲しいのなら electron = chromium + node がそれだろ。
代表アプリはatomとVSCode。
サイトのJSでユーザーのローカルファイルを弄りたいというのなら、それが出来るようなら困るだろ。

**デフォルトの名無しさん** · 2020/06/20(土) 21:21:46.31

>>583
あと、今現在使っていいか、使えるか、というのはあるが、技術的にはActiveX。
wiki読めば大体分かるはず。

**デフォルトの名無しさん** · 2020/06/29(月) 12:03:45.83

うんち

**デフォルトの名無しさん** · 2020/06/29(月) 12:04:05.78

htmlタグに書くonclick=の中には
JSの処理を直接書くこともfunction(){}と書いてその中に処理を書くことも、どちらもokですか？その違いはありますか？

**デフォルトの名無しさん** · 2020/06/29(月) 12:07:23.28

onclick=のあと関数名(関数が入った変数)を書く場合は()は書かないほうがいいですか？書くべきですか？

<button onclick='unko'> or <button onclick='unko()'>

unko=function(){
alert('unko!');
}

みたいなときです。

**デフォルトの名無しさん** · 2020/06/29(月) 12:51:41.62

最初に喧嘩売ってきてわろた

**デフォルトの名無しさん** · 2020/06/29(月) 12:54:40.10

>>587
こういう感じで、直接内容も書けるみたい

on@click='con@sole.log("abc")'

注意！書き込めないため、@ を入れました

>>588
on@click='unko()'

みたいに、すべて( ) が付いている

それと、JavaScript の質問は、web制作管理板の方へ書き込んでください！

こちらの板は、web制作管理板が荒らしに荒らされた時に、
緊急避難的に立てられたものだから、今は使われていない

**デフォルトの名無しさん** · 2020/06/29(月) 21:14:29.05

>>586-588
オムツがまだ取れてなくてウンコ臭い初心者はWeb板へ
何度も言われていることだが

それ以前にお前レベルの超超超超初心者はそもそもここ(5ch)に来るべきではない
各自が勝手に意見を言ってるだけだから、それなりの確率で間違いや勘違いはどうしても発生する
それを自分で修正する能力がないうちは、5chを使うのは止めた方がいい
超超超超初心者なら、少なくとも間違っていたら訂正してもらえる場所、
つまり本か信頼出来るWebサイトを参考にするべきだ

なお俺はお前みたいなウンコお漏らし初心者用の本やサイトは知らない
というか、そんな、始めて3時間で通過するレベルの事柄を、ネットで質問しようとすること自体、かなり頭がおかしい
少なくともお前はプログラマには向いてないし、間違って就職しても浮きまくって仲間に入れず不幸な人生になるから止めとけ
それを教えてもらいたければ、「1週間の集中講座ででWebページ開設出来ます！」みたいなセミナーとかに行け
JavaScriptの部を始めて10分後にはそれについて教えてくれるだろう

**デフォルトの名無しさん** · 2020/06/30(火) 01:12:09.33

>>551
通りすがりだけどソレみて長年のモヤモヤがはれました、ありがとう。

**デフォルトの名無しさん** · 2020/07/23(木) 00:01:42.43

$("div").click(function())

**デフォルトの名無しさん** · 2020/07/23(木) 00:02:03.83

$("div").click(function(){
})

**デフォルトの名無しさん** · 2020/07/23(木) 00:05:54.40

$("div").click(function(){
$(this).css('background','red');
})

のこの$(this)が$("div")を指す理由はなんですか？
Javaではthisというのはそれを定義したクラスのインスタンスを指すと習いましたが。

**デフォルトの名無しさん** · 2020/07/23(木) 00:38:57.14

jQuery, Haxe のthis は、JavaScript/TypeScript のthis とは異なる。
this がwindow を指したり、おかしな部分があるので、それを変えている

それと、JavaScript の質問は、web制作管理板の方へ書き込んでください！

こちらの板は、web制作管理板が荒らしに荒らされた時に、
緊急避難的に立てられたものだから、今は使われていない

**デフォルトの名無しさん** · 2020/07/23(木) 07:12:59.16

>>596
「おかしな部分があるので、それを変えている」とは？

**デフォルトの名無しさん** · 2020/07/23(木) 07:13:47.98

thisの正体を見分けるコツはないですか？

**デフォルトの名無しさん** · 2020/07/23(木) 07:32:15.26

>>595
> のこの$(this)が$("div")を指す理由はなんですか？

DOM APIとの互換性

例えば、これのイベントハンドラの中身を書き換えるならば
$("div").click(function(){
　　$(this).css('background','red');
})

このようになる。（おまけで引数のjQuery eventを追加）
$("div").click(function(event){
　　this.style.background = 'red';
})

このイベントハンドラ（function）はDOM APIと互換性があるので全く同じように使える。
（引数のeventはjQuery eventではなくDOM APIの eventだがある程度の互換性がある）
divElement.addEventListener('click', unction(event){
　　this.style.background = 'red';
})

つまりイベントハンドラをDOM APIのものと互換性があるようにしているのが理由
そうすることで、コードを相互に変換しやすくなる。
例えば後からjQuery化するときなど少しずつ移植できる。

**デフォルトの名無しさん** · 2020/07/23(木) 07:36:27.79

>>598
thisは実行時に変わるからコードを見てもわからない
つまり呼び出されているコードを見てもわからない。
「誰が呼び出しているか？」を知る必要がある。

同じthisであっても「あれ」に登録して「あれ」から
呼び出されれば「それ」とは違うthisの場合がある。

だからthisが何かは仕様を調べるしかない
関数の引数にobjが入ってる場合、このobjの正体はなんですか？と
言ってるのと同じ質問だよ

**デフォルトの名無しさん** · 2020/07/23(木) 07:39:49.30

>595
Javaではthisを変えられることができないが
JavaScriptはthisは呼び出し側で与えるオブジェクト
JavaScriptだけではなくRubyやPerlなどいくつかの言語は呼び出し側でthisを変更できる

**デフォルトの名無しさん** · 2020/07/23(木) 08:18:34.22

>>599-601
ありがとうございます。
深いですね。
まだちゃんと理解できてないですが
ゆっくり吟味して考えてみます。

**デフォルトの名無しさん** · 2020/07/23(木) 08:20:56.24

this=eventとなっているということかな？

**デフォルトの名無しさん** · 2020/07/23(木) 08:24:35.38

>>603
違うぞ。eventはおまけ。thisの話とは直接関係ない

**デフォルトの名無しさん** · 2020/07/23(木) 08:25:10.27

ようするにjQueryはブラウザ標準のDOM APIと
互換性をもたせて作られているということ

**デフォルトの名無しさん** · 2020/07/23(木) 20:38:07.50

>>598
ID:/b5pS+w+ の言っていることは全面的に正しいが、補足すると、
> thisの正体を見分けるコツはないですか？
こんな事を言っている時点で糞サイト（或いはゴミ本）に騙されているから止めとけ。
見分ける必然性も意味もない。単なる暗黙の引数程度でしかなく、
実際にそれなりに組織的にコーディングするとcallはそれなりに使う。

DOM APIのthisがe.currentTargetを指すのはそもそもJava用の仕様、
つまりJavaでもクライアントスクリプトを書けるようにする為の仕様らしい。（とここ5chで聞いた）
しかし現在はJavaで書く奴なんて一人もいないし、JavaScriptにおいてはe.targetを全面的に使うのが正しい。
理由は、
1. thisにはe.currentTargetが入っているが、マトモなサイトなら通常はbubbleを利用する為、e.target主体で書くことになる。
　つまりこの仕様のthisでは使い物にならない。
2. e.currentTragetで役に立つ場合は、Elementに直接onXXXかaddEventListenerした場合だが、
　こんな事をやっているのはjQueryを使っている程度の簡単なサイトだけ。
　やれば分かるがbubbleを利用した方が実行効率もよく、コードも綺麗になるから、マトモなサイトは全部そうしてる。
　ただし、Elementに直接貼った方が直感的で分かりやすいので、jQueryのような簡単/初心者向けの場合には活用される。
　(なおjQueryでもbubble主体で書くことは可能ではあるが、それをやるとjQueryの意味がほぼ無くなるので普通はやってないと思う）

**デフォルトの名無しさん** · 2020/07/23(木) 20:39:00.72

3. それなりに組織的にコーディングすると、どうしてもイベントハンドラで共通の関数を使いたい要求が出てくる。
　しかしイベントハンドラだとthisがe.currentTargetによって潰されているので、共通関数をクロージャ（最終段はグローバル）で掴むしかないが、
　クロージャはクローズ(追加不能だしコード配置が限定される＝C++で言うクラスはクローズ、namespaceはオープンと同じ意味のクローズ）ので、
　現実的には使いにくく、俺はイベントハンドラを集めたオブジェクト（その中に共通関数も入っている）をthisとしてcallし直して、
　イベントハンドラ内ではthis.my_sub_function()で共通関数を呼べるようにしている。
　この場合、thisは単なるオブジェクトなので、継承出来るのがいい。(共通関数の共通関数を__proto__側に追い出せる）
　どうせthisが使い物にならない仕様なので他の連中も同様にやっているとは思う。

なお俺はjQuery不要派だがjQuery自体は初心者には分かりやすく偉大だと思っている。
実際にjQueryを使っていて問題ないのなら使うこと自体も悪いことではない。
ただしそれは世の中のマトモなサイト≒ガチのプログラマーが本気で書いたサイトではほぼ使われていない手法だということも理解しておいた方がいい。
といっても今の君には分からないだろうが、イベントハンドラ内でthisをe.currentTargetとして利用することはガチのサイトではほぼ無い、ということ。
今はどうせ何も分かってない状態なんだろうから、それならイベントハンドラ内ではthisを使わずe.currentTargetを使う癖を付けた方が多分いい。
それ以前にbubbleを使うようにした方がいいが。

**デフォルトの名無しさん** · 2020/07/23(木) 20:41:48.09

といっても多分さっぱり何がなにやら、だと思うが、そういうものだと思っておいてくれ。
質問の質問を受けていたら話が進まないのでそれは断る。

**デフォルトの名無しさん** · 2020/07/23(木) 21:58:10.24

>>606
> 　(なおjQueryでもbubble主体で書くことは可能ではあるが、それをやるとjQueryの意味がほぼ無くなるので普通はやってないと思う）

イベントのキャプチャフェーズとバブリングフェーズの話をしてるなら
jQueryはバブリングフェーズしか対応してません
jQueryの意味がなくなる？なぜですか？

そもそもIE8以前がキャプチャフェーズに対応してないので
それ以前からあるjQueryでは実装が不可能です。
（jQuery 4.0では実装されるらしい）

間違ったことを書かないでください

**デフォルトの名無しさん** · 2020/07/23(木) 22:00:14.35

>>607
>　現実的には使いにくく、俺はイベントハンドラを集めたオブジェクト（その中に共通関数も入っている）をthisとしてcallし直して、
>　イベントハンドラ内ではthis.my_sub_function()で共通関数を呼べるようにしている。
>　この場合、thisは単なるオブジェクトなので、継承出来るのがいい。(共通関数の共通関数を__proto__側に追い出せる）

やめましょう。無関係のイベントハンドラをまとめることは
単一責任の原則に違反しています。

**デフォルトの名無しさん** · 2020/07/23(木) 22:01:00.61

>>607
> イベントハンドラ内でthisをe.currentTargetとして利用することはガチのサイトではほぼ無い、ということ。
いいえ。殆どがthisを使っています。e.currentTargetは冗長なだけです。

**デフォルトの名無しさん** · 2020/07/23(木) 22:41:43.25

>>606
> DOM APIのthisがe.currentTargetを指すのはそもそもJava用の仕様、
> つまりJavaでもクライアントスクリプトを書けるようにする為の仕様らしい。（とここ5chで聞いた）

逆です。Javaではe.currentTargetを使い、thisは使えません。
（当時の）Javaでは言語仕様上の制限でイベントハンドラとして関数を使用することはできません。
イベントハンドラはオブジェクトである必要があります。

イベントハンドラ自体がオブジェクトであるため、thisはイベントハンドラオブジェクトになります。
そのためJavaでthisは使えません。

また昔のIEはaddEventListnerがなくattachEventを使いますが。
attachEventの場合thisはwindowでありe.currentTargetではありません。
つまり初期のIEのDOM APIはもちろんJavaでも使えますが
event.srcElement（e.currentTarget相当）しか実装されてないということです。
thisがe.currentTargetなのはJavaScriptのために作られた仕様です。

**デフォルトの名無しさん** · 2020/07/23(木) 22:44:12.81

>>606
> JavaScriptにおいてはe.targetを全面的に使うのが正しい。
いいえ。e.targetは廃止されてます。
https://developer.mozilla.org/ja/docs/Web/API/Event/target

わざと正反対のことを書いてるんですかね？

**デフォルトの名無しさん** · 2020/07/23(木) 22:47:04.66

>>609
キャプチャフェーズの話はしてない。
なお俺の判断では、キャプチャフェーズは余程のパッチ当て以外では使うべきではない。
あれは使わないでも十分組めるし、そもそもキャプチャフェーズを使わなければならないシチュエーションがまるでない。
だから俺は何であの仕様が入れられたのか不明なのだが、君はそれが分かるか？
具体的に、キャプチャフェーズのユースケースを知りたい。

> jQueryの意味がなくなる？なぜですか？
jQueryは基本的に
queryしたElementに何か(この場合はイベント追加)するのを宣言スタイルで短く分かりやすく書けるのが売りだろ。
バブル主体で書くとそもそもqueryしないから、jQueryを使う意味がないんだよ。
それはやれば分かる。分からないのはやってないからでしかない。

> やめましょう。無関係のイベントハンドラをまとめることは
> 単一責任の原則に違反しています。
無関係ではないんだよ。
そしてその考え方がJava的オブジェクト指向の限界であり、JavaでGUIを誰もやらない理由だよ。
いずれにしても、JavaのGUIなんてキングオブゴミだし、GUIに関してはJava的オブジェクト指向は一旦捨てた方がいい。
実際、.NETにしても、データはバインディングでグローバルストア方式になってるだろ。
（末端のオブジェクトにデータを持たせている風に見せているが、
現実問題としてそれだと状態のセーブが出来なくて(やりにくくて）いきなり詰むから、実際はバインディングでゴニョゴニョ出来るようにしている）
だからJava的な、末端のオブジェクトにデータもイベント関数も全部持たせる、というのがGUIに絶望的に向いてないんだよ。
だからJavaではろくなGUIが作れない、というよりは無駄に苦労するので誰もやらない。その結果が今だ。

> いいえ。殆どがthisを使っています。e.currentTargetは冗長なだけです。
それは君がbubbleを使ってないから。jQueryもだがフレームワーク等は仕様はDOMAPIに合わせているだろうけど、
実際にbubbleの場合はe.currentTargetなんて使い物にならないから当然thisも使わない。
これもやれば分かるだけのこと。君はやってないだけ。

**デフォルトの名無しさん** · 2020/07/23(木) 22:49:01.44

>>614
> バブル主体で書くとそもそもqueryしないから

そういう意味ですか？
意味不明なので他のわかりやすいサイトを
探し出してください

**デフォルトの名無しさん** · 2020/07/23(木) 22:49:21.91

×そういう意味ですか？
○どういう意味ですか？

**デフォルトの名無しさん** · 2020/07/23(木) 22:50:10.57

＞それは君がbubbleを使ってないから。

bubbleを使うとやらのコードを書いてください

**デフォルトの名無しさん** · 2020/07/23(木) 22:53:40.02

Description: The current DOM element within the event 「bubbling」 phase.
https://api.jquery.com/event.currentTarget/

**デフォルトの名無しさん** · 2020/07/23(木) 22:53:41.19

>>612
いや俺はthisがオブジェクトそのものだと聞いたが、
まあJavaの仕様については俺は詳しくないし、いずれにしてもスレチだし、この話は止めよう。

>>613
それは初耳だが、
LS見た限り当然載っているから移動されただけではないか？
そのページのLSの所押すと割と丁度いい場所に飛ぶから見てみればいい。

やれば分かるが、バブルで組んだ場合にe.target無しでは組めない。
廃止されるにしても、名前が変わって何かが定義されるとかであって、丸々捨てられることはないよ。
そしてbubbleを使わずに一々全Elementにイベントを付けていくのは完全に旧式であって、
マトモなサイトでは誰もそんなことやってない。
それも確認してみればいい。

**デフォルトの名無しさん** · 2020/07/23(木) 22:54:31.55

jQuery event.currentTarget
日本語訳説明：イベントバブリングフェーズ内の現在のDOM要素。

**デフォルトの名無しさん** · 2020/07/23(木) 22:55:20.17

>>619
だからjQueryはバブルしかサポートしてないし、
jQueryのevent.currentTargetは（DOM APIと同じで）
イベントバブリングフェーズ内の現在のDOM要素。