+ JavaScript の質問用スレッド vol.123 + [無断転載禁止]©2ch.net

2017/04/02(日) 23:30:38.56

JavaScript を自ら学ぶ人のための質問スレッドです。
>>2-6のテンプレを読んだ上で質問してください。次スレは>>950が>>2のテンプレ案(本スレで改善案があれば考慮)を元に立ててください

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

※前スレ
+ JavaScript の質問用スレッド vol.122 +
http://echo.2ch.net/test/read.cgi/tech/1472426483/

VIPQ2_EXTDAT: checked:vvvvvv:1000:512:----: EXT was configured

2020/12/01(火) 13:31:02.54

>>341
> ただし、これらは、Google などの開発者が読む、プロ向きの本。

さすがにこれは嘘
Ruby知らない俺でも読めた

ES2020などの最新仕様に対応した和書がないのは認める
日本語に拘らなければある(>>338)し、概ね日本人著者よりも英語圏の著者が優秀

2020/12/01(火) 19:23:33.17

>>340
勉強になります、ありがと先生！

**333** (ﾜｯﾁｮｲ dff0-jrSk [115.65.191.12]) · 2020/12/02(水) 10:31:40.93

javascriptの挙動を確認したいので
本体が何処にあるか調べてるのですが不明です
javascript本体はどこにあるのでしょうか？

2020/12/02(水) 13:01:48.46

>>344
本体の定義は何？

2020/12/02(水) 13:44:59.62

Node.js なら、コマンドプロンプトで、
where node
と入力すると、

C:\Program Files\nodejs\node.exe

2020/12/02(水) 14:00:48.75

「javascript本体はどこにあるのか」か。
ちょっと哲学的な問いだな。
俺としては、「Ecma International にある」説を推したい。
しかし物理的実体があるわけではないので Ecma International 本部があるジュネーヴにはない。

2020/12/02(水) 17:09:47.94

ブラウザに組み込まれてるのでは？（クソザコ素人）

2020/12/02(水) 18:10:51.81

>>344は>>328,339と同じ人なので深い答えは期待出来ないかと

2020/12/02(水) 18:15:26.80

単純にコードはどうやって見られますかって話では。

2020/12/04(金) 08:30:08.52

質問は放置されたか

2020/12/04(金) 15:48:35.50

書き込み不可でした
質問の仕方が悪くてすみません

javascriptが関数などをどう処理してるのかを知りたくて
javascriptのソースファイルを見たいなって思ってました
googleのchromeファイルを見てたんですけどちょっと分からなくて質問してみました

実際にはバイナリなりで読めない状態なのかもしれませんけど
所在だけでもしっておきたいなと

2020/12/04(金) 16:14:05.08

>>352
そういう説明が欲しかった。
chromeのJavaScript実行エンジンはV8だから、V8のソース読めばおｋ。
以下に手順が説明されているよ。
https://v8.dev/docs/source-code

2020/12/04(金) 17:56:05.68

>>353
ありがとうございます！
時間のあるときに落として読んでみます
本当にありがとうございました！

2020/12/04(金) 18:35:57.72

function(5, 10){
この5や10を別の数字や文字に変更することは出来ますか？

2020/12/04(金) 19:13:20.61

>>355
そもそも、仮引数に数値は指定出来ないと思うのだが…
要件が成立しない

2020/12/04(金) 19:23:39.37

関数に引数で渡された変数の中身じゃなくて変数の名前って取得できますか？

2020/12/04(金) 19:25:42.17

>>356
文字は適当に書いただけで意味はないです
ようするに()内の文字（呼び出し時に送った文字列とか）を加工できるかどうかの質問です
わかりにくくてすみません

2020/12/04(金) 19:34:15.00

>>357-358
変数値は再代入で変えられる

変数名はグローバル変数を除いて変更(元の名前を削除)出来ない
そもそも、変数名を変えようとするのは不具合の種になる
オブジェクトのプロパティやnew Mapのkey等、限られた空間で安全に変更するのが好ましい

2020/12/04(金) 19:36:52.05

>>357
無理

2020/12/04(金) 19:41:14.45

>>357
と思ったが、Function#toStringをparseすれば、ユーザ定義関数に関しては出来なくはないな
目的次第では別の手段にすべきと思うが

2020/12/04(金) 20:52:39.53

>>359
ありがとうございます

2020/12/04(金) 21:02:15.15

JavaScriptの効率的な学習方法を教えて下さい

入門書のひらがなJavaScriptは終わりました。
次は、Progateか一つ上の書籍かと思っていますが、どの書籍にすべきか迷っています

2020/12/04(金) 23:49:00.70

山田何とかの著書一択

2020/12/05(土) 07:37:21.02

>>363
> JavaScriptの効率的な学習方法を教えて下さい

目指している目標に依る

何かを作るだけならサンプルコードのコピペに行き着く人が多い

基礎から下積みするなら、一日でも早く仕様書を読めるようになる事が最も効率的なので、仕様書に近い書籍を選ぶ事になる

2020/12/05(土) 07:48:18.47

最初からtypescriptを使うことが最も近道

**質問者** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 07:57:03.24

目的は参照ボタンを選択してファイル選択ダイアログを開き、選択したローカルファイルの中を読む事です。
ただ、
<input type=`file`～>で表示されたファイルパスを取得する事は出来ない(セキュリティ上)？
ローカルファイルを読むにはファイルパスが必要なので、どうすれば良いでしょうか？
すみませんよろしくお願いいたします。

2020/12/05(土) 08:04:08.32

>>363
『ひらがなJavaScript』が見つからないのだが…
https://www.google.com/search?q=%E3%81%B2%E3%82%89%E3%81%8C%E3%81%AAJavaScript

2020/12/05(土) 08:16:49.84

>>367
質問者ではどの質問者か分からん
文脈的には>>365へのレスで>>363本人か？(IP違うが)

名前にレス番ふって、レス相手にレス相手アンカーするぐらいはしてくれ

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 08:53:46.63

>>369

全く新しい質問です。

2020/12/05(土) 09:52:09.52

>>370
把握した

>>367
File APIを使えば良い
https://developer.mozilla.org/ja/docs/Web/API/File/Using_files_from_web_applications
https://triple-underscore.github.io/File_API-ja.html

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 12:30:15.84

>>371

ありがとうございます。
これでフルパスを取得できるんですね。

2020/12/05(土) 13:25:14.38

フルパスは取れないファイルが読めるだけ

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 18:02:57.10

>>373

すみません。
ローカルファイルで読む為にフルパスが必要なんです。セキュリティの問題で取りにくいのは知ってます。それで
>>367
に書いた質問をしたのです。
よろしくお願いいたします。

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 18:22:16.72

補足

すみません。
サブ画面ではファイルパスの設定だけ。
メイン画面ではじめて、サブ画面で設定したファイルを読み込むという事をしたいのですが、無理なのでしょうか？
よろしくお願いいたします。

2020/12/05(土) 20:51:52.66

> セキュリティの問題で取りにくいのは知ってます。

ぜんぜん知ってない。知ったかするな。
取り「にくい」だけで頑張れば取れるのなら何のセキュリティ対策にもならないだろ。

2020/12/05(土) 21:00:16.20

フルパスがあればローカルファイルが読める環境というのがよくわからんがそれならElectronとか使えばいいんでねよくわからんが

2020/12/05(土) 21:12:05.00

ブラウザ内のHTML から、ローカルPC 内の情報が取れるのか？

Node.js みたいなサーバーを立てていないと無理なのでは？
Electron も内部で、Node.jsを使っているし

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/05(土) 21:32:44.16

>>376

すみません。出来ないんですね。
設計者はサブ画面でファイル選択ダイアログを使用してexcelファイルを選択して、メイン画面でexcelファイルを取り込む事をやりたいんでしょうが、無理なんですね。設計者に言います。

それにしても、
POI技術で
https://blog.java-reference.com/poi-read-excel/
最初に
�is = new FileInputStream("D:�sample.xlsx");
パスを指定してますが、これは一般的には固定のローカルファイルパスを指定するもんなんですね。

>>377
ありがとうございます。調べてみます。

2020/12/05(土) 21:36:30.80

javascriptじゃないじゃん

2020/12/05(土) 21:37:30.98

>>365
返答ありがとうございます、仕様書の様な書籍とはどんなものでしょうか？、目指すところは現在webコーダーなのですが、JavaScriptでフロントエンドやサーバーサイド開発が出来る様になりたいです

>>368
「スラスラ読める JavaScriptふりがなプログラミング」が正式な書籍名でした、すみません

>>366
なるほどTypeScriptですか、やってみます

2020/12/05(土) 23:22:08.87

>>374
ファイル内容読むのにフルパスは必要ない

>>375
フルパスを受け渡す必要はない
ファイル内容を渡せばいい
https://developer.mozilla.org/ja/docs/Web/API/Window/postMessage

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/06(日) 10:25:22.76

>>382

ありがとうございます。内容はこれで渡せるんですね。
フルパスは取り扱えないんですね。

javascriptとは関係ないですが、フルパスを要求するJAVA POIは使えないので困ってます。こういうjavascriptとサーバー側処理を含んだ質問はどこですれば良いのでしょうか？

2020/12/06(日) 10:36:59.07

>>383
> フルパスを要求するJAVA POIは使えないので困ってます。

何が問題なのか、さっぱりわからん
状況を過不足なく伝える技術を身につけろ

フルパス要求する端末にJavaをインストールしえ取れないのか？
Javaの問題はJavaスレで解決すれば良い

2020/12/06(日) 11:49:41.53

最初の>>367はブラウザ上の処理だと思うが、Javaをどこで動かしたいと言っているんだろう？
クライアントからアップロードしたファイルをサーバー側で処理する話かね？

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/06(日) 14:13:40.86

皆さん、javascriptだけでないレス違いの質問に回答ありがとうございます。

やりたいことは以下です。
1.選択したローカルのexcelファイルをクライアントからサーバーにアップロードする事はしたくない。
2.excelファイルから必要な情報を抜き出してそれのみをDBサーバーに登録したい。

2020/12/06(日) 14:47:02.74

情報小出しで全体像が分からんけど
sheetjsなりで解析してから送りゃエエんちゃう

2020/12/06(日) 16:49:56.97

Ruby on Rails の、SQLite3 などのデータベース(DB)を使えば？

普通に、Rails プロジェクトの開発環境を作れば、
バックエンドのPuma サーバー・DBも、
フロントエンドのブラウザ、HTML, CSS, JavaScript も、ローカルPC 内にある

Node.js サーバーと、Chromium ブラウザを含む、Electron と同じ

2020/12/06(日) 17:23:44.10

>>387
これだな
>>388
死ね

2020/12/06(日) 19:31:15.25

>>386
めちゃ普通のしょり

2020/12/06(日) 23:31:54.81

>>386
サーバにアップロードしたくないのなら、Java POIはローカルにインストールされているんだよな？

**367** (ｽｯﾌﾟ Sdbf-sakO [1.75.0.54]) · 2020/12/07(月) 08:15:51.20

皆さんレスありがとうございます。

sheetjsを調べてみます。
Java poiはインストールされています。

2020/12/07(月) 10:06:30.93

益々謎が深まるばかりだな
だったらブラウザなんて使わず操作画面から通信まで全部Javaで作ればいいのに

**367** (ｽｯﾌﾟ Sd0f-sakO [1.72.8.111]) · 2020/12/07(月) 17:23:01.27

すでに使われているwebシステムの回収で、ボタンを押したら、ローカルexcelファイルのファイル選択ダイアログを表示して選択する。
メイン画面で登録を押したら、excelファイルから必要な情報を取り込んでDBに登録する機能追加なんです。
sheetjsでやることに決めました。
後、画像もファイル選択ダイアログでよみこんで、リンクで表示できるようにする。登録で初めてサーバーにアップロードするという機能追加です。

2020/12/22(火) 13:54:36.05

http://s.kota2.net/1608612653.png

画像の様なグリッドの中でA,Bなどの矩形の面積が一番多く含まれる
グリッド(赤色部分)の座標を得たいのですが、どのように考えたらよいのでしょう？
この手の考え方は皆目わかりません。

2020/12/22(火) 14:42:45.10

矩形の中心点が含まれるグリッドを計算しろ

**395** (ﾜｯﾁｮｲ ee7b-y216 [153.189.240.38]) · 2020/12/22(火) 14:48:28.47

なるほど。ありがとうございます。
それで試してみます。

**デフォルトの名無しさん** · 2020/12/23(水) 02:46:19.78

templateタグをcloneしてすぐそれにidを追加したいんすけど
なんか無理っぽいですね？？
appendした後にその要素を特定する作業（追加した最後の要素を見つける）をしてから
その要素を改めて取得してから、idを追加することはできるみたいですけど
どうにかなりませんかね

**398** (ｽﾌﾟｯｯ Sdbf-JkJa [1.75.229.205]) · 2021/01/05(火) 07:55:22.65

初見失礼します。

私は今、スマホのメモ帳系のアプリでjavascriptを勉強しています。

それなりに行数増えてきたので、そろそろ外部JSファイルからの読み込みに手をつけてみようと思い、
いろいろなサイトを見ながら四苦八苦していたのですが、殆ど上手く行きません。

何故か唯一、test.jsという名前のファイルだけ正常に開けているのが現状です。
そのファイルの名前に、2とかつけると読み込まれなくなります。

test.jsは何か特別な機能を持ったファイルなのでしょうか？

また、外部jsファイルを普通に読み込めない原因について、見当のつくことがあったら教えて貰いたいです。

よろしくお願いします。

**399** (ｽﾌﾟｯｯ Sdbf-JkJa [1.75.229.205]) · 2021/01/05(火) 07:56:15.13

さっきの名前欄のレス番間違えました。

2021/01/05(火) 12:18:47.00

この板よりも、web制作管理板の方へ書き込んで、聞いて下さい！
この板のスレは、一時的に作られたものなので

JSFiddle のサイトなどで、コーディングすれば？

基本、HTML, CSS, JavaScript の3つのファイルが必要です

たぶん、何かのファイルに、test.jsを読み込むように書かれているだけでしょう

**399** (ｽﾌﾟｯｯ Sdbf-JkJa [1.75.196.4]) · 2021/01/05(火) 14:14:30.47

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

また色々と検索、勉強してみます。

2021/01/05(火) 14:40:22.86

>>399
どういうエラーメッセージが出ているの?

2021/01/05(火) 14:43:42.88

>>403
ディスプレイに「エライこっちゃ」と表示されます

2021/01/05(火) 16:55:55.29

>>399
安くてもいいから、とりあえずPCとかMacとか呼ばれている電子計算システムを購入したほうがええで。
JAVA Script学ぶのはそのあとでいい。

2021/01/05(火) 17:01:53.12

そしてGoogleの提供してるビジュアルプログラミング環境
現在はJAVA SCRIPTでコードジェネレート出来る。
https://developers.google.com/blockly/

2021/01/26(火) 16:31:42.32

modalってもしかしてjqueryのほうがVueより全然簡単？
Vueだとよくわからんエラーばっかり出るわ

2021/02/14(日) 05:19:12.94

オフショアの人らが全く同じ関数を1つの.jsの中で3回も書いてた…
動いてるし俺の担当じゃないから触らなかったけど

2021/03/02(火) 05:22:50.76

Adobe製品がこれで動作するから使い始めた

2021/03/02(火) 20:14:12.81

>>409
PhotoShopも？

2021/03/03(水) 10:06:47.42

全機能を制御できるわけではないけど、
PhotoshopでもJavaScript(extend script)は使えるよ。

2021/03/03(水) 10:51:04.90

>>411
よっしゃ！
で、なにができますの？

2021/03/03(水) 10:51:27.69

>>411
よっしゃ！
で、なにができますの？

2021/03/04(木) 18:56:07.87

>>410
もちろん
https://www.adobe.com/devnet/photoshop/scripting.html

2021/03/12(金) 15:48:21.50

一回躓くと次の一歩踏み出すのが困難なのは何でも同じか～とか考えながら勉強の日々

2021/03/16(火) 09:49:45.28

javascritpは文法がしっかりしてないから
最初に学ぶには非推奨だね
学習体系がしっかりし参考情報が豊富な言語から始めたほうがいい

2021/03/16(火) 19:45:10.52

>>416
どこがしっかりしてない？

2021/03/16(火) 20:15:20.99

>>417
変数に関数が代入できること

2021/03/16(火) 20:32:36.45

>>418
第一級関数と文法の関係性は？

2021/03/16(火) 20:55:27.51

中途半端な変数宣言がちょっとね
整数とちゃんと宣言するか
まったく宣言しないかどちらかにしてほしかった

2021/03/16(火) 20:58:41.67

その基準で除外したらモダン言語ほぼ全滅じゃね

2021/03/16(火) 20:59:24.04

>>421は>>418宛

2021/03/16(火) 21:29:17.58

JSXっってbabelで変換しないとｎｏｄｅで動かんのか？

2021/03/16(火) 22:17:20.61

関数の引数に関数というのがあるけど
その引数の関数の中からは外のすべての変数にアクセスできるの？

例は
something.addEventListener(function(){
この中から外の変数はすべて見えるのか
});

2021/03/16(火) 22:24:28.16

>>421-422
だよね

>>418
お勧めの言語は何？

2021/03/16(火) 23:07:50.72

>>425
Javaだ

2021/03/16(火) 23:33:01.12

すまん、変数に関数を代入できちゃ初学者に向いてない理由がわからんのだが

2021/03/16(火) 23:51:36.72

>>426
Javaも第一級関数あるから>>418の理由でお勧め出来ないはずでは？
https://qiita.com/YutaKase6/items/2ff6cba4b059dde92b8b

2021/03/16(火) 23:55:56.03

>>428は間違いなので忘れて
お勧めというかJavaしか知らないから他言語に慣れてないだけなんじゃないの？

2021/03/26(金) 19:37:25.16

F12 ＞　Ctrl + Shift + K
以下の二行をコピペして一度に実行後、リンクをクリック

'knar-csed-etad=s&tpircsavaj=k?s/pj.oc.nozama.www//:sptth'
.split('').reverse('').join('')

**デフォルトの名無しさん** · 2021/04/22(木) 13:40:05.75

document.querySelectorAllの:last-child使えなくなってる？？
セレクタでjqueryでいうところの:eq()があればいいのにな

2021/04/22(木) 20:12:48.08

:last-childはマッチした中の最後じゃないで？

2021/04/23(金) 05:59:03.22

>>431
[0]を忘れてるのでは？
querySelectorの方が良いと思うけど

2021/04/29(木) 08:41:41.15

(function aaa(){})のように関数を()で囲むのはどういう意味があるんですか？

2021/04/29(木) 09:34:41.24

>>434
関数が寒くて風邪をひかないように服を着せているんです。

2021/04/29(木) 10:05:07.56

>>434
ここで質問している人は回答を貰っても何故無反応なのですか？

2021/04/29(木) 10:27:52.89

IIFE (Immediately Invoked Function Expression; 即時実行関数式) は、
定義されるとすぐに実行される、JavaScript の関数です

関数を定義して即実行したい場合、( ) で囲んで、式にする

JS の質問は、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、緊急避難用に作られたものだから

2021/04/29(木) 12:23:48.15

>>437
どうもどうも
web版のスレは新スレが立ってないのでこっちに書いてみた

2021/05/03(月) 00:14:59.29

仕事でWebアプリケーションを作ってる方にお聞きしたいんですが、
jsやcssをいわゆるmin化するのに何使ってます？

Web上のサービスでやるのはセキュリティ的によろしくないのでローカルで完結できるものがあればと思いまして調べたら何個かあるみたいなのですが、主流はどれなのかなと…

2021/05/03(月) 17:20:40.35

全Rubyistに今すぐ伝えたいwebpackとwebpacker
https://qiita.com/jesus_isao/items/1f519b2c6d53f336cadd

Ruby on Rails では、この2つを使っているらしい

webpacker の内部のpackage.json

"mini-css-extract-plugin": "^1.0.0",
"terser-webpack-plugin": "^4.0.0"

この2つは、webpack のサイトにも載ってる
https://webpack.js.org/plugins/

2021/05/07(金) 11:11:04.70

質問です。

下記みたいに複数の配列の各要素を合算した配列を作成するために、
スマートなやりかたはありますでしょうか。

function sumItems(hogearray, fugaarray){
let len = hogearray.length;
let sumarray = [];
for (var i = 0; i < len; i++) {
sumarray.push(hogearray[i] + fugaarray[i]);
}
return sumarray;
}

let arr1 = [1, 2, 3, 4];
let arr2 = [4, 5, 6, 7];

console.log(sumItems(arr1, arr2));
→(4)?[5, 7, 9, 11]

上記のsumItemsをもうちょっと賢く行いたいです。
lodashもざっくり見たのですが無さそうなので・・・。
（本当に欲しいものはこのような配列を不特定多数渡して合算した配列を作りたいです。
　ChartJsの積み上げグラフで、合計の線グラフを差し込むのにあればいいなと思っています）