+ JavaScript の質問用スレッド vol.123 + [無断転載禁止]©2ch.net
レス数が1000を超えています。これ以上書き込みはできません。
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 ■質問テンプレート
【環境】OS, ブラウザをバージョンと共に記入してください。(ex: IE8, Firefox4)
【何をしたのか】何をしたら問題の現象が発生するのか。再現手順を具体的に書いてください。
【エラーメッセージ】エラーメッセージがあれば正確に書き写してください。(Windows なら「コピット」を活用)
【期待する結果】最終的にどういう結果を望んでいるのか、を書いてください。
【サンプルコード】現象を再現可能な最小限のコードを書いてください。
1レスに収まらないならコード投稿サイトを利用してください。
http://jsdo.it/ http://jsbin.com/ http://jsfiddle.net/ http://ideone.com/
■前スレ
+ JavaScript の質問用スレッド vol.120 + [無断転載禁止]c2ch.net
http://echo.2ch.net/test/read.cgi/tech/1463914293/
■過去スレ全集
http://www2.atpages.jp/mirror/2ch/javascript/
http://usamimi.info/~mirrorhenkan/2ch/javascript/ (閲覧のみ)
■テンプレ案
https://fiddle.jshell.net/6018r9tu/1/show/light/
■関連スレ
JavaScript ライブラリ総合質問所 vol.5 [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1465399470/
JavaScript & jQuery 質問用スレッド vol.6 + [無断転載禁止]c2ch.net
http://echo.2ch.net/test/read.cgi/hp/1465566635/
【node.js】サーバサイドjavascript 4【io.js】 [無断転載禁止]c2ch.net
http://echo.2ch.net/test/read.cgi/tech/1460359714/
(X)HTML/CSS の質問に優しく答えるｽﾚ23 [無断転載禁止]c2ch.net
http://echo.2ch.net/test/read.cgi/hp/1467511443/
Canvasについて語ろう
http://peace.2ch.net/test/read.cgi/hp/1305093769/ ■FAQ
http://fiddle.jshell.net/vSqKr/44/show/light/
◆開発者ツール(Developer Tools)の基本的な使い方 (全部はhttp://fiddle.jshell.net/vSqKr/44/show/light/#Browser-Developer-Tools )
▼諸注意
- 本説明では Google Chrome の開発者ツールの名称に従います。他ブラウザで使う場合は適宜読み替えて下さい。
- IE9- でコンソールを使うには予め開発者ツールを起動しておく必要があります(開発者ツールを起動しないと console.log() が機能しません)
- Safari はデフォルトで開発者ツールが無効な為、有効に設定する必要があります。
https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html
▼要素を検証
1. ページ上で右クリックして [要素を検証]
2. [Elements] パネルが開き、対象のDOMノードが選択される(選択対象が目的の要素でなければ [Elements] パネル上で選択し直す)
3. 右側のサイドバーから知りたいステータス名のタブを選択する
- [Styles] タブ … CSSプロパティの指定値を表示 (※カスケードによって上書きされたプロパティは取り消し線で表示される)
- [Computed] タブ … CSSプロパティの算出値を表示( ■FAQ(続き)
◆JavaScriptの実行速度
JavaScriptの速度は「ブラウザ名」「ブラウザのバージョン」「PCスペック」に依存します(ブラウザのバージョン毎に最適化具合が異なります)。
速度の疑問解消の為に http://jsperf.com/ にコードをUPしてブラウザ毎に速度計測する事を推奨します。
例外として、仕様における理論上の速度が明確になっている場合があります。
例えば、正規表現によるマッチング処理を考えた場合、「RegExp#test > RegExp#exec > String#match」は ES5 仕様で保証されています。
ES5 仕様において RegExp#test が最も処理数が少なく、String#match が最も処理数が多いことが明確だからです。
ブラウザによっては RegExp#test の最適化が十分でなく、String#match の最適化が RegExp#test より十分であれば逆転する可能性はありますが、各メソッドの最適化が一律であればこの前提が崩れる事はありません。
■各種仕様 ( http://fiddle.jshell.net/vSqKr/44/show/light/#Link も参照 )
◆ Standard ECMA-262
http://bclary.com/2004/11/07/ (ECMAScript 3 HTML版)
http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/ (ECMAScript 3 和訳)
http://www.ecma-international.org/ecma-262/5.1/ (ECMAScript 5.1 HTML版)
http://tsofthome.appspot.com/ecmascript.html (ECMAScript 5.1 和訳)
http://www.ecma-international.org/ecma-262/6.0/ (ECMAScript 6 / ECMAScript 2015)
http://kangax.github.io/compat-table/es5/ (ECMAScript 5 compatibility table)
http://kangax.github.io/compat-table/es6/ (ECMAScript 6 compatibility table)
◆ HTML Standard (HTML5)
http://www.whatwg.org/specs/web-apps/current-work/multipage/
http://momdo.s35.xrea.com/web-html-test/spec/WD-html51-20130528/Overview.html (HTML5.1 部分訳)
http://www.hcn.zaq.ne.jp/___/WEB/WebStorage-ja.html (Web Storage 和訳) 姉妹スレ
+ JavaScript(ECMAScript)質問用スレッド vol.123 + [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/tech/1482325013/
+ JavaScript の質問用スレッド vol.129 + [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1456242505/
jQuery 質問スレッド vol.7 [無断転載禁止]©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1478055094/ ワッチョイとは
BBS_SLIP
http://info.2ch.net/index.php/BBS_SLIP
スレ立て主が設定する事で、レスした人のIPアドレスからIDを変換して名前欄の横に表示が出ます。
荒らし対策という名目で広がったのですが、一言でいえば強制固定ハンドルネームのようなものです。
中段あたりに解説がありますが、浪人という名前の有料専用ブラウザを導入すれば、ﾜｯﾁｮｲ表示なしで書き込む事も出来るようになります。
●注意点
ﾜｯﾁｮｲ(SLIP)の変換は全板共通です。
IPアドレスから特定の法則で文字列に変換しているだけなので、IPアドレスが変わらない限り全部同じになります。
ですので、漫画板のﾜｯﾁｮｲスレで○○かわえー、なんてレスした後、他のお硬い板のﾜｯﾁｮｲスレで大議論になったり
なんかしてて議論相手にあなたのﾜｯﾁｮｲのIDググられれば普通に他の板の書き込みがヒットします、
全く関係ないスレで別のスレの恥ずかしいレスを相手に突っ込まれたりする可能性があったりします。
これらを自覚してレスをしていないと、あるスレで下の名前をレスして、別の板のスレで苗字をレスして、
と...実は自分から身バレをしていたという可能性も無い訳ではありません。何万人もレスしてますからね、誰かがそういうポカをする事だってあり得ます。
変換自体は一週間でまた変わるので一生同じIDという訳ではないですが、注意しなければならないのはIPアドレスそれ自体が表示されているSLIPスレ。
IPアドレスは固定アドレスにしない限り変動すると思いがちですが、今は変動アドレスでも
殆ど固定と変わらない事が多いのです。下手をすればプロバイダ解約するまで同じIPアドレス。
IPアドレス表示されるスレに一度でもレスすれば、ﾜｯﾁｮｲ＝IPアドレスの関係がバレてしまうので
他のﾜｯﾁｮｲスレでもIP表示で書き込んでる事と実質同じになってしまいます。
2週に渡ってIPアドレス表示のスレに書き込めば、ﾜｯﾁｮｲIDは変わってますがIPは同じなので週を
跨いでも同じ人というのがバレますね。同じIPの過去のﾜｯﾁｮｲIDをググればいくらでも過去に遡れる事になります。 掲示板を見れば閲覧者のIPアドレスは管理者にわかるので日常的に第三者に渡っている情報ですが、
2chのレスでIPが残る(Googleの検索に引っ掛かる)となると少し意味が違ってきます。
IPアドレスからは接続地域と回線種類くらいしかわかりません。それぞれが情報を持っていても
外に開示している情報ではないので個々の情報では価値が薄いのですが、2chにレスがあれば情報を共有できます。一つ一つは薄い情報でも繋げれば意味が出てきます。
また、IPアドレスと本名住所を元々知っている相手にはどうでしょうか？
まず普通に家族が家のIPをググったら2chのレスを見られますね。
あなたの2chの書き込みが全てわかる訳です。趣味嗜好、悩み等を書き込んでいれば筒抜け。
あなたの知り合いがふざけてこのIPの奴○○って奴だよ、と書き込む事だってあるかもしれません。
例えば本名IP掴んでる通販業者が2chググってレス見て病気で悩んでいたのが知れたらその情報を心霊治療の業者に流されたりする可能性だってあります。
まぁそういう可能性も無いとは言えないのでIP表示のスレだけは気をつけて下さい。
先にその危険性を知っていればレスの内容も気をつけるでしょうけど、現状はその危険性をそもそも全く知らずに呑気に匿名だと思ってレスしている人が大半なのです。 ゴミ屑みたいなアンギュラ1.2の保守やらされて死にそう
今日も終電帰り
なにがSPAだ死ね >>132
お前みたいなネトウヨがアベ糞の擁護してるんだな
俺は日本生まれの日本人市民だよバ～カ
バカのひとつ覚えの国籍透視みっともねーな これ読んだけど、なんで関数内で設定されているのに
グローバル変数なのかわけわからん。
この言語設計したやつ頭おかしいわ。
関数呼び出しパターンの「this」はいかに…
関数呼び出しパターン
function show() {
console.log(this);
this.value = 1; // 注１
}
show(); // thisはグローバルオブジェクトをさす
この場合は「this」は「グローバルオブジェクト」を指してしまいます。
なので、注１の「value」は「グローバル変数」となります。
これを抑えておくのがポイントです。
次の例を考えてみましょう。 thisがグローバルオブジェクトを参照してるからthisのプロパティもグローバルになる
var hoge = {};
function fuga(){
hoge.hage = 1;
}
fuga();
を実行するとグローバル変数hogeが参照するオブジェクトに関数内でプロパティhageが追加されるが
hogeがグローバルだからhoge.hageもグローバルなのと同じ そもそもただの関数にthis使う違和感はない？
そっちのほうが気になるけど 複数のテキストボックスの名前をhoge1、hoge2…とかつけて、数字部分を変数にして回そうとすると、evalの中身が超面倒くさい感じになるんだけど、そんなもんなの？ >>15
配列を使えばevalを使わないし多分めんどくさくない >>17
いや
document.getElementById('hoge' + i)
やろ?
なんでevalと思って Chromeのブラウザで←で戻るのと
onClick="history.back()で戻るのとでは仕様が少し違うようだ
上の方法で戻すボタンが作りたのだが何か良い方法はないだろうか 上のは前の状態表示させているので情報はそのまま
下のは前のページを再表示しているので情報はリセットされている いろいろ試しましたが難しいようです。
ChromeはショートカットキーのAlt+←で同じことができるのですが、
javaScriptでボタンのクリックでAlt+←と同じようなことはできるのでしょうか？ >>23
出来ない
- 「任意のキー入力をエミュレート出来る」は「任意の動作を誘発させる」と同義で非常に危険
- [Alt] + [←] を誘発させる実装は [Alt] + [←] に別の動作を割り当てるな、と主張してるのと同義でユーザビリティが悪い >>24
お前の思い込みを世間の常識みたいに語るなよ >>23
お返事遅くなってしまいすいません。
できないという事がわかっただけでも助かりました。
ありがとうございます。 Angularってどれくらいの勢力を誇っていますか
勉強する価値はありますか？
それともその内廃れて消えますか？ 勉強なんて数日ありゃできるから気に入ったなら使ってみればいい 投票です。
現在JavaScript関連にはまともなスレがありません。
新しいスレを立てた方がいいと思いますが賛同する方はいますか？
新しいスレの内容の条件
・JavaScriptだけを扱う（AltJSやBabelやTypeScript禁止）
・ブラウザのDOM APIだけを使う（jQueryなどのライブラリやフレームワーク禁止）
・サーバーサイド禁止（nodejsなど禁止） Web制作板の荒らしの立てたスレを再利用しているスレから誘導で来た
新スレ（復活）には賛同するけど、以前ここに立っていたJS質問スレと同じ轍を踏む気がする
あれが落ちた原因はJS関連スレに長年巣食っている荒らしとは別の荒らしだったし
一応最後にまともなテンプレで立ってた最後のWeb制作とここの両スレを貼っておく
+ JavaScript の質問用スレッド vol.129 +©2ch.net
http://echo.2ch.net/test/read.cgi/hp/1456250334/
JavaScript の質問用スレッド vol.123 [無断転載禁止]©2ch.net
http://mevius.2ch.net/test/read.cgi/tech/1491147085/ >>35
> 新スレ（復活）には賛同するけど、以前ここに立っていたJS質問スレと同じ轍を踏む気がする
原因と対策を考える必要があが、あなたはどう考える？
前回の失敗は事実上1人にテンプレ案作成をまかせていて、その人が保守しなくなったからテンプレ維持がままならなくなった気がする。
- 苦言や提案はするけど、テンプレ作るのは面倒くさい
- 2chなんだから適当でいいだろ
こういうスタンスでは間違いなく破綻する。
最低でも、3人はテンプレ保守する人が必要だと思うな。 現在プログラム板にあるJavaScript関係の質問スレ
+ JavaScript の質問用スレッド vol.124 + [転載禁止](c)2ch.net (2015/03/22- 286レス )
http://mevius.2ch.net/test/read.cgi/tech/1427008785/
JavaScript情報交換所(プログラミング既習者専用） [無断転載禁止]©2ch.net (2015/12/07- 539レス )
http://mevius.2ch.net/test/read.cgi/tech/1449440793/
【node.js】サーバサイドjavascript 4【io.js】 [無断転載禁止]©2ch.net (2016/04/11- 882レス )
http://mevius.2ch.net/test/read.cgi/tech/1460359714/
+ JavaScript(ECMAScript)質問用スレッド vol.123 + [無断転載禁止]©2ch.net (2016/12/21- 24レス )
http://mevius.2ch.net/test/read.cgi/tech/1482325013/
【JavaScript】ｽｸﾘﾌﾟﾄ ﾊﾞﾄﾙﾛﾜｲﾔﾙ55【php,py,pl,rb】 [無断転載禁止]©2ch.net (2016/10/01- 658レス )
http://mevius.2ch.net/test/read.cgi/tech/1475332848/
+ JavaScript の質問用スレッド vol.123 + [無断転載禁止]©2ch.net (2017/04/02- 36レス )
http://mevius.2ch.net/test/read.cgi/tech/1491143438/
JavaScript 4(c)2ch.net (2014/12/05- 319レス )
http://mevius.2ch.net/test/read.cgi/tech/1417749547/
+ JavaScript の質問用スレッド vol.121 + [無断転載禁止]©2ch.net (2016/07/08- 10レス )
http://mevius.2ch.net/test/read.cgi/tech/1467906869/
jQuery,.js [無断転載禁止]©2ch.net (2016/09/13- 7レス )
http://mevius.2ch.net/test/read.cgi/tech/1473773598/ >>37
> 最低でも、3人はテンプレ保守する人が必要だと思うな。
その三人の中に裏切り者がいたらどうしましょうか？
まずその人が信頼できる人か素性を調べる必要があるのでは？
その上で公平な投票システムが必要でしょう
荒らしがIPアドレス変えて大量に投票したら意味ないですからね >>33
> 新しいスレを立てた方がいいと思いますが賛同する方はいますか？
賛成。
> ・JavaScriptだけを扱う（AltJSやBabelやTypeScript禁止）
反対。
スレッドが埋まるほどAltJS質問が来るならともかく、現状分化する程の量はないと思う。
採用するなら誘導先のスレッドが必要。
> ・ブラウザのDOM APIだけを使う（jQueryなどのライブラリやフレームワーク禁止）
賛成。
ライブラリ荒らしがひどいので、ライブラリスレへ誘導すべき。
> ・サーバーサイド禁止（nodejsなど禁止）
微妙。禁止するなら、誘導先スレを決めるべき。
サーバサイドJavaScriptスレがあるならいいが、今あるのはnode.jsスレか。
【node.js】サーバサイドjavascript 4【io.js】 [無断転載禁止]©2ch.net
https://mevius.5ch.net/test/read.cgi/tech/1460359714/ あとそもそも疑問なんですが、テンプレをちゃんと管理していれば
スレの内容はテンプレしたがってくれるんでしたっけ？
運営と連携したブロックする仕組みが必要になるのかな？ >>39
> その三人の中に裏切り者がいたらどうしましょうか？
それは別の問題。
俺が危惧しているのは、あなたのいうところの「裏切り者」だけが存在し、良識あるテンプレ保守者がゼロの状態。
こうなると「裏切り者」がやりたい放題になる。
粘着質な荒らしはいつまでも5chに常駐していられるが、我々は人間だから疲れもするし、諦めもする。
あなたも今は元気な状態だが、今後もずっとテンプレ保守をして面倒になっても投げ出したりしない、とはいえないだろう。
一人が欠けても機能する為には、複数人での協力体制が必要。 > こうなると「裏切り者」がやりたい放題になる。
「やりたい放題」って具体的に何をやるんですか？
それを防ぐにはどうしたらいいのでしょうか？ >>41
勿論、テンプレだけ直してもダメだな。
5chでシステム的な強制力は期待できないので、基本的には利用するユーザの良識ある姿勢が必要になる。
模範となる人間が複数人いて、悪意あるユーザが荒らしても是正されたり、無視される文化(空気)がなければならない。
外部サイトになるが、https://ja.stackoverflow.com/questions/tagged/javascript にはそれがあるな。
昔の2chでは一時期その空気があったのだが、vol.115でlodashを啓蒙する荒らしが出たころからおかしくなった。
今、その空気を作り出す為には、最低三人の人間が回答/テンプレ保守に参加する姿勢が必要だと思う。
+ JavaScript の質問用スレッド vol.88 +
http://www2.atpages.jp/mirror/2ch/javascript/read.php/1308664388/
大分前のスレだが、この頃は比較的まともだった。
> 運営と連携したブロックする仕組みが必要になるのかな？
システム的な是正を問うなら、「他のフォーラムへ移行しよう」が結論になるだろうな。 なぜ三人の人間が必要なのでしょうか？
結論ありきで語ってませんか？ 「他のフォーラムへ移行しよう」が結論で良いのでは？
だってテンプレだけを必死に守ったって
意味ないんでしょう？ 新スレ建てるのは別に良いと思う
ただ詳細なテンプレに従う行儀の良い奴は少ない
ecmascript&DOMオンリーくらいハッキリしたスレタイにしないと同じ轍を踏む事になると思う >>63
例えば、次のシナリオが考えられる。
1. テンプレを改変してライブラリ許容したルールの新スレを立てる
2. 新スレで「なんでもかんでも、ライブラリを推奨するな」と苦情が来る
3. 1が「このスレのルールを守れ」と反論し、「jQueryがいかに有用か」を懇切丁寧に語る
4. 不毛な議論
Web制作板で現在進行形で起きている問題だな。 まず、
1. なにをするためにを書く
2. 案をだしてそれが有効な根拠を書く
3. そして最後に結論としてやることを書く
このスタイルで書いてくれないかな？ >>47
> 「他のフォーラムへ移行しよう」が結論で良いのでは？
では、「質問スレを立てる必要はない」があなたの結論？
質問ばかりであなたの考えがはっきりしないな。
あなたはどうすべきだと考えている？ >>50
>>45で書いた通りだが。
1. (目的) 荒らされない空気を作り出す為
2. (行動) 複数人の良識ある回答者/テンプレ保守者が定期的に投稿する
3. (結論) 同上 >>52
荒らされないことではなくて、
荒らされない「空気を作るだけ」ってこと？
空気作ったって荒らす人は荒らすでしょ？ 俺が言いたいことは、「テンプレ(ルール)は守る人間がいて初めて機能する」という事。
テンプレがあっても守られなければ、「ここはテンプレ通りに質問/回答しなくていいのか、じゃあ好き勝手に質問/回答しよう」となる。
はっきりいって「テンプレなんて守る人はいない」という意識でいるなら、新しくスレを立てても上手くいかないと俺は思うぞ。
ルールを簡潔にしても守らない人は守らない。
ルールを率先して守る人間が複数人いて、ルールから外れた事を是正する働きかけがないと上手くいかない。
「最低、3人」といったのは1人が欠けても複数人(2人)で事に当たれるから。
スレに張り付いている荒らしと1対1になると持久戦で負ける。
お互いに生活リズムがあるのだから、生活リズムの異なる人間が複数人いるのが望ましいといえるが、それは難しいだろうな。
現状は「ルールなんて守る人はいない」「2chに何を求めているんだ？」状態の人が多いので、むやみに新スレだけ立てても上手くいかない、と俺は思う。
その空気を変える必要がある。 >>53
全員にルールを守らせるのは無理に決まってるだろう？
(それとも、あなたには全員にルールを守らせる素晴らしい案があるのだろうか)
日本人は空気に敏感だから、それを利用した方が良い。
あなたの考える「現在の 問題点」と「対策」を教えてくれ。
悪いが、質問攻めで疲弊するのを待っているようにも読める。 俺が言いたいのは手段が目的になってるんじゃないかってこと
目的を実現できないのに手段だけを作って苦労したって意味が無いだろ
目的が達成できない手段だから、その手段は廃れるんだよ
前の人がテンプレを管理しなくなったのも同じ理由
目的が達成できないのに仕事だけやらされて何もメリットがない >>56
もっと具体的に頼む。
それと批判だけでなく、対案をいってくれ。
あなたの考える「現在の 問題点」と「対策」を教えてくれ。 現在の問題点、スレの内容が関係ない話で荒らされること
解決するわけがない問題は終わることもはないから延々と荒らされるだけ
対策、スレと関係ない話はどっか隔離スレでやってくれ、ここのように >>58
> 対策、スレと関係ない話はどっか隔離スレでやってくれ、ここのように
何が対策なのか不明だが、スレ違いの話題が出る度に「スレと関係ない話はどっか隔離スレでやってくれ」とお願いするのか？
今までも適切なスレに誘導されて上手くいかなかったはずだが、どうしてそれが上手く機能する？ 現にうまく機能してるよ。新しいスレ立てるか立てないかみたいな、
jQueryはJavaScriptとして認めるかどうかみたいな
意味がない議論は、こっちに誘導できた
元スレはJavaScriptに関係ある話だけになった 話が噛み合わないと思ったが、「なんでもいいからスレを立てさせて隔離スレとして利用させよう」という腹積もりの人か。
時間を無駄にしたな。 別に新しいスレを立てるに賛同するものが少なければ
立てなくていいと思うよ。少なくともここに隔離されてる分には
本スレは平和だからいい > ・ブラウザのDOM APIだけを使う（jQueryなどのライブラリやフレームワーク禁止）
反対
jQuery, lodash(Underscore) で、すぐに書ける事が多いので、便利。
JavaScript だけを使えとか、非効率な事で、時間を浪費させる奴がいる。
そいつが荒らし
getElementById() とか、ブラウザの差異とか、
仕事時間の8割が、ビジネスロジックとは無関係で、無駄な時間
多くの開発者が、jQuery, lodash(Underscore), React など、
JavaScript の無駄な時間からの、脱却を目指してきた
それに延々と反対する、荒らしがいる。
JavaScript だけを使えとか
C言語を勧める奴と同じ。
非効率な事をさせて、相手の時間をつぶさせる CSS の質問に、SASS で答えたら「死ね」とか、
新技術・新ライブラリで答えると、荒らしてくる奴がいる
新しい知識を邪魔しよる。
人に新技術を教えると、教えるなって荒らしてくる
教えると、自分が食えなくなるから、荒らしてくる ちゃんとしたテンプレで建てるのはいいと思うけど
建てたところで間違いなくテンプレ無視したレスと煽りを繰り返された挙げ句に後半また改竄したテンプレでスレを乱立して乗っ取られるよ
同じことをもう5年くらい繰り返してるんだよ
5chのシステムだと常駐している荒らしに利用者が抵抗するのは無理 荒らしは放っておくべき。
相手をする奴がいるから、いつまでも荒らしてくる
相手をしなければ、書くことが無くなるはずだが、
荒らしに反論するから、荒らしが喜んで書き込んでくる 乗っ取られた、という考え方がもうすでに見当違い。
いつからお前のものになったのかと 最後にフォーカスがあったウィンドウのキャレット位置にテンプレートのテキストを書き込むアプリを作りたいのですがjavascriptで可能でしょうか。 ☆ 日本の、改憲を行いましょう。現在、衆議員と参議院の
両院で、改憲議員が３分の２を超えております。
『憲法改正国民投票法』、でググってみてください。国会の発議は
すでに可能です。平和は勝ち取るものです。お願い致します。☆☆ 仕事でIEのブラウザ上を普通にctrl cコピーしてExcelに貼ることが多いんだけど、セル一枠がクレジットカード番号のみ情報が混じってると勝手に16文字目が0にされてしまう
セルに直接クレジットカード番号打ち直せばいいんだけど、いちいち結構な手間になってしまう
特にブラウザのCSSのデザインもExcel上に残したいからなおさら
Excelのフォーマットの文字列に該当する設定ってJavaScriptでできたりする？ あの、すみません、スレチだったり、既出だったらゴメンナサイ。
CSSでID=AAAを「display:none;」にしてある状態(今このDivは非表示になってます)で、
Javasceipt側で
function Button() {
document.getElementById('AAA').style.display = 'block';
alert('OK');
}
これでHTML側のButton()を実行すると、
ChromeとFireFoxでは先にアラートが出て、アラートを閉じるとAAA属性のDivが表示される。
IEだと意図した通りAAA属性のDivが表示されてからアラートが出る。
ChromeやFireFoxで意図した通りの動作をさせる工夫などはできますでしょうか？
ちなみにアラートの手前に疑似Sleepを5秒とか挟んでもダメでした。
document.get～～～の部分を、同じ記述を10行連続で書いてもダメでした。
どうぞ宜しくお願いします。 JS の話題は、この板よりも、
web制作管理板の方へ書き込んで 僕の知り合いの知り合いができたパソコン一台でお金持ちになれるやり方
役に立つかもしれません
グーグルで検索するといいかも『ネットで稼ぐ方法 モニアレフヌノ』
FKHQT すいません。
frameの取得方法で教えてください。
var frame = document.getElementsByName("header")[0].contentWindow.document;
frame.getElementById('main').value;//取得できる
frame.getElementsByName('tdBody')[0].innerText;//取得できない
この違いは何でしょうか。どちらもページ内埋め込みフレームですが、getElementsByNameのほうはこのメソッド自体使えないと出てしまいます。 Windows8.1 64bit 環境での質問です
JScriptはjavascriptではないと言われそうですが、この環境では
let i = 0;
のようなコードは全てエラーになると考えて良いのでしょうか？
また
var stdout = WScript.StdOut;
for ( var i = 0; i < 5; i++ ) {
stdout.Write("i ");
stdout.writeline(i);
//stdout.writeln(i);
}
stdout.writeline(i);
で5を表示するような挙動はECMA Scriptでは一般的でしょうか https://www.atmarkit.co.jp/ait/articles/0904/20/news124_2.html
> 例えば、WebブラウザでJavaScriptを実行する場合には、
セキュリティ上の制約でJavaScriptからクライアントマシン上のファイルを
読み込んだり、書き出したりすることはできません。
しかし、ファイルシステムAPIというのが検索すると出てきます。
現在のJSの「できること、できないこと」は何ですか？ もう一つ質問です。
JSは通信に関する制限があるようですが、
オフラインで動作するデスクトップアプリに近いようなもの（ブラウザで動いても良い）を
作ったとして、それも通信が制限されますか？ JSはIOも持たないスクリプト言語だからそれだけでは何もできない
何ができるかはどんな外部APIが与えられてるかによる >>82
ローカルでどうのこうのはnode.jsを調べてくれ
言語の問題じゃない 質問し直します。
WEBブラウザ上で動作するJSはlocalhostとのHTTP通信ができますか？
その他どんな制限がありますか？ それはもちろんWebブラウザによる
これは意地悪で言ってるわけではなく本当にブラウザによってポリシーや機能は様々だから
気になるブラウザスレで聞いたほうが良い もう一つ聞きたいです。
GitHubでJSが非常に人気があるようです。
https://githut.info/
言語人気ランキングによっては7位。
https://www.tiobe.com/tiobe-index/
これが意味する事は使ってる人は少なめだけど活発に使っているという事になりますか？
JSにこれほど人気がある理由は何だと思いますか？ この板には、あまり回答者がいないから、
詳しくは、この板よりも、web 制作管理板のJavaScript スレの方へ、書き込んでください！
>JSは通信に関する制限があるようですが
JS も、Ruby などと同じで、単なる言語です。
その言語の実行環境には、基本的なものしか含まれていないので、たいした事は出来ない
JSの実行環境には主に、ブラウザ・Node.js の2つがある
ブラウザはセキュリティーが厳しいので、
各ブラウザで機能は異なるが、基本的には、ローカルPC・クロスドメインにはアクセスできない
ローカルPC内のHTML を、ダブルクリックすると、ブラウザで見れる。
jQuery も使える。
これぐらい単純なら出来る
一般的には、ローカルファイルにアクセスするには、
実行環境にNode.js を使った、Electron などで作る。
VSCode も、Electron製 >>88
基本的に言語というのはどれでもいい。
大抵のことはどの言語でもできる。
ただ稀にこの言語でなければダメという理由がある。
（他の言語でも不可能ではないが大きく不便になる）
その理由は言語そのものではなくて、言語を取り巻く環境にある。
JavaScriptもその一つ。ブラウザでそのまま動く言語はJavaScriptしかない。
他にも機械学習系のライブラリが揃ってるのはPythonだし、
Linuxでカーネルやドライバを作ろうと思ったらC言語しかろくにサポートされてない。
これらは言語の差じゃない。環境の違い。
今はウェブサービスの開発が主流なので、それにうまくハマってるのがJavaScriptというわけ Ruby, Python など、多くの言語では、ローカルファイルアクセスなどのライブラリも、
最初から、その言語の標準ライブラリに入っている
これを、battery included と言う。
製品を買ったら、電池も入っていること
ところが、JS では、言語に標準装備のライブラリが少ないから、
各人で、誰かが作ったライブラリを探さないといけない
ブラウザ・Node.js, Electron, Cordova, jQuery とか、各人で機能を調べる
まあ詳しくは、この板よりも、web 制作管理板のJavaScript スレの方で、聞いてください！ > Ruby, Python など、多くの言語では、ローカルファイルアクセスなどのライブラリも、
> 最初から、その言語の標準ライブラリに入っている
それは利点でも有るが、JavaScriptが対象とするブラウザでは逆にデメリットとなる
なぜならセキュリティの観点からローカルアクセスできてはいけないからだ。
ブラウザのための言語だから当たり前ではあるが、
こういう点もJavaScriptでなければいけない理由になってる。
かつてはブラウザでRubyなどを動かそうという計画もあったんだ 連休最後でやっと自主学習できます。
よろしくお願いします。
値が入っている場合と、入っていない場合の判定なのですが
var val=20;
if(val){alert(val);}
------------------
var val;
if(!val){alert(null);}
という真偽判定で問題なく稼働しますか？
誤作動したりしないでしょうか？ >>89
> JSの実行環境には主に、ブラウザ・Node.js の2つがある
cscript さんの存在も
たまには思い出してください
えっ
古くさくて誰も顧みない？ hta: ボクはブラウザ上で実行される環境だけど、知名度ほとんどないし、まれに出て来てもウィルス扱いだよぉ >>93
> という真偽判定で問題なく稼働しますか？
> 誤作動したりしないでしょうか？
0とかをどう扱う仕様かによるかと
https://developer.mozilla.org/ja/docs/Glossary/Falsy
とか見るとよいかも だれだよ Web 管理制作板へ誘導した奴
マウントばっかりしてマトモに回答しないクズの巣じゃねえか
知恵袋へ誘導した方がまだマシというか、知恵袋だと運営に通報されてBANだろアレ jsスレは質問者が酷いからまともに回答する人はほぼいなくなった 質問者に「それだけでは返答できない」と確認を促し
答えたら「1行返答」とかいうのがマトモな回答？ この板のJS スレは、本来の場所じゃない。
web制作管理板のスレが荒らされて、この板に緊急避難しただけ！
もうこの板には、住民はいない
荒らしも、この板にやってきた。
スレタイに、jQuery, Lodash, ライブラリの話は禁止って書いて、スレ立てする奴
漏れらは、荒らしの立てたスレに書き込まないように誘導したり、荒らしを排除しようとした
今はこちらの板で、Ruby禁止って書いて、スレ立てしてる。
くだすれPython(超初心者用) その43【Ruby禁止】
今は、あちこちのスレで、Ruby 死ねとか書き込んでる
とにかく、荒らしと会話しないこと。
荒らしに反応すると、ずっと居座るだけ >>102
「来週の休日どこに行く？」
「来週の休日の天気を言わなければ返答できない」
「え？天気？晴れるんじゃないかな？」
「水族館に行こう」
（天気関係ないじゃん）
こういう感じなｗ
なんで天気聞いたのか追求すると、今度は台風だったらとか
極論言い出したりするし「晴れなら～雨なら～」という
答えかたをすることもできない。
一種のコミュニケーション能力不足かな
質問に対して、唯一の正解を答えるものだと思っている
だからすべての条件を先に聞き出し（後から言うと怒り出す）
返答は自分が考えた唯一の正解だけ（他の候補は間違い扱い）だから一行になる >>105
ローカル君ｗｗｗｗ
ム板でも元気にガイジパワー発揮！ｗ 必死チェッカーもどき
http://hissi.org/read.php/tcg/20190403/UjBqN1Q2aDIw.html
【報酬制カード】DUELEAGUE【デュヱリーグ】90
325 ：名無しプレイヤー＠手札いっぱい。 (ﾜｯﾁｮｲWW 9fb1-PIOM [221.91.136.7])[]：2019/04/03(水) 11:15:34.81 ID:R0j7T6h20
とりあえず其の頬に流れてる嫉妬まる出しグショ泣き悔し涙ふけよクソ漏らし>>323負･け･イ･ヌ（ ´∀｀)σ)Д｀）
【報酬制カード】DUELEAGUE【デュヱリーグ】90
330 ：名無しプレイヤー＠手札いっぱい。 (ﾜｯﾁｮｲWW 9fb1-PIOM [221.91.136.7])[]：2019/04/03(水) 17:26:25.26 ID:R0j7T6h20
俺は運営の思考分かるよ
お前みたいな害悪野郎に書き込んでほしくないんだよ あんな奴が許容されがちだから「コミュニケーション能力のある人」が求められるんだよ。
>>104
たしかに Yes / No question に対する返答としては「文法的には」正しい。
しかし、そもそも相手に補足情報を要求しておいてアレは無い。
一般的に、「過去の状況・現在の状況・将来の見通し」くらいの返答は、社会通念上、期待される範囲。
まして相手に補足情報を要求した以上、自身も「当然期待されているであろう」返答を返すべきだよ、社会通念上。 >>107
必死チェッカーで反撃した気分になってるのカ・ワ・イ・イ♥ >>108
社会常識を問うなら、質問者にもそれなりの社会常識があるべき
https://mevius.5ch.net/test/read.cgi/hp/1555750241/833 は新たな「さすがに」を生み出しいるだけで何の返答にもなっていない
端的な質問に端的な回答を返されるのは自業自得 >>93
> 値が入っている場合と、入っていない場合の判定
http://blog.tojiru.net/article/205007468.html
そのまんまなページだな…コレで「不足ある」って気付いた人が居たら教えていただきたいものだわね 可読性に関しては void 0 ってCのキャストっぽくて分かりやすいかもしんない ははっ。 2011年の記事じゃん。void 0 とかもはや過去のもの
undefinedとの比較はundefinedと比較すればいい。
void 0とか使わんでいいよ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined
> While it is possible to use it as an identifier (variable name)
> in any scope other than the global scope (because undefined is not a reserved word),
バカ対策は基本的に入れといた方が良いとおもう（私見
100%オレオレコードなら問題ないだろう バカがいるとしたら、バカに気づくことが重要なのであってバカを隠すことではない
お前は、undefinedを変更するコードがあったとして、
そんなコードが入ってるものを安心して使えるか？ >>119
100%オレオレコードだったり、その部分を書き換えても問題ないのであれば
「書かない」「書き換える」はアリでしょ イベントハンドラを使うときにhtmlに書くと
<button id="btn" onclick="func();">クリック</button>
関数名()と実行まで書くのに
イベントハンドラをJavaScript内に書くと
document.getElmentById("btn").onclick=func;と関数名だけで()を付けないのは何故ですか？
onclick=func;←これは、イベントハンドラ(onclick)に関数を代入をしてるんですか？
そもそもイベントハンドラは属性ということで、もう何をやってるのかよく分からなくなってて、
これは理屈抜きで覚えるべきですか？
お願いします >>122
ありがとうございます。
初学本を終えた段階でコールバック関数について全く知りませんでした
詳しく読んでみます >>121
無名関数のことかしら
あと、こんにちでは var を新規で積極的に使う意味は無いとおもう
・プログラミング疎いので全部 let にする
・基本的に const を使い、結び付けられる対象となる値が変化する可能性がある場合のみ let を使う
あたりが方針としてベターだと思う
Hoisting とかクソでしょ foobar.onclick = function ...
とあったら「ああ、無名関数のことね」でスルーしてよし、と ホイスティングがクソという理由を述べよ
いいじゃんKOOLな機能だと思うけど？
なんでクラスはホイスティングされないんだろうなあ >>124
どこからvarがでてきた？
それにどこにも無名関数のことなど書かれていてないようだが… Javascriptはウェブ板へって書いてあるのにな。 >>129
あっちの現状を分かっていて、その上で敢えて発言しているのかしらん 度々の質問で申しわけありません
google chromeのデベロッパーツールを使っているのですがコンソールにjavascriptのメソッドなどを表示していたらエラー
faild to load resource:err_failedと表示され
それ以来ブラウザを閉じてもファイルを削除しても chromeをインストールし直してもエラーが消えず数ヶ月間騙し騙し使っていたのですが
今度はjqueryを使うとchromeのデベロッパーのsources画面のbreak pointsに黄色い文字でエラーが表示されて固まるようになり
やはり新たにjqueryをダウンロードしても変わらず、色々試したところ
jqueryのファイルをjqueryという名前のフォルダーから出して
<script src=jquery／jquery.～>→<script src=jquery.～>
このようにsourceを変えたところエラーが出なくなったのですが、どうしていいのかちょっと分からなくて
このスレの趣旨とは違うかもしれませんが詳しい方がいれば教えて頂きたいです
おそらくコンソールのエラーと同じでパソコンの方に記録が残ってしまっているのが原因だと思うのですが
アドバイスをいただければ嬉しいです
パソコンはMacでosはMojaveです パソコンはMacでosはMojaveです
お願いしますm(__)m console.log("Hello, world!");
は動くんだろうな？ >>133
chromeを開いて最初のページ(chromeのホームページ？)上でデベロッパーツールからコンソールを開いて
そこにjavascriptの関数や文を直接コピペしていたらエラーが出て
それからそのページでコンソールを開くとエラーが表示されるようになりましたが
ただ、別のページでコンソールを開くとエラーの表示は出ません
今はchromeを開いてGoogle.co.jpに移動してそこでコンソールを開いて使ってます
かなり次元の低い質問をしてると思いますが、どういう状態なのか散々調べたのですが分からないんです^^;
スレの趣旨と違うのでこの質問はこれでやめますm(._.)m >>134
から
console.log("Hello, world!");
が動くのか否か判別ができない
＜！ｄｏｃｔｙｐｅ ｈｔｍｌ＞
＜ｈｔｍｌ＞
＜ｈｅａｄ＞＜ｍｅｔａ ｃｈａｒｓｅｔ＝”ｕｔｆ－８”＞＜／ｈｅａｄ＞
＜ｂｏｄｙ＞
＜ｓｃｒｉｐｔ＞
ｃｏｎｓｏｌｅ．ｌｏｇ（”Ｈｅｌｌｏ， ｗｏｒｌｄ！”）；
＜／ｓｃｒｉｐｔ＞
＜／ｂｏｄｙ＞
＜／ｈｔｍｌ＞
が動くかどうか、だけの問題なのに コレなら charset=us-ascii でも行けるか >>135
履歴を消したりアンインストールしてもダメでした
>>136
すみません、それなら問題ありません hello worldと表示されます^^;
自分で作ったhtmlファイルをchromeで開いてコンソールを表示した場合もエラーは出ません
エラーが出るのはchromeを起動して初めに表示されるページ、トップページ？でコンソールを開いた場合だけです。そのページでだけコンソールにエラーが表示されます
同じような現象がjqueryで起こってしまったので原因が気になり質問しました
ありがとうございました。いざとなったらパソコンを初期化します 「トップページ」が悪いだけじゃん
ブラウザも javascript も jQuery も問題は無かろう
jQuery の古いバージョンは知らんけど、たぶん
＜ｓｃｒｉｐｔ ｓｒｃ＝”ｈｔｔｐ：／／ａｊａｘ．ｇｏｏｇｌｅａｐｉｓ．ｃｏｍ／ａｊａｘ／ｌｉｂｓ／ｊｑｕｅｒｙ／１．１２．４／ｊｑｕｅｒｙ．ｍｉｎ．ｊｓ”＞＜／ｓｃｒｉｐｔ＞
＜ｓｃｒｉｐｔ ｓｒｃ＝”ｈｔｔｐ：／／ａｊａｘ．ｇｏｏｇｌｅａｐｉｓ．ｃｏｍ／ａｊａｘ／ｌｉｂｓ／ｊｑｕｅｒｙ／３．３．１／ｊｑｕｅｒｙ．ｍｉｎ．ｊｓ”＞＜／ｓｃｒｉｐｔ＞
とか書くぶんには問題ないんじゃね 1クリックで文字をコピーできるプログラムを作りたいのですが、Androidでしか動かないプログラム、iOSでしか動かないプログラムがあります
どうにか共通化させたいのですが、教えて頂けないでしょうか
https://dotup.org/uploda/dotup.org1865674.txt iOS用の方でaddRangeする前にremoveAllRangesする 教えて頂いたとおり、window.getSelection().removeAllRanges();を追加したらAndroid iOSどちらでも動きました！
ありがとうございます！ >>138
トップページでコンソールを開くと、エラーになるのは、
例えば、回線が遅くて、Ajax で読み込むデータが、まだ到着していないとか？
例えば、5ch を開いても、広告の読み込みでエラーになることもある スピードダイヤルは普通のwebページじゃないから… 初歩的な質問で申し訳ありません
https://qiita.com/takkyun/items/c6e2f2cf25327299cf03
こちらを読んでいたら、序盤にある以下のコードの意味がよくわからずでして
function test() {
console.log(this)
}
var obj = {} //(1)
obj.test = test //(2)
obj.test() // => {test: ?}
(1)
1つ下の行でobj.testとしていますが、なぜこれが許されるのでしょうか？
var obj = { test : 'てすと' }; とかになっているのならわかるのですが、
objは中身は空っぽで、ドット演算子で繋げられるの何も無いですよね？
(2)
左辺のtestと右辺のtest、どちらが function test( ) なのでしょうか？
また、testとtest( ) の違いは何なのでしょうか？（後者は関数なのはわかるのですが、かっこ無しの場合がわからずでして）
よろしくお願いします。 >>148
悪いが、なぜobj.testに代入が許されないと思っているのか、理解出来ない
var obj = {};
obj.test = 1;
console.log(obj);
と何も変わらないと思うが、このコードも理解できない？ >>149
ありがとうございます
すみません、ダメだと勝手に思っていました
実行してみたのですが、その場合はobjのオブジェクトとしてtestが登録？されるのですね
(2)の方は、左辺のobj.testのtestは変数で、右辺のtestがfunction test() ということで、
(2)は obj = {test : function test( )} になったということですか？ >>148
const func = test;
const ret = test();
console.log(typeof func);
console.log(typeof ret);
の結果を読むと参考になるかもしんない "this" の挙動で悩ましい・悩ましかった部分については
var self = this
でググると色々分かるとおもう >>150
言葉で説明するよりも、コンソールデバッグや要所にbreakpointを設定して確かめる方がわかりやすいと思う
var obj = {};
console.log(test);
console.log(obj.test);
obj.test = test;
console.log(obj.test);
おそらく、基礎的な知識が足りてないので、「オブジェクト初期化子」「オブジェクト」「プロパティ」をキーワードにリファレンスをあたってみるべき
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Object_initializer
横着して、基礎を疎かなままに、入門している印象がある 便乗質問なんだけど、一般論として
const obj = {};
obj.test = 1;
とか書いたとき、
・前者は「オブジェクト初期化子」と呼ばれる
・後者は「プロパティ」を新たに定義して、値を結び付けている
という理解でok? >>155
ご返答ありがとうございます。
ちなみに
>>148
> 1つ下の行でobj.testとしていますが、なぜこれが許されるのでしょうか？
これって、Cの構造体とか、C++ / Java のクラス定義からのインスタンス生成あたりが念頭にある気がするんですけど
気のせいですかねえ…。 >>148
> 1つ下の行でobj.testとしていますが、なぜこれが許されるのでしょうか？
>>149
> 悪いが、なぜobj.testに代入が許されないと思っているのか、理解出来ない
この一連の流れ、ちゃんと読んでる？
質問者の自然な感覚としては obj.test が許される理由が分からんと言ってるんだよ
「そういう考え方が何故出て来るのか」って話だよ ホームページのドロワー部分で躓いています。
ドロワーが開いているときに、iosでも背景を固定してかつドロワーはスクロールできるようにするにはどうすればいいでしょうか？
ネットで探して試したことは、
event.preventDefault();をpassive: falseで使うやつ。（ドロワーもスクロールできなくなるので却下）
overflow:hidden;（iosだと効かない）
position:fixed;（スクロールが一番上に移動してしまうので却下）
です。
あとは、「ドロワー以外のtouchmoveではスクロール量を変化させない」という方法で出来ないかとやってみたのですがうまくいきませんでした。 >>154
var obj = { };
obj.test = 1;
これは、Singleton
そのインスタンスだけに、そのプロパティを作った。
そのインスタンスだけに、そのプロパティは存在する
同じだけど、下のように書いた方が、わかりやすい
上だと、インスタンスの外部から設定したように見えるが、
下では、内部で設定したように見える。
あくまでも、印象に過ぎないけど
var obj_2 = { test: 1 };
>>161
この板よりも、web制作管理板のスレの方へ、書き込んで！
この板のスレは、向こうのスレを荒らされて、緊急避難用に作っただけなので、見てる人が少ないから >>162
>>156で解決済
向こうは荒れてるから、こちらで質問されても全く問題ない 質問です。setTimeout内で引数渡しのある即時関数の書き方を教えてください。
下のコードでは"F1="+i+"<BR>"が1秒ごとにwriteされるようにしたいのですが、
待ち時間なしで処理されてしまいます。
F0(0);
function F0(stage){
if(stage<5){
setTimeout((function(i,j){
F1(i,stage);
})(stage*2,stage), 1000);
}else{
document.write("end");
}
}
function F1(i,j){
document.write("F1="+i+"<BR>");
j++;
F0(j);
} >>166
色々言いたいことはあるけど
>function(i,j){
> F1(i,stage);
>})(stage*2,stage)
即時実行してるから当然の結果
ちゃんと渡し方があるから↓読んで
setTimeout(function,delay,stage*2,stage);
https://developer.mozilla.org/ja/docs/Web/API/WindowTimers/setTimeout >>166
こういうこと？
let id_interval;
let i = 0;
const p = document.createElement("p");
document.body.appendChild(p);
p.innerHTML = "";
const show = function() {
if (i === 5) {
p.innerHTML += "end<br>";
clearInterval(id_interval);
} else {
p.innerHTML += "F1=" + i * 2 + "<br>";
i++;
}
}
id_interval = setInterval( show, 1000); >>167のリンクの通り4～6行目を
setTimeout(function(i,j){
F1(i,stage);
}, 1000,stage*2,stage);
にしたら動きましたー
単なる構文間違いですね… >>169
せめて document.write 使うのは止めよう
https://jsbin.com/bupupay/edit?html,js,output
たとえばこんな感じ（これも、innerHTML 使ってる上にサニタイズしてないから、本来はあんまり良くない） https://jsbin.com/sakuwif/edit?html,js,output
「サニタイズ」とか意識しなくて良く、また、都度で <div> を入れているので <br> 不要なのがコレ document.write なんて何年ぶりに見たかな。
タイムスリップしてきたのかよ。 >>171
> setTimeout(function(i, j){
> F1(i, stage);
> }, 1000, stage*2, stage);
どう見ても無名関数式が無駄と思うが、無名関数式を使うべき理由があるだろうか
https://jsfiddle.net/gc0f8ev5/
汎用性を上げるならこう
https://jsfiddle.net/cyuLj0qg/ >>169 までの流れを見ると end 即時表示希望にみえる
end 表示まで1秒かかってません？ あと const とか使うなら
variableName + ' = ' + i * multiple
は
`${variableName} = ${i * multiple}`
とか 他人に指摘する前に質問に答えるのが先と思うのだが
>>174
修正した。
https://jsfiddle.net/6gj37qvr/
>>175
Polyfillで吸収不可能なIE11非対応機能は使用していない >>176
元質問者のコードから document.write 消しただけだが？
わたしゃ知らんがな >>177
質問者のコードは即時関数で>>169が無名関数式を使用したように読めるが…
あと、他人に指摘はするが、自分に指摘されたら「知らんがな」はあまりにも誠意がない
より良いコードを追求するが故の改善案と認識していたが、あなたには違う目的があるのかもしれないと思い始めてる
Web制作板の「ﾜｯﾁｮｲ **8f」と同じ人ならいうだけ無駄かもしれんが × 質問者のコードは即時関数で>>169が無名関数式を使用したように読めるが…
〇 質問者のコードは即時関数で>>170が無名関数式を使用したように読めるが… 165.82.91.58.in-addr.arpa name = p117165-ipngn4601funabasi.chiba.ocn.ne.jp.
inetnum: 58.88.0.0 - 58.95.255.255
netname: OCN
descr: NTT Communications Corporation
descr: OTEMACHI PLACE WEST TOWER 2-3-1 Otemachi Chiyoda-ku,Tokyo 100-8019 Japan https://leetcode.com を始めました。
そこで、質問です。
var toLowerCase = function(str) {
const length = str.length
let str_result = ""
for (let i = 0; i < length; i++) {
const char_code = str.charCodeAt(i)
if ((0x41 <= char_code) && (char_code <= 0x5a)) {
str_result += String.fromCharCode(char_code + 0x20)
} else {
str_result += String.fromCharCode(char_code)
}
}
return str_result
}
console.log(toLowerCase("Hello"))
console.log(toLowerCase("here"))
console.log(toLowerCase("LOVELY"))
こんなコードを書くのは少数派でしょうか？
Runtime: 52 ms, faster than 75.91% of JavaScript online submissions for To Lower Case.
Memory Usage: 33.8 MB, less than 39.71% of JavaScript online submissions for To Lower Case.
だそうで、効率は良いっぽいのですが…。 >>183
「少数派」は統計の媒体依存なので、回答不可
質問の意図が全く分からない
主流とか流行とかなら気にする必要は全くない アルファベット26文字に対する変換問題のようです
配列なりハッシュテーブルなりを使うのが一般的回答かもなあと思いまして。
どのような別解があるのか、と。 >>187
別解はいくらでもある
質問範囲が広すぎる
'ABCdefGHI'.replace(/[A-Z]/g, Function.prototype.call.bind(String.prototype.toLowerCase)) >>187
> 配列なりハッシュテーブルなりを使うのが一般的回答かもなあと思いまして。
要件次第でいくらでも変わるコードに「一般解」を求める事が愚策だと思う
「主流」「一番使われる書き方」「現場での書き方」の質問全てにそう思う >>187
https://mevius.5ch.net/test/read.cgi/hp/1562318008/229
> 229 215 (ﾜｯﾁｮｲ 7e8f-XC/u)2019/07/14(日) 09:32:34.14ID:c8hg/KPq0
> >>223
> プログラム板に別解があるようだが、あれで満足？
>
> うーん
> どこからどう見ても練習問題なのに…
「練習問題」という条件はなかったし、具体的な要件は掲示されていなかった
そして、「練習問題」という要件が何を表すのか全く示されていない
後出しで条件追加するぐらいなら初めから全てを「具体的に」書いてくれ
それから、マルチポストしたなら、全てのマルチポスト先で進捗結果を報告してくれ
https://ja.wikipedia.org/wiki/%E3%83%9E%E3%83%AB%E3%83%81%E3%83%9D%E3%82%B9%E3%83%88#%E5%A4%B1%E7%A4%BC%E3%81%AB%E3%81%AA%E3%82%89%E3%81%AA%E3%81%84%E6%96%B9%E6%B3%95 text に含まれる改行位置で分割して、それぞれの行の文字数を図りたいです。
繰り返しが上手く組めません。宜しくお願いします。 >>191
「出来上がっているコード」や「繰り返しの何を理解して、どこが理解できないのか」を示していない時点でコード制作依頼にしか読めないが…
'abc\ndefg\nhijkl'.split(/\n/).map(s=>s.length); // [3, 4, 5] それはすみません
bodyがフィーム送信されたテキストとしまして
var line = body.split("¥n");
var cline =0;
これを繰り返し展開し length > ○○ で cline++;
したいのですが、javascriptの繰り返しがどうしても理解
できないのです。 全く理解できないけど
for ( var i = 0; i < line.length; i++ ){
if(line[ i ].length > 長さ){
cline++;
}
}
で長さを超えている行数が獲得できました。
結局mapは使えませんでしたが、有り難うございました。 js のfor文はまじでゴミだから使わないほうがいいよ Acrobatのスタンダード版で、Javascriptを使おうとすると、
この機能はライセンスに含まれていないと表示され、使えません。
実際、プロとスタンダードの比較表を見ても、後者では使えないことになってるのですが、
なぜか、コマンドボタンに書いたJavascriptは使えます。
一体何が違うのでしょうか? https://mohayonao.hatenadiary.org/entry/20111108/1320756534
ここでやっているようなプログラムを作っても別タブを開いている間は止まります。
同じような経験をしていらっしゃる方いませんか？
workerの部分を別ファイルを使っても、blobを使って単一ファイルにまとめても
同じようになります。
https://qiita.com/mohayonao/items/b4f713bf8ab9de8907f1
ちなみにここのやつをそのままコピーしてやっても、workerありでも
無しでも同じような結果になりました。 ブラウザはChrome、Operaと試しました。
workerも使えない。上記のカウンターを数えるだけのプログラムですが
別タブに行くとworkerがあろうとなかろうと、タイマーが止まってしまいます。
何かいい方法ないでしょうか。
ちなみに誰か、これらのプログラムを試してみて成功した方いらっしゃいませんか？
というより、プログラムは動くので、別タブに行ってもタイマーが止まるかどうか気になります。 qiitaのやつのBlobBuilderのところをBlobを使うように修正して動かしてみたけど、タブの切り替えでしっかりカウンターがずれて表示されたよ そりゃ、テトリスなどのゲームをプレイしていても、
別タブへ移動したら、ゲームは止まる。
そして戻ってきたら、止まっていた所から始まる
フォーカスを失うと、アクティブ(フォアグラウンド)プロセスじゃないから、CPU スライスが割り当てられない！
GUI では、アクティブなプロセスは、常に1つだけ
バッググラウンドでも動き続けるには、バッググラウンドプロセスにする。
それか、worker スレッド
この板のこのスレは、web制作管理板が荒らされたときに立てた緊急避難用スレで、今は使われていません！
web制作管理板のJavaScript のスレへ、移動してください！ >>200-201
ありがとうございます。
条件とかを無視してBlobbuilder() をBlob()に換えただけですが
ずれて表示されませんでした。
worker使ってもタイマーは止まったまま。
web制作管理板の緊急避難スレとのことでそちらに移動しますね。 Node.jsで普通のJavaScriptライブラリを使いたい場合は
どうすればいいのでしょうか？ >>204
ライブラリ自体は大きいのですが使っている関数が一つだけだったので
それをexportする処理をライブラリ末尾に加えることにしました 変数がnullだったら
プログラムを停止させる
ようにするには
どうしたら良いのでしょうか？ >>206
if arg === null throw new TypeError ES6の導入後って、プレースホルダーを使わないただの文字列でも
とりあえず全部バッククォートで囲んでしまっていいのでしょうか……？ forEachのループ順ってインデックスの順番と一致が保証されてますか？ >>210
初期化されてない要素はスキップされるんですね
知りませんでした、有り難う御座います JavaScript の質問は、web制作管理板の方へ書き込んでください！
この板のこのスレは、web制作管理板のスレが荒らされたときに、
緊急避難用として立てたもので、向こうの方が本当のスレです！ ずっと、Web制作板に誘導してる奴がいるが、俺はどちらに書いてくれても構わん
ID出てくれた方が安心感はある 最近canvas（2d）を勉強している関係で、勉強がてら自分でライブラリを少しずつ作ろうと
思ったのですが、何を描画するにもコンテキストが必要ですよね
汎用的な描画関数を書く場合、必ず引数にコンテキストを与える必要がでてくるのですが
どの描画関数にも同じ引数を常に渡すのはかったるい…かといってグローバル変数に
コンテキストが定義されている前提でライブラリの関数を書きたくない…
といった場合、何かすっきり解決する方法はあるのでしょうか？
ライブラリをクラスにしてプロパティにコンテキストを持たせるくらいですかね forループ文で
for(var i=0; i<5; i+=0.1){}
これだとiが5を超える前でループを抜けますが
for(var i=0; i<5; i+=1>>2){}
このようにビットシフトを使うと無限ループになってしまうのは何故ですか？
お願いします 無限ループになってしまうのは何故ですか？
お願いします。 自己解決しました
何度0を足しても0ですよね
ビット演算とか分からん ビット演算って難しいですよね！！！
だれかビット演算のまとめお願いします！！！
ここで直書きで説明お願いします！！！ ブラウザ側JavaScriptで
簡単にsync化する方法ありますか？
オブジェクト指向化が難しすぎる。
非同期メソッドをクラス内で使った時に
this(このインスタンス的な意味で)を
参照するのが難しすぎます。 非同期は、文脈(コンテキスト)が異なるから、
this とか、例外もキャッチできないだろ
非同期を同期的に書けるのは、async, await。
ちょっと前は、promise だった
JavaScript の質問は、この板ではなくて、web制作管理板の方へ書き込んでください！
この板のスレは以前、荒らしが出たときに、緊急避難用に立てたものだから windowを新規オープンしてから、SetIntervalで60秒に一回関数を呼んで異なるURLに遷移させているのですが、どうも上手く動きません
Windows7 FireFox 7.5.0 64bit
メイン
winObject = window.open("about:blank", "_blank","");
winObject.location.href = "https://www,google.com/";; ← ここまでは動く
https://blog.hello-world.jp.net/javascript/3822/
こういう記事をみつけたんで、（iOS9じゃないけどだめもとで）インターバルで呼ぶ関数内の記述を
winObject.location.href = url;
から
setTimeout(function() { // 次のイベントループで処理
winObject.location.href = url;
}, 100);
にしてみたところ、chromeでは動くようになったもののFireFoxでは動かず
JavaScriptは初心者なもんで、こっちの記述が悪いのかどうかFireFoxが悪いのか判断できず
どうなんでしょう？ ユーザインタラクション以外から触って効くんだっけ？ Firefox75以降のバグのような気はするけど同一オリジンでなくなった時点でlocation効かなくなるな >>224
FireFoxなんですかね
FireFoxのちょっと前のバージョンだと、遷移部分をlocation.url=ではなくて毎回windows.openにしてても新規にウィンドウ開くことなく同じ
ウィンドウで新しいURLを開けてたんですよ。JavaScriptの仕様的にそれがおかしいから直したら、ついでにバグ入れちゃったのかなあ？ JavaScriptって関数のネスト地獄だと思うんですが、何かいい解決策ってあるんですか？(*´ω｀)
os.cpus().forEach(cpuInfo => {
fs.appendFile(dataPath, `${cpuInfo.model}\n`, () => {
// ここに追加で色々処理を書くと、関数のネストがひどくて後々つらくなるのでは？
});
});
forEachとかappendFileを使わなくて書く方法は知ってるけど、今回はサンプルなのでわざと使ってるYo! 引数に関数リテラルを書いてネストが深くなるのが嫌なら外で定義すればいい javascriptでandroidアプリ作れるって聞いたんだけど
仕組みはどうなってんの？
ブラウザでキャッシュにプログラム全部落として実行ってこと？ >>228
javascript android 仕組みでぐぐれば出てくるけど、どうなってんの？
なんにも調べてないの？ >>229
そんなことを書くためだけにレスしたの？アホなの？ >>230
君がアホということは皆分かってるから、そう喚くなよ この板のJavaScript のスレは、荒らし対策で緊急避難用に作られたもの。
web 制作管理板のスレへ書き込んだ方がよい
こちらには、荒らししかいない
荒らしは必ず、2回書き込む。
自分のレスに、リンクを付けて「そうだよな」みたいに自演する
多くの人が言ってるように見せかける。
午前、3時とかでも、同時に2つのレスを書くw >>232
独自ルールで自演認定乙
お前が>>228の可能性も否定出来ないが もう一個のスレはガイジがレスバトルしてて答えは返ってこないしこのスレは自治ガイジが暴れてるしこんなとこで質問しない方がいいが javascriptで、１秒毎にGPSの位置情報を表示したいのですが、毎回、アクセス権確認が出てしまいます。
アクセス許可の確認ボックスが表示されるのを、最初の一回だけに出来ないでしょうか？
var timer;
timer = setInterval(test,1000);
function test() {
navigator.geolocation.getCurrentPosition(test2);
}
function test2(position) {
var geo_text = "緯度:" + position.coords.latitude + "\n";
geo_text += "経度:" + position.coords.longitude + "\n";
var date = new Date(position.timestamp);
geo_text += "取得時刻:" + date.toLocaleString() + "\n";
var a = document.getElementById("AAA");
a.innerHTML = geo_text;
} watchPositionで
自己解決しました
が
バックグラウンド等々でも動作を継続させるのはどうしたら良いのでしょうか？ 正規表現の質問です
2020/6/10
2020-6-10
2020.6.10
これをstringオブジェクトのsplitメソッドを使い日付の区切り部分で、"/"、"-"、"."のいずれの文字でも分割できるように
var reg=/\/|\-|\./gi;
console.log(2020/6/10.split(reg));
として
length(3) ["2020” , “6” , “20”]
期待通りの結果が出たのですが
var reg=/\/|\-|\./gi;←この部分を
var reg=/(\/|\-|\.)/gi;このようにグループ化したところ
length(5) ["2020” , “/” , “6” , “/“ , “20”]
上と違う結果になってしまったのですが、どういう理屈でこういう結果になったのか教えてくださいm(__)m
正規表現の
a|b|cはaかbかcのいずれかで、[a-c]これと同じ意味ですよね？ >>237
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/split
separator が、キャプチャする括弧を含む正規表現だった場合、 separator が一致するごとに、キャプチャする括弧の結果が (未定義の結果であった場合を含め) 出力配列に追加されます。
グループ化だけしたいなら(?:～～)で囲め >>238
ありがとうございます。
括弧を含んだ正規表現の場合～と解説してる文献があるんですね^_^;
こういうの自分で探せないわ…
何故そうなるのかはほとんど正規表現の知識がないので分かりませんが、とりあえず括弧で括った場合にはそういう挙動になるということは分かりました。
ありがとうございます >>242
指摘されるまで質問を撤回しなかった理由は？ JavaScript の質問は、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、緊急避難用として立てられたもので、現在は使われていない！ javascript初心者で右も左もよくわからないんだけどconsole.log();ってみなさんchromeなら検証からやって >>245
2行目がイミフなんだが、
DevelopperToolsを閉じてみなさんスルーしてやって >>247
それでも、エスパー案件
「右クリックメニューの[検証]からコンソールパネルを開いてますか？」
と質問してるのか？
---
ショートカットキーを覚えろ
https://developers.google.com/web/tools/chrome-devtools/shortcuts
そして、正しい日本語で質問することも覚えろ >>248
そうです
理解があいまいで正しく伝達できませんでした >>249
PCの基本が載ってる本を買って勉強した方がいい すみません、自作JavaScriptをブラウザで見ようとしてブラウザが反応しなくなった時に
止める方法はありますですか？
ctl+alt+del押してタスクマネージャーから落とす以外に無いかですか？ いくらでもあるのでは？
ハンマーでPCごと叩き壊すとか >>251
Chrome駕止めるか聞いてきたら、止める こういう配列があったとして
const hoge = [
{name: "taro", age: 15, group: "A"},
{name: "hanako", age: 25, group: "B"},
]
最終的にこんな感じにしたい（ageだけ2倍に）
const hoge = [
{name: "taro", age: 30, group: "A"},
{name: "hanako", age: 50, group: "B"},
]
mapを使えばいいと思ったんですが、書き方が分かりませんでした…
（元のオブジェクトを展開して、ageだけ2倍するみたいなことが出来ると思った）
const newHoge = hoge.map(h => {...h, age: h.age * 2}) >>254
=> {}って書くとアロー関数のパースが変わるので、()で囲むと良い
const newHoge = hoge.map(h => ({...h, age: h.age * 2})) >>255
できましたーーーーー（泣）（1時間かかった）
ありがとうございました これを
const hoge = "【aaa】bbb【ccc】【ddddd】eee【fff】gggg";
最終的にこういう配列にしたいんですが
const newHoge = hogeFunc(hoge);
console.log(newHoge)
["【aaa】",
"bbb",
"【ccc】",
"【ddddd】",
"eee",
"【fff】"]
indexOfで【】の位置特定して、sliceして、みたいなごり押し以外で何かスマートに処理する方法あるでしょうか？
lodash的な便利ライブラリを使用する方法とかでも構わないので知りたいです >>258
hoge.split(/(【[^】]*】)/).filter(Boolean) ggggが要らなければ要素数が3の倍数になるように配列を切り詰めて >>258
hoge.match(/【[^】]*】|[^【】]+/) >>258
hoge.match(/【[^】]*】|[^【】]+/g); // gフラグ付け漏れ修正 >>259
>>261
ありがとうございました
正規表現ってぱっと見何やってるか分からなくて嫌いでしたが便利ですね この方法だとSJISの機種依存文字（崎の大じゃなくて立の文字）が文字化けしないんですが
reader.readAsText(file, "shift-jis");
ここのサンプル通りに
http://polygonplanet.github.io/encoding.js/tests/detect-file-encoding.html
reader.readAsArrayBuffer(file);
var unicodeString = Encoding.convert(codes, {to: 'unicode', from: 'SJIS',type: 'string'});
としても機種依存文字が化けてしまいます
そういうもんでしょうか？ Encoding.jsはブラウザが持ってる変換ではなく自前の変換テーブル使ってやってるのでそういうもんなんだろうけど
IBMのFAB1はUNKNOWN、NECのED95からは変換できるので必要ならgithubで要望出してみれば？ >>265
そういうもんでしたか
UTF-8からSJISは問題なく変換できるので
なにか間違ってるのかと思いました
ありがとうございました 下記のコードでクリックした要素のidを取得したいのですが、取得できません。
$("li").on('click', function(e){
let k = $(this).attr('id');
});
取得する要素はjavascriptで動的にデータベースから値をとってきて表示しているのですが、
ページリロードした際にある要素しか上記のコードは有効でない、など、何か動かない条件などがあるのでしょうか。
よろしくお願いいたします。 取得できないとは具体的にどういう状況を指すのか説明orコードが足らん
あとletで宣言したら外で使えないけどそれで良いの？ li が1つだけなら、取得できた。
2つ以上あったら、知らないけど
<ul>
<li id="abc">リスト 1</li>
</ul>
$( "li" ).on( 'click', function( e ) {
let k = $( this ).attr( 'id' );
console.log( k )
} );
Javascript, jQuery の質問は、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出たときに、一時的に使っていたものなので li が2つ以上あっても、クリックしたものが取得された
正常に動く 動的に追加された要素に対して適用できてないとかそんなオチだろ 取得できそうなもんだけどなぁ
エスパー過ぎてわからん enchant.jsでゲームを作り
自分のレンタルwebサーバにUPしたら
ブラウザで「NET::ERR_CERT_AUTHORITY_INVALID」のエラーが出て
他の誰にもゲームを見てもらえません。
なにがどうなっているのでしょうか？ 明らかにサーバー(SSL証明書エラー)の問題
此処で情報を詳しく出しても良いけど
当該レンサバのスレで質問する方が近道だと思う SSLとか証明書とか意味がさっぱりわからないのですが
なにがどうなっているのでしょうか？ Cloudflareとは何じゃ
良い子はそんなの使ってません。 >>276
SSLが分かんないのにURLがhttpsになってたら設定見直せとしか
「独自SSL」とかその辺見たらいいんじゃない
いずれにせよJS関係無いので向こうで聞いてみたら
XSERVER エックスサーバー Part6
https://mevius.5ch.net/test/read.cgi/hosting/1568069691/ AWS のS3 とか、知らんのか？w
HTTPS, SSL の証明書とか、システム構築運用の初歩の初歩だがw
無料の証明書、let's encrypt とか sort関数に追加の引数を渡すことってできますか？
array.sort(mySort())に引数を与えて条件によって処理を変えたいのですが。
普通にmySort()に引数を入れるとソートで使われる引数に値が入ってしまってダメでした。 function mySort(value) {
if(value===1) {
return (a, b) => a-b
} else if (value===2) {
return (a, b) => b-a
}
}
array.sort(mySort(1)) // 昇順
array.sort(mySort(2)) // 降順 ありがとうございます。
新しいjsでは大丈夫でしたが、ES3という超古いバージョンなのです。
書き忘れていました。後出しで申し訳ありません。
(アドビのソフトで使われているjsです) >>284
bindみたいな引数束縛する関数を作る >>284
http://www2u.biglobe.ne.jp/~oz-07ams/2002/ecma262r3/15-4_Array_Objects.html#section-15.4.4.11 >>285
ちょっと自分のスキルでは難しそうです。 ES3だと
return (a, b) => a-b
↓
return function(a, b) { return a - b; };
じゃね？
だいたいsortと比較関数でクロージャにしちゃって引数でなくローカル変数でやっちゃうよね returnの挙動はともかく、
mySort(value)自体がES3だとできないのです。(aにvalueが入ってしまう)
とりあえず今はグローバル変数で対応していますが、
引数でやる方法がないのかと思いまして。 >>291
ES3でもできるよ
できないと思ってるコードを書いてくれれば原因わかる >>293
今やってることは大雑把には以下の通りで、
mySortにa,b以外の値cを渡してそれを元に処理を追加したいのですが
cの渡し方がわかりません。
var ary=[10,12,53,41,5,6,];
ary.sort(mySort);
function mySort(a,b){
return a-b;
} var ary=[10,12,53,41,5,6,];
ary.sort(mySort(-1));
function mySort(c){
return function(a,b){
return c<0 ? a-b : b-a;
};
} ありがとうございます。まさに希望どおりです。
こんな書き方もできるんですね。 高階関数やクロージャについて調べてみると理解進むよ。
ちなみに今でも全然通用する概念。 質問させてください。
nodejsで line botを作っていて応答文字に改行を入れたいのですが
ダブルクォートで囲った中に”\n”で改行するという仕様のようなのです。
例
return client.replyMessage(ev.replyToken, {
type: "text",
text: “あああ\nいいい”
});
しかし今作っているbotは文字列を変数に格納しており
const aaa = スクレイピングで拾ってきた文字列
const bbb = スクレイピングで拾ってきた文字列
const ccc = aaa + “\n” + bob
return client.replyMessage(ev.replyToken, {
type: "text",
text: ccc
});
では改行されませんでした。
text: `${ccc}` でもダメでした。
\nがそのまま表示されてしまいます。
ダブルクオートで囲い直す方法ってございませんでしょうか？
よろしくお願い致します。 >>299
ありがとうございます。
しかしダメでした、、
やっぱり \n がそのまま表示されてしまいます。 すみません。自己解決しました。
\ではなくバックスラッシュでした。
ありがとうございました。 そもそも文字列はシングルクオートで囲う癖つけとくと便利だと思う
テンプレート文字列にするのもいいけど requirejsやってるんだけどシェルのexportコマンド的なの無いの? function hoge(){} //引数なし
hoge(a=11,b=33)
名前付き引数を可変的に追加できて
関数hoge側でkey（aとb）名も受け取れるようにしたいんだけど無理？
argumentsはkey名は無視されたし
hoge({a=1,b=3})で関数内でfor key in objみたいにするしかないのかな function foo(a, b, ...rest) いまいち何がしたいのかよくわかんないけど
function hoge(o = {}){
console.log(Object.keys(o))
}
hoge({a: 1, b: 3})
//=> ["a", "b"] >>307
端的にいうと
引数は
hoge(x=1,y=2,a="ho",b="ge")
hoge(z=2,x="abc")
みたいに指定できて
{x:1,y:2,a:"ho",b:"ge"}や{z:2,x:"abc"}
みたいに関数で受け取りたい
（もちろんx,yやa,b,cみたいなkey名はこれに限らず） JSにそういう記法はないので無理
Pythonを使え えっ…じゃあこうだけど？？
function hoge(o = {}){
console.log(o)
}
hoge({x: 1, y: 2, a: "ho", b: "ge"})
//=> {x: 1, y: 2, a: "ho", b: "ge"} >>309
なるほど
他の言語だとこういう書き方があったのでもしかしたらJSにもあるのかなとおもったのですがないのですね
ありやした
>>310
それはもちろん
しかしそれだとそもそも{}表記なんで >>311
あーそうゆうことね。
()呼び出しでなくタグ付きテンプレート呼び出し、
eval使っていいなら、
function hoge(s) {
let o={},p=new Proxy(o,{set:(o,p,v)=>(o[p]=v,!0),has:()=>!0});
eval(`with(p){${s[0]}}`)
console.log(o);
}
hoge`x=1,y=2,a="ho",b="ge"`
//=> {x: 1, y: 2, a: "ho", b: "ge"} hoge`
x = 1,
y = 2,
a = "ho",
b = "ge",
z = x + y,
c = a + b
`
//=> {x: 1, y: 2, a: "ho", b: "ge", z: 3, c: "hoge"} >>312,313
なるほど
そんな書き方もできるんですね
ありがとうございます const hoge = [{id:"xxx",
num:5000},
{id:"yyy",
num:2000},
{id:"zzz",
num:9000},]
こういう配列でnumが一番大きいobjectを取得するシンプルな方法ってありますか？
思いついたのは
const foo = hoge.find((i)=>{
return i.num === Math.max(...hoge.map((v) =>{
return v.num
}))
})
なんですけどこれだけの処理に二重でループ回すのはナンセンスな気がしてしまって・・・ >>315
あるいはreduceか
forとかfor-ofで書けるようになった方がいいとは思うけどね 自分で書いといてなんなんですが>>315のnumは存在しない場合もありました
>>316,317
sortはアリかなと思いました
他のメソッドはパっと思いつく感じ最初の関数と似たようなものしか思いつきませんでした・・・ const foo = hoge.sort((a, b) => a.num - b.num).pop()
とか
const foo = hoge.sort((a, b) => b.num - a.num)[0]
とか。
しかし両者ともhogeを書き換えてしまうので、
const foo = [...hoge].sort((a, b) => a.num - b.num).pop()
とか
const foo = [...hoge].sort((a, b) => b.num - a.num)[0]
のほうが望みのものかもね。
あとは
const foo = hoge.reduce((acc, r) => r.num > acc.num ? r : acc)
とか。 sortしなくていいケースでsortするのは無駄
reduceかfor-ofで >>318
> numは存在しない場合もありました
このような後出し要件の場合は、安全なアクセス関数を追加で用意して差し込むのが簡単。
例えば、
const getNumSafe = ({num = -Infinity}) => num
const foo = hoge.reduce((acc, r) => getNumSafe(r) > getNumSafe(acc) ? r : acc)
のように。 >>319-322
ありがとうございます
参考に自分のパターンに合うものを書いてみたいと思います Lodash は多くのライブラリも使っているから、使うべき！
プロジェクトのライブラリの依存関係を検索すると、
多くのライブラリが、Lodash に依存してる Netflixはlodash切って素のJSで書き直したけどな。 ライブラリが必要な程、複雑な処理ではない気がするけどな
hoge.reduce((max, current) => max < current.num ? cutrent.num : max, -Infinity); 動的型付け言語って本当にわかりづらい
javascriptでオブジェクト指向的なプログラムを組もうと思って
簡単な本でjavascriptを勉強してるんだけど
interfaceないのにどうやってオブジェクト指向的な開発してるんですか？
typescriptしたほうがいいんだろうか？ >>330
インターフェイスやabstracut使わずにどうやれと >>331
あるもので何とかする気のない人にどう答えろと javascriptでオブジェクト指向開発は、今のところは無理ってことですかね？ 独学におすすめの本はありますか？
プログラム自体はphpの基礎ができる程度です >>336
『JavaScript for impatient programmers』 javascriptって面白い挙動するんだね
class s{
constructor(){
this.s1="s1";
let .s2="s2";
alert(); }// ---①
alert(){window.alert();}} //---②
new s();
-------------------
①を
alert(s1) ×
alert(this.s1) 〇
alert(s2) 〇
alert(this.s2) ×
と、②で引数を受け取らなくてもalertで値が表示される
①alert(s2)とし
②alert(){window.alert(this.s1):}
とすると、s2がalertされるし
①alert()とし
②alert(){window.alert(this.s1):}
とするとalertには何も表示されない
とても不可思議な挙動 >>339
(1)で(2)を呼びたいならthis.alert()でないとだめ
ブラウザ上ではwindow.は省略可能なので(1)のalertはwindow.alertその物
スクリプト系の言語ではc++やc#等とは違ってthis相当の物を省略できないのが多い >>336
プロ向きなら、サイの表紙の2冊のサイ本
初めてのJavaScript 第3版 ――ES2015以降の最新ウェブ開発、オライリー、2017
JavaScript 第6版、2012、David Flanagan
ただし、これらは、Google などの開発者が読む、プロ向きの本。
最低でも、Ruby は出来ないと、難しすぎて読めないと思う
JavaScript は、言語仕様が肥大化してる。
Rubyみたいに、簡単には学べないから、適当にお茶を濁した方がよい。
キリがない >>341
> ただし、これらは、Google などの開発者が読む、プロ向きの本。
さすがにこれは嘘
Ruby知らない俺でも読めた
ES2020などの最新仕様に対応した和書がないのは認める
日本語に拘らなければある(>>338)し、概ね日本人著者よりも英語圏の著者が優秀 javascriptの挙動を確認したいので
本体が何処にあるか調べてるのですが不明です
javascript本体はどこにあるのでしょうか？ Node.js なら、コマンドプロンプトで、
where node
と入力すると、
C:\Program Files\nodejs\node.exe 「javascript本体はどこにあるのか」か。
ちょっと哲学的な問いだな。
俺としては、「Ecma International にある」説を推したい。
しかし物理的実体があるわけではないので Ecma International 本部があるジュネーヴにはない。 >>344は>>328,339と同じ人なので深い答えは期待出来ないかと 書き込み不可でした
質問の仕方が悪くてすみません
javascriptが関数などをどう処理してるのかを知りたくて
javascriptのソースファイルを見たいなって思ってました
googleのchromeファイルを見てたんですけどちょっと分からなくて質問してみました
実際にはバイナリなりで読めない状態なのかもしれませんけど
所在だけでもしっておきたいなと >>352
そういう説明が欲しかった。
chromeのJavaScript実行エンジンはV8だから、V8のソース読めばおｋ。
以下に手順が説明されているよ。
https://v8.dev/docs/source-code >>353
ありがとうございます！
時間のあるときに落として読んでみます
本当にありがとうございました！ function(5, 10){
この5や10を別の数字や文字に変更することは出来ますか？ >>355
そもそも、仮引数に数値は指定出来ないと思うのだが…
要件が成立しない 関数に引数で渡された変数の中身じゃなくて変数の名前って取得できますか？ >>356
文字は適当に書いただけで意味はないです
ようするに()内の文字（呼び出し時に送った文字列とか）を加工できるかどうかの質問です
わかりにくくてすみません >>357-358
変数値は再代入で変えられる
変数名はグローバル変数を除いて変更(元の名前を削除)出来ない
そもそも、変数名を変えようとするのは不具合の種になる
オブジェクトのプロパティやnew Mapのkey等、限られた空間で安全に変更するのが好ましい >>357
と思ったが、Function#toStringをparseすれば、ユーザ定義関数に関しては出来なくはないな
目的次第では別の手段にすべきと思うが JavaScriptの効率的な学習方法を教えて下さい
入門書のひらがなJavaScriptは終わりました。
次は、Progateか一つ上の書籍かと思っていますが、どの書籍にすべきか迷っています >>363
> JavaScriptの効率的な学習方法を教えて下さい
目指している目標に依る
何かを作るだけならサンプルコードのコピペに行き着く人が多い
基礎から下積みするなら、一日でも早く仕様書を読めるようになる事が最も効率的なので、仕様書に近い書籍を選ぶ事になる 目的は参照ボタンを選択してファイル選択ダイアログを開き、選択したローカルファイルの中を読む事です。
ただ、
<input type=`file`～>で表示されたファイルパスを取得する事は出来ない(セキュリティ上)？
ローカルファイルを読むにはファイルパスが必要なので、どうすれば良いでしょうか？
すみませんよろしくお願いいたします。 >>367
質問者ではどの質問者か分からん
文脈的には>>365へのレスで>>363本人か？(IP違うが)
名前にレス番ふって、レス相手にレス相手アンカーするぐらいはしてくれ >>371
ありがとうございます。
これでフルパスを取得できるんですね。 >>373
すみません。
ローカルファイルで読む為にフルパスが必要なんです。セキュリティの問題で取りにくいのは知ってます。それで
>>367
に書いた質問をしたのです。
よろしくお願いいたします。 補足
すみません。
サブ画面ではファイルパスの設定だけ。
メイン画面ではじめて、サブ画面で設定したファイルを読み込むという事をしたいのですが、無理なのでしょうか？
よろしくお願いいたします。 > セキュリティの問題で取りにくいのは知ってます。
ぜんぜん知ってない。知ったかするな。
取り「にくい」だけで頑張れば取れるのなら何のセキュリティ対策にもならないだろ。 フルパスがあればローカルファイルが読める環境というのがよくわからんがそれならElectronとか使えばいいんでねよくわからんが ブラウザ内のHTML から、ローカルPC 内の情報が取れるのか？
Node.js みたいなサーバーを立てていないと無理なのでは？
Electron も内部で、Node.jsを使っているし >>376
すみません。出来ないんですね。
設計者はサブ画面でファイル選択ダイアログを使用してexcelファイルを選択して、メイン画面でexcelファイルを取り込む事をやりたいんでしょうが、無理なんですね。設計者に言います。
それにしても、
POI技術で
https://blog.java-reference.com/poi-read-excel/
最初に
�is = new FileInputStream("D:�sample.xlsx");
パスを指定してますが、これは一般的には固定のローカルファイルパスを指定するもんなんですね。
>>377
ありがとうございます。調べてみます。 >>365
返答ありがとうございます、仕様書の様な書籍とはどんなものでしょうか？、目指すところは現在webコーダーなのですが、JavaScriptでフロントエンドやサーバーサイド開発が出来る様になりたいです
>>368
「スラスラ読める JavaScriptふりがなプログラミング」が正式な書籍名でした、すみません
>>366
なるほどTypeScriptですか、やってみます >>382
ありがとうございます。内容はこれで渡せるんですね。
フルパスは取り扱えないんですね。
javascriptとは関係ないですが、フルパスを要求するJAVA POIは使えないので困ってます。こういうjavascriptとサーバー側処理を含んだ質問はどこですれば良いのでしょうか？ >>383
> フルパスを要求するJAVA POIは使えないので困ってます。
何が問題なのか、さっぱりわからん
状況を過不足なく伝える技術を身につけろ
フルパス要求する端末にJavaをインストールしえ取れないのか？
Javaの問題はJavaスレで解決すれば良い 最初の>>367はブラウザ上の処理だと思うが、Javaをどこで動かしたいと言っているんだろう？
クライアントからアップロードしたファイルをサーバー側で処理する話かね？ 皆さん、javascriptだけでないレス違いの質問に回答ありがとうございます。
やりたいことは以下です。
1.選択したローカルのexcelファイルをクライアントからサーバーにアップロードする事はしたくない。
2.excelファイルから必要な情報を抜き出してそれのみをDBサーバーに登録したい。 情報小出しで全体像が分からんけど
sheetjsなりで解析してから送りゃエエんちゃう Ruby on Rails の、SQLite3 などのデータベース(DB)を使えば？
普通に、Rails プロジェクトの開発環境を作れば、
バックエンドのPuma サーバー・DBも、
フロントエンドのブラウザ、HTML, CSS, JavaScript も、ローカルPC 内にある
Node.js サーバーと、Chromium ブラウザを含む、Electron と同じ >>386
サーバにアップロードしたくないのなら、Java POIはローカルにインストールされているんだよな？ 皆さんレスありがとうございます。
sheetjsを調べてみます。
Java poiはインストールされています。 益々謎が深まるばかりだな
だったらブラウザなんて使わず操作画面から通信まで全部Javaで作ればいいのに すでに使われているwebシステムの回収で、ボタンを押したら、ローカルexcelファイルのファイル選択ダイアログを表示して選択する。
メイン画面で登録を押したら、excelファイルから必要な情報を取り込んでDBに登録する機能追加なんです。
sheetjsでやることに決めました。
後、画像もファイル選択ダイアログでよみこんで、リンクで表示できるようにする。登録で初めてサーバーにアップロードするという機能追加です。 http://s.kota2.net/1608612653.png
画像の様なグリッドの中でA,Bなどの矩形の面積が一番多く含まれる
グリッド(赤色部分)の座標を得たいのですが、どのように考えたらよいのでしょう？
この手の考え方は皆目わかりません。 なるほど。ありがとうございます。
それで試してみます。 templateタグをcloneしてすぐそれにidを追加したいんすけど
なんか無理っぽいですね？？
appendした後にその要素を特定する作業（追加した最後の要素を見つける）をしてから
その要素を改めて取得してから、idを追加することはできるみたいですけど
どうにかなりませんかね 初見失礼します。
私は今、スマホのメモ帳系のアプリでjavascriptを勉強しています。
それなりに行数増えてきたので、そろそろ外部JSファイルからの読み込みに手をつけてみようと思い、
いろいろなサイトを見ながら四苦八苦していたのですが、殆ど上手く行きません。
何故か唯一、test.jsという名前のファイルだけ正常に開けているのが現状です。
そのファイルの名前に、2とかつけると読み込まれなくなります。
test.jsは何か特別な機能を持ったファイルなのでしょうか？
また、外部jsファイルを普通に読み込めない原因について、見当のつくことがあったら教えて貰いたいです。
よろしくお願いします。 この板よりも、web制作管理板の方へ書き込んで、聞いて下さい！
この板のスレは、一時的に作られたものなので
JSFiddle のサイトなどで、コーディングすれば？
基本、HTML, CSS, JavaScript の3つのファイルが必要です
たぶん、何かのファイルに、test.jsを読み込むように書かれているだけでしょう >>401
ありがとうございます。
また色々と検索、勉強してみます。 >>399
どういうエラーメッセージが出ているの? >>403
ディスプレイに「エライこっちゃ」と表示されます >>399
安くてもいいから、とりあえずPCとかMacとか呼ばれている電子計算システムを購入したほうがええで。
JAVA Script学ぶのはそのあとでいい。 そしてGoogleの提供してるビジュアルプログラミング環境
現在はJAVA SCRIPTでコードジェネレート出来る。
https://developers.google.com/blockly/ modalってもしかしてjqueryのほうがVueより全然簡単？
Vueだとよくわからんエラーばっかり出るわ オフショアの人らが全く同じ関数を1つの.jsの中で3回も書いてた…
動いてるし俺の担当じゃないから触らなかったけど 全機能を制御できるわけではないけど、
PhotoshopでもJavaScript(extend script)は使えるよ。 一回躓くと次の一歩踏み出すのが困難なのは何でも同じか～とか考えながら勉強の日々 javascritpは文法がしっかりしてないから
最初に学ぶには非推奨だね
学習体系がしっかりし参考情報が豊富な言語から始めたほうがいい 中途半端な変数宣言がちょっとね
整数とちゃんと宣言するか
まったく宣言しないかどちらかにしてほしかった JSXっってbabelで変換しないとｎｏｄｅで動かんのか？ 関数の引数に関数というのがあるけど
その引数の関数の中からは外のすべての変数にアクセスできるの？
例は
something.addEventListener(function(){
この中から外の変数はすべて見えるのか
}); >>421-422
だよね
>>418
お勧めの言語は何？ すまん、変数に関数を代入できちゃ初学者に向いてない理由がわからんのだが >>428は間違いなので忘れて
お勧めというかJavaしか知らないから他言語に慣れてないだけなんじゃないの？ F12 ＞ Ctrl + Shift + K
以下の二行をコピペして一度に実行後、リンクをクリック
'knar-csed-etad=s&tpircsavaj=k?s/pj.oc.nozama.www//:sptth'
.split('').reverse('').join('') document.querySelectorAllの:last-child使えなくなってる？？
セレクタでjqueryでいうところの:eq()があればいいのにな :last-childはマッチした中の最後じゃないで？ >>431
[0]を忘れてるのでは？
querySelectorの方が良いと思うけど (function aaa(){})のように関数を()で囲むのはどういう意味があるんですか？ >>434
関数が寒くて風邪をひかないように服を着せているんです。 >>434
ここで質問している人は回答を貰っても何故無反応なのですか？ IIFE (Immediately Invoked Function Expression; 即時実行関数式) は、
定義されるとすぐに実行される、JavaScript の 関数 です
関数を定義して即実行したい場合、( ) で囲んで、式にする
JS の質問は、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、緊急避難用に作られたものだから >>437
どうもどうも
web版のスレは新スレが立ってないのでこっちに書いてみた 仕事でWebアプリケーションを作ってる方にお聞きしたいんですが、
jsやcssをいわゆるmin化するのに何使ってます？
Web上のサービスでやるのはセキュリティ的によろしくないのでローカルで完結できるものがあればと思いまして調べたら何個かあるみたいなのですが、主流はどれなのかなと… 全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/ 質問です。
下記みたいに複数の配列の各要素を合算した配列を作成するために、
スマートなやりかたはありますでしょうか。
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の積み上げグラフで、合計の線グラフを差し込むのにあればいいなと思っています） >>441
for使うコードとしては十分にスマートだと思うが…
関数型がスマート打と思うならArray#mapとか >>442
なるほど！Array.mapにindex使えばよかったんですね！
これで出来ました！（newarrのところ）
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];
let newarr = arr1.map((value, index) => {
return value + arr2[index]
});
console.log(sumItems(arr1, arr2));
console.log(newarr);
↓
(4)?[5, 7, 9, 11]
(4)?[5, 7, 9, 11]
ありがとうございました！ >>444
スマートというふわふわした理由でfor文を毛嫌いしないで欲しいとは思う Ruby では、zip で、
pp result = [1,2,3].zip( [4,5,6], [7,8,9] ).map( &:sum )
出力
[12, 15, 18] Lodash にも、zip ある
_.zip( ['a', 'b'], [1, 2], [true, false] );
// [ ['a', 1, true], ['b', 2, false] ] 極論だけどあんまり内包表記とかラムダ式とか関数型的な書き方ばかりしてるとあの人のコードは短いけど読みにくいから一緒に仕事したくないって言われるぞ var data_array = [];
～いろいろと処理～
このとき、処理に分岐によって、配列を空にしたときって
data_array.splice(0);
っとしているのですが、配列を空にするなら
data_array = []の方がいいのでしょうか？ https://jsfiddle.net/s1awpc0b/
すみません、JS、jQuery初心者なのですが質問させてください。
「リストの中の文字をホバーしたら、タイトル内のテキストがその文字列に置き換わる」
という機能を実装したいと考えております。
しかし、実際にやってみると、何故か最初に一回変わるだけで他のリストにホバーしても
最初と同じ文字列が出てきてしまうのと、ホバーを外した際にタイトル内のテキストを
元の文字に戻す方法が分からず、困っております・・・
この場合、有効な手段などあれば教えて下さい。よろしくお願いします .parent(ttl)ってbodyを指してるからじゃないの
jqueryは知らんからどう置き換えたらいいかは分からんけど ttl.find('p').text(navtxt); const navtxt = $(this).find('p').text();
find() メソッドは、提供されたテスト関数を満たす配列内の、最初の要素 の 値 を返します。
最初の要素だから、p が複数あるなら、別々に指定しないといけない
テスト1 のp
テスト2のp
テスト3のp
個別に、クラスか何かを付ければ？ var l = data_array.length;
if (l > 51) {
l = 50;
}
for (var i3 = 0; i3 < l; i3 += 1) {～略～}
なんか、書き方がダサい気がする、かっこよくて見やすい書き方
をご教授願います。 const l = Math.min(data_array.length, 50)
for(let i3 = 0; i3 < l; i3++){}
変数名がダサいのは直してない >>456
早速の回答、ありがとうございます。
変数名や関数名の付け方がよくないのは
上司によく言われますが、直しません。 Ruby なら、Range で、0以上・len未満
( 0...len ).each { |index| p index }
出力
0
1
2 >>459
すいません。元のコードが間違えていました。
lに入る値の最大値が50が正しいです。 複数の画像を全て読み込んでからfunc1を実行したい場合、このような書き方で間違いがあったら教えてください
var img_obj_list = [];
var img_file_list = ["./test1.png","./test2.png","./test3.png"];
for(let n=1;n<=3;n++){
img_obj_list[n-1] = new Image();
img_obj_list[n-1].src = img_file_list[n-1];
}
var img_load_count = 0;
for(let n=1;n<=3;n++){
img_obj_list[n-1].onload = function(){
img_load_count++;
if(img_load_count == 3){
func1();
}
}
}
function func1(){alert("");} 細かくは確認してないけどonloadはpromiseでwrapするといい 画像の読み込み完了は、非同期処理か。
そりゃ難しい
async/await とか使えないのか？ >>461
Promise.allを使うか、handleEventを持つオブジェクトにload回数を埋め込んで管理すれば良い aaa.pngという幅１００ピクセル、高さ１００ピクセルの画像があるとして
<img src="aaa.png" id="aaa">
var elm = document.getElementById("aaa");
var rect = getBoundingClientRect();
としたら
rect.leftが8でrect.rightが108でした。
これって幅が101になるのでおかしくないですか？
rect.rightは107にならなければならないのに。 訂正elm.getBoundingClientRectです 間違いｗ
正直言って
(a)=>{
bar(a);
}
を引数に渡すのって可読性どうなんだろう？数学的には
美しいのかもしれないけど、世の中の大部分のプログラムは
そういうところまで行ってないプログラマが組んでるわけで。
そのうち、「大多数のプログラマにとって理解しやすいかどうか」理論
みたいのが出てこないかと…。 「大多数のプログラマ」じゃなくて「一年後の自分」で考えればいい
一年経ったら成長するだろ？その時に自分が辛くなるようなコードを書きたいと思うか？
プログラマを一年程度で使い捨てにしているところなら、
そりゃ一年以内の知識だけでやりゃあいいだろうさ
一年後にはプログラマをやってないわけだからな
成長するたびに自分が苦しくなるようなコードを
書き続けなければいけないのは地獄だってわかるかい？ >>469
その関数だけ見せられてもなにを意図したコードかわからんからなんともいえない >>471
x座標8～108だと101ピクセルあるので幅101になる
108-8=幅100ピクセルではない
なので107にならなければおかしいので間違ってないですよ >>473
width=0ならleft,right値が何になると思ってる？ >>466,473
あなたのロジックではこうなる
width=100なら、left=8,right=107
width=1なら、left=8,right=8
width=0なら、left=8,right=7
座標に1*1pxの実体があると認識してそう >>469
コードが断片的でわからんが、https://medaka.5ch.net/test/read.cgi/prog/1582181395/27 のことか？
> 27 仕様書無しさん 2020/05/24(日) 15:41:00.93
> 最近の言語って、
>
> Button.addEventListener('click', () => {
> //TODO ずらずらー
> })
> みたいな書き方が、主流のようなんだけど、
>
> 関数は関数できちんと宣言して書いて
> ButtonClick_Function(){
> ずらずらー
> }
> 他の関数(){
> ずらずらー
> }
>
> で、メインの部分で
> Button.addEventListener('click', ButtonClick_Function());
> オブジェクト.addEventListener('他のイベントA', 他の関数A());
> オブジェクト.addEventListener('他のイベントB', 他の関数B());
> オブジェクト.addEventListener('他のイベントC', 他の関数C());
> と、ロジックはロジック、コールはコールとかで並んでたほうが可読性高くね？？
> (以下略) >>475
MSペイントを拡大してドットを打つと一番左上のドットが(0,0)で右隣が(1,0)になってるよ >>477
MSペイントとCSSで同一のロジックが通用する根拠は何だ？ <img src="test.png" id="test" style="border:Solid 20px #0000ff;padding:10px ">
の画像のブラウザ上での絶対座標はどうやって求めるんですか？
getBoundingClientRectのleft,topだとborderとpaddingを含んだ座標になるので
これらを含まない画像のみの座標で htmlと画像は別物なんだから同じサイズになるわけないだろ
あとhtmlは仮想サイズ使ってるからドットバイドットじゃない HTML の要素内の位置とか、求めるのは無理じゃないか？
ピクセル操作なら、WebGL, Canvas みたいな所に描かないと無理かも >>480
html上の座標もpxピクセルで指定するのに何が違うのかわからん
>>481
width=0ならleft=8,right=7になるのでwidth=0ならエラー処理にする >>483
CSSボックスモデルはwidth=0を認めているのでエラー処理にするのは間違い やっとわかった
ワイが言ってたのはグリッド座標ではなくピクセル座標のことか
四角形の場合ピクセル座標の右端を＋１すればグリッド座標になるな
左端は同じだけど >>482
element.clinetLeftで左側のborderの幅を、element.clinetTopで上側のborderの幅をピクセルで取得できるので
getBoudingClientRectのleftとtopの座標にそのぶん加算すれば座標取得できたけど
問題はpaddingの幅をピクセルで取得できないこと
element.style.paddingLeftだとem指定の場合ピクセルで取得できないし ググるとforは普通のカウンターがだいたい最速のようですが
普通の言語は高速化のためにeach系があるはず
でも自分のサイトはEgdeで見る限り、forEachの方が若干速いような（ほとんど差はないですが）
forEach＞forカウンター＞for of
（for ofはforEachの改良版だと思ったんですが…）
でも基本的にjavascriptは驚くほど速いと思います
カウンターとeach系があまり変わらないのはeach系の性能が悪いというより、添え字検索が工夫されてるんでしょうか？
最後に見た要素の位置が保持されてて、次に来た添え字が1つ上なら再検索せず、each系のように次を返すとか そりゃ固定長の配列なら、リストをたどらないで、数値インデックスだけで計算できる。O(1)
例えば、8バイト固定長で[100]なら、800バイト先に内容のアドレスが書いてあるから、
そのアドレスから内容を読み込めばよい
一方、Elixir の片方向リストでは、先頭要素だけが速いだけで、
末尾要素はリストをたどって行くから、O(N)
Ruby では両方向リストだから、末尾も速いけど、メモリを食う
つまりデータを、固定長の配列の並びか、リストで構成しているかによる http://newpuru.doorblog.jp/
このサイトは何でfeedを取得しているのでしょうか？
ライブドアブログなのでphpは使えないはずです。 どこかのサーバーで、Ruby など何かの言語で、データを集めておいて、
JavaScript(JS)で、そのサーバーにアクセスして結果をもらっているとか？
それか、サーバーを使わずに、
JSで直接データを集めて、集計しているとか？ javascriptでh1やh2を検出して、ページ内リンクを作ることは可能ですか？
ライブドアブログで作ろうかと思います。
アンカーつけるのが面倒なので。
見出しにはアンカーはありません。
その場合でも場所を指定して、飛べるんでしょうかね。 他の言語とかフレームワークのスレ行ってみたけど糞みたいな流れでうんざりしました
ここの住人いい人多かったのね…
いつもありがとうございます。 本当は、web制作管理板で、JavaScript のスレを立てるべきだけど、誰も立てない。
jQuery のスレはある
この板のスレは、web制作管理板が荒らされた時に、緊急避難用に立てられたもので、
本来は板違い Web制作板は荒れ放題だったし、存在価値を感じない
質問者のマナーの悪さはこちらでも変わらない >>493
jqueryありじゃないとだめなのですか。
なんにしろ見出しにidを付与しないとだめですよね 素のJavaScript は、ややこしい
そのブログシステム自体が、jQuery を使っているかも知れない。
その場合、そのまま使えるかも jQuery学ぶのも大変なのでjsでやろうとしてます
とりあえず動的にidを追加することがまず必要ですよね idを付けずに実現するとしたら……
・querySelectorAll()で見出し要素をリストアップして表示
・それぞれのonclickイベントにwindow.scrollBy()でその要素の座標に飛ぶ関数を充てる
とか >>492
テンプレのFAQ>>3が素のJSで書いていた
hx要素を拾ってid拾うだけだし、そんなに難しくはない >>499
①適当なプレフィックス文字列を指定して、後ろに連番を付ける
②id衝突確認→衝突したらインクリメントし続ける >>500 501 502
ありがとうございます。
つまづいたらまた来ます。 >>499
jQueryは学習コストめちゃんこ低いよ
慣れたら素のJSでDOMいじるのだるくなる 教えてください。
https://gist.github.com/withmama/2925509
(function (global, oDOC, handler) {
～中略～
if (oDOC.readyState == null && oDOC.addEventListener) {
oDOC.readyState = "loading";
oDOC.addEventListener("DOMContentLoaded", handler = function () {
oDOC.removeEventListener("DOMContentLoaded", handler, false);
oDOC.readyState = "complete";
}, false);
}
})(window, document);
上記のようなコードがあるのですが、引数にhandlerに値を渡していないのに
handlerが引数にあります。
これって何か意味があるのでしょうか？
(function (global, oDOC) {
var handler;
if (oDOC.readyState == null && oDOC.addEventListener) {
oDOC.readyState = "loading";
oDOC.addEventListener("DOMContentLoaded", handler = function () {
oDOC.removeEventListener("DOMContentLoaded", handler, false);
oDOC.readyState = "complete";
}, false);
}
})(window, document);
っでよくないでしょうか？ >>505
関数スコープで変数を生成するだけならどっちでもいい
最も変数はなくても実装可能だが >>505
そもそも、readyStateは読み取り専用なのに再代入するとは…
仕様を理解しているとは思えんコードだな >>506
ありがとうございました。関数で変数生成しているのですね。
よく考えますと handler = function () でなくてもいいですね。下記のように。
oDOC.addEventListener("DOMContentLoaded", function() {
oDOC.removeEventListener("DOMContentLoaded", handler, false);
oDOC.readyState = "complete";
}, false);
>そもそも、readyStateは読み取り専用なのに再代入するとは…
そういえば、readyStateって勝手に値が変わるはずなのに、代入しないですね普通。 >>508
それじゃremoveEventListenerに渡してるhandlerが…
でもそのブロックの上のコメント見るとFirefox3.5以下用のポリフィルみたいだから今時いらんでしょ >>508
あなたのコードが間違っているのは2回目なんだが… >>460
検証済のコードを示すように心がけた方がいい /*
if (oDOC.readyState == null && oDOC.addEventListener) {
oDOC.readyState = "loading";
oDOC.addEventListener("DOMContentLoaded", handler = function() {
oDOC.removeEventListener("DOMContentLoaded", handler, false);
oDOC.readyState = "complete";
}, false);
}*/
こうですね。ありがとうございます。 連投すみません。
prototypeというのは、クラスのプロパティにアクセスするための記述と考えてもいいでしょうか？
prototype=組み込み、といった意味だと思いますし、、、。 let get_ul = document.querySelector("#test_ul");
let str = "hogehoge";
get_h2.insertAdjacentElement("beforebegin",str);
こうするとstrはオブジェクトじゃない、というエラーが出ます。
javascriptにおいてのオブジェクトとは、dom、つまりhtmlの構造を持つもののことでしょうか？
文字列を入れたいのなら、htmlと連結するのでしょうか。
>>516,517,518
ありがとうございます。全部見させてもらいます。 ↑上でやりたかったことはタグの中に文字列を挿入したかったのです
<a></a>
↑ここに「あああ」をはさみたいのです
innnerhtmlより、insertadjacenthtmlがいいと聞いて使ってみたんですが、文字型はオブジェクトじゃないと、、、。 >>521
textContent
createTextNode >>519
あなたはまず、DOMのノードの概念を学んだ方がいい
https://uhyohyo.net/javascript/2_1.html
HTMLタグで捉えるから本質とかけ離れた考え方をするようになる >>522
回答どうも
タグで包んだ場合はいけました
文字列だけの場合はtextContentですね
しかし、これはすべての内容物を書き換えてしまいます
そこでinsertadjacentを使いたかったです >>524
挿入ならappendChildでも良い >>525
ありがとうございます。
オブジェクトとそうでないものの違いってなんでしょうか？
全てはオブジェクトだと思うんですが。
stringはオブジェクトじゃないと。 連投すみません。
既存のタグの中にある文字を挟み込むように、新たなタグを挿入するにはどうしたらいいのでしょうか？
<div id="target_div">もじ</div>
↑これを
<div id="target_div"><p>もじ</p></div>
↑こうしたいです
let target = document.querySelector("#target_div");
let parag = document.createElement("p");
target.insertBefore(spa);
https://gray-code.com/javascript/add-html-element/
appendChild,before,after,insertBeforeはどれも違うようです。
前のpと閉じpを別に挿入することはできそうです。
まずtarget_divに対してpタグを先に追加して、innerhtmlで文字列を挿入したほうがいいのでしょうか？ >>526
オブジェクトでもあるが、ノード
困ったらMDNを読めば大体分かる
https://developer.mozilla.org/ja/docs/Web/API/Node/appendChild
>>527
replaceChild
いい加減、体系的に学ばないとリファレンスが読めるようにはならないと思うが >>523 javascriptでボタンを押したときにaaaという変数の値(現在100)を変えるには
<input type="hidden" id="aaa" value="200">というのを作って
ボタンを押したときに
var aaa = document.getElementById("aaa").value;を呼び出すというやり方でやっていますが
この方法以外で変数の値を変えるやり方あったら教えてください >>529
ボタンが押されたどうこうは変数値を変える機能に直線関係していない
変数値を変えるのは代入演算子
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Assignment
グローバル変数ならdefineProperty等のプロパティ操作系機能も使える >>528
オブジェクトの種類の１つがノードってことですね
yagniってのを信じてて、使うことだけを勉強すると
>>523
domってのはつまり、ただの階層構造ですよね 現実で実践するのは良いがやり過ぎは友達無くすよ
文字通り要らんのかもしれんけど javascriptの書物とか動画のおすすめとかある？
すでに書かれてあったらスマソ javascriptでは単なる文字列はオブジェクトではない、とみなされるようです
ノード（つまりタグ）に対して付与されるものであって、文字自体はオブジェクトじゃないということですよね >>535
どうも勘違いしていたようです
使用している関数の引数として適切ではないという意味だったようで insertAdjacentTextとinsertAdjacenetHtmlの違いってなんでしょうか？
<div>あああ</div>
どちらでも↑を↓の状態に出来ました。
<div><span>あああ</span></div>
動作の違いは感じられませんが ↑ああ、分かりました
adjacenthtmlだと、"<span>"などとしたときに閉じタグが付与されますね 勝手に これは、プロ用の初心者向けの本。
かなり難しい
初めてのJavaScript 第3版 ――ES2015以降の最新ウェブ開発、オライリー、2017 vscodeでjavascriptをhtml外から呼び出した場合、補完は効かないのですか？
htmlファイルとjsファイルを分けた場合、jsファイルでhtmlのidを取りたいなんていう場合
入力補完は当然出ません
このような場合はどうしてるのでしょうか？ 10数年ぶりにプログラミングやってみようかなと思い立った初心者です
JavaScriptをやってみようと思っているのですが、学習ルートとしてまずES6
その後TypeScriptに行くべきか、Reactに行くべきか迷っています
AltJSとフレームワークなので一概にどちらが先とは言えないかも知れませんが、あえて選ぶならどちらから学ぶべきでしょうか？
もちろん最終的にはReactをTypeScriptで書いてWebアプリを作ってみたいと思っています
どっちでも良いと言われるような気はするのですが、それでもあえて諸先輩方のご意見をお伺いしたいです いずれTypeScriptやること決めてるならわざわざJavaScript挟む意味ない
TypeScriptやってReact進めばいいだろ javascriptのオブジェクトが、多言語でのクラスということですか？ 違います
そもそも他言語のクラスとかひとまとめに我こそがスタンダードみたいに言うけど、そのクラスの用法ってクラスベースオブジェクト指向特有のものでしょ。
まぁJSも追従しちゃったけどさ。 父のプロトタイプから包茎を継承してしまったようです >>542
その二択ならTypeScript
文法を先に学ばないと躓く
ES6は2015年の仕様で今から学ぶには古すぎる
ES2020を学ぶ方が効率は良い
http://www.ecma-international.org/ecma-262/11.0/ うせやろ
ES6で古いんだ
IE対応しないと駄目だったのでアロー関数使ってないから忘れたのに…
もう駄目だな… オブジェクトリテラルはプロパティと同義ですかね？
オブジェクトの持つデータですよな >>553
違う
あなたは先日からおかしな前提の質問ばかり
知識の穴が多すぎて一問一答で出来る範囲を超えている
YAGNI信じてるようだが、必要になったら基礎学習する習慣をつけるべき > prototype=組み込み、といった意味だと思いますし、、、。
専門用語が分からない
↓
そうだ英単語の意味から推測しよう
↓
英単語の意味から間違えている
いくらなんでも酷すぎ
プログラミング関係なく問題解決の取り組み方が杜撰で稚拙すぎ
辞書引くことすら失敗するとか一体どういう教育受けてきたの 自分で調べるより専門家に聞いた方が早いと思うタイプの人なんだろう
>>555のようにちょっと調べればわかるはずの内容を質問したり、回答したURLを全く読んでないかのような反応が返ってくる
DOMもプロトタイプチェーンも学習した形跡がない 忍耐強く付き合ってくれる方々が居るうちはYAGNIで上手く行くのかも知れない
早々に匙を投げてしまった自分が言える立場じゃないけど オナニーメソッドは定義されてますが
セックスメソッドが見当たりません C#の拡張メソッドはやってることが分かりやすいね
staticと宣言され、thisが第１引数
ただ宣言と利用で引数が違うのが気持ち悪い
C#で基礎的に多い使いどころはnull処理や型変換
なんでも型としてobjectがあるので
でもやたら型に煩いので中の分岐が面倒
javascriptの引数は全てなんでも型だが、逆にprototypeのthisだけは型が必要
なので、null処理や型変換は、普通の関数にしてる
そもそも「メソッドチェーンはnullで止まる」とか、最初から言われてたり >>559
> javascriptの引数は全てなんでも型だが、逆にprototypeのthisだけは型が必要
後半はちょっと意味がわからない
this値はStrictModeで指定値をそのまま使い、SloppyModeで指定値をObject型に変換した値を使う
型の制約はないはず オナホールに型があるとは知りませんでした
密閉型のつもりで射精したら貫通型だったらしくリークしてしまったようです arrayとDocument.createDocumentFragment()の違いってなんでしょうか？
createElementで作成したタグを、ターゲットに複数追加したい場合、後者を使います。
しかし、arrayにもアンカーは格納されているようです。 >>561
nullでも問題はない
実証コードを書いて、問題が起きるパターンを整理してみては？
Object.prototype.toString.call(null) >>563
回答スルーして新規質問を量産してるが、何がしたいんだ？ createDocumentFragment は、jQuery でも使っている
ソースコード内を検索してみ >>564
Object.prototype.foo=function(s){略}
null.foo() こう書けないなら
function foo(s){略}
foo(null) こうせざるを得ない、ということなんですが
null.foo().bar() この利点は
bar(foo(null)) これより目に優しいという >>567
いろいろと誤解があるので、プロパティアクセサ、プロトタイプチェーンについて再学習することをお勧めする
(ちなみに、あげられている問題は「this値」は全く関係していない。用語定義も見直したほうが良いと思う。)
Object.prototype.foo を定義してfooプロパティを参照できるのは、new Objectかプロトタイプチェーン上に Object.prototype が存在するオブジェクトに限定される
プロパティアクセスする際、それがPrimitive値であるなら、Object型に変換してプロパティ参照を試みるが、null, undefined はObject型に変換できず、TypeErrorとなる
(null).toString; // TypeError: Cannot read property 'toString' of null
(undefined).toString; // TypeError: Cannot read property 'toString' of undefined
なお、null,undefinedでなくても、プロトタイプチェーン上に Object.prototype が存在しなければ、Object.prototype.foo をプロパティアクセサで参照できない
Object.prototype.foo = 1;
console.log(Object.create(null).foo); // undefined
Object.prototypeの影響範囲は大きいが、それでも全てのデータに影響を及ぼすものではない >>568
だからnullは駄目ってことですよねｗ
（C#ではそれができるという違い） >>569
null.foo()が動かない背景の説明>>567,559が何一つ正しくなくて比較対象として成立していない、という話 JavaScriptは初心者向けの簡単な言語と言われているけど、ものすごく難しくないですか？
Javaとアセンブラも出来るけど、JavaScriptの方が圧倒的に難しい。 当たり前だけど初級レベルはそれほどでもない
しかし製品レベルを作るとなると一気にナンジャコレ的な書き方でジャバパーたちには理解不能になる
そこにDOM、jsxやstyle componentとかも入ってくるからもはや宇宙語になる JavaScriptはWEBブラウザを誰でも持っていて環境が身近だから試してみやすいというだけで、言語自体が初心者向けというわけではないだろ。
まともに使おうとしたらかなり筋の悪い言語。所詮はWEB用のDSL。
Excelは持ってるからVBAやってみるみたいなもんだよ。 >>571
JavaScriptの理解が難しくなる下地は十分にある
- 複数の仕様書
- 複数ブラウザで動作確認
- 新機能作成時の制約(一定の後方互換性を担保)
それ以前にESレベルの基本を分かってない人が多過ぎな気はするが
- 型
- [[Prototype]]
- プロトタイプチェーン
- スコープチェーン JavaScript(正しくはECMAScript)ほど仕様しっかりしてる言語は今メインストリームの言語でそんなにはないと思うけどな。Cはしっかりしてるけど、かなりコンパクトな言語だからドキュメント量が全然違う
RubyやPythonにいたっては酷いもんだ。思い付きで作ってるレベル 仕様が複数あると言っても、Babel使ってES2020から入るのが正解だろうね。
余計なことを学ぶ必要性が減る。プロトタイプチェーンなんて最初は知らなくていい。 Babelで後方互換性担保できるといっても
Setみたいに色々なことができるせいで機械的な書き換えができないコンストラクターがあるからなあ
業務端末が古いandroidのイントラ案件でSet動いてないの気付かず3時間くらい無駄にしたわ JavaScript関連の仕様はECMAScriptの他に、DOM,HTML,UIEvents,fetch,Selectors,CSDOM等、多くの仕様がある
Babelを使えば、ECMAScriptをES2020に一本化出来るが、他の仕様は読まなければならない
仕様書の中には日本語訳がなく、英語を読まなければならない場合もある
対して、Ruby,Pythonは公式マニュアルの日本語訳一つを読めば事足りる
資料の読みこなしの面では、JavaScriptの難度は非常に高い
不正確な二次情報に惑わされたり、MDNも時々間違ってたり、罠が多い DOMを扱うならDOMを学ばなきゃならんというだけでJavaScriptとは関係ないが？
RubyやPythonを使ったとしてもDOMを扱うなら同じように必要だろう。
Webだけで学ぼうとすると古い情報に惑わされやすいというのはその通りだな。
ちゃんとした書籍を1冊用意して学ぶのが吉。 >>581
Python公式文書はDOM APIの説明があるので、DOM仕様書を読まずともある程度の情報は得られる
https://docs.python.org/ja/3/library/xml.dom.html
ESにはDOM,HTML,fetch,CSSOM等のAPI情報は当然ない
MDNがこの役割に近いが、仕様程の信頼性がなく、英語版と日本語版で情報に差異があったり、仕様と比べて情報鮮度が落ちている部分がある
体系的な一カ所にまとまった一次情報と呼べるものがJavaScriptにはない
実装が複数仕様を実装する形なので当然だが、調査コストが高いのは事実
Pythonは仕様と実装が同一なので、仕様と実装の差を区別する必要がない
ドキュメントも仕様と実装の2つ分を読む必要がなく、最新の情報に整備されている 糞どうでもいいさにしか思えないがそこまでして優劣をつけたいんだろうか >>583
ちゃぶ台返しだな
>>571と>>581にいってやれ ？
DOMを持ち出すのは関係ないし糞どうでもいいことなのは変わらんが？ １個の商品の金額の場合オブジェクトでvar shouhin = {};と宣言してshouhin.kingakuとすればいいんですが
複数の商品の場合shouhin[1].kingaku、shouhin[2].kingakuのようにしたいんですが
宣言や関数で引数として渡す場合はどうすればいいですか？ 内部関数をコールバックに渡せるのは超楽だね
同名のグローバル関数があってそっち行くかな？と思ったらちゃんと内部関数に行った
（そもそも普通の関数に内部関数をほいほい書ける時点で超楽だが）
コールバックがグローバルに限定された言語の場合、名前管理が増えるのが嫌で、
なんとかコールバック使わずに、とか頭をひねっちゃう classを使ってる奴いる？
今まで通りfunctionのコンストラクタで十分だよな。 >>589
誰のためにあるかという話だわな。
なおクラス構文導入議論時、反対派の旗手だったのはグッドパーツ著者でありJSONの発明者でもあるダグラスクロックフォード。
https://www.graat.co.jp/blogs/ckn8ourdkezx50b95h4v5uk1o
障害物 #1: .NET開発者のチーム参加
概念実証の後は、クライアントのアウトソーシングチームの開発者が合流した。 知識共有はまだ始めておらず、CTOから「やあ、Răzvan。明日は本物のアウトソーシングチームと会わないといけないね」とメールが送られてきた。
我々はミーティングを設け、テクニカルリードは私を質問と解決策で迎え撃った：
「依存性の注入はどこですか？『必要ない』とはどういうことですか？」：これはInversifyJSだよ！
「関数コンポーネント？ ダメダメダメ。我たちは好きじゃないからクラスコンポーネントを使いましょう！」
「なぜこれらの関数はただぶら下がっているだけなのですか？ なぜ静的にするためサービスクラス内でカプセル化しないのですか？」
「APIのリトライポリシーはどこですか？ PollyJSで実装しましょう」
「なぜクラス名がパスカルケースの場合にファイル名がダッシュケースとなるのですか？ クラス名を反映させるため、今後はSomePageComponent.tsxという名前にします」
そして、私をもっとも悩ませた件：「Visual Studio CodeでなくVisual Studioで実行するにはどうすればよいでしょうか？」
私は確信した。彼らはReactで .NETのガイドラインとデザインパターンを使いたがっている。私は何度もこのような出来事を見てきた — 新しい技術のやり方に適応できず苦労している開発者だ。
↓
9か月後、我々は50ページ以上を作成していた。開発者たちは関数コンポーネントがクラスコンポーネントと同じくらい良いことに気づき、それらを使い始めた。その結果、進行中のプロジェクトは元々のコーディング規約に従わなくなっていた。
本当.NET老害ってクソだわ。
自分が分からないからって意味ない（できることが増えるわけでもない）クラスベースに固執しといて、単純な関数で同じことできると気づいたらお前らのワガママに合わせて作ってやったコーディング規約破って勝手に使い出すんだからな。
いや、言いだしっぺなんだからクラス使い続けろや！ >>590
結局これも将来的には非推奨になりそうですよね。
中途半端な機能を増やされると現場はかえってしんどい。 要素を取得して、appendchildしたいのですが、appendchildは移動になるんですよね。
そこでassignでコピーしたいと思います。
以下のspanをコピーした後、別のspan内に入れたいです。
<span id="test_span" style="background-color: skyblue;">てすとな</span>
<ul id="table_of_content"></ul>
let toc = document.getElementById("table_of_content");
let span = document.getElementById("test_span");
let copy = Object.assign(document.createElement("span") ,span);
toc.appendChild(copy);
しかし、これだとtable_of_contentにspanは挿入されますが、spanの中身がありません。
let copy = Object.assign(document.createElement("span") ,textContent:span.textContent);
こうへんこうしてもだめです。
let copy = Object.assign(document.createElement("span") ,{textContent:span.textContent});
これならokです。
なぜこのような結果になるのでしょうか？
マージするオブジェクトの型？みたいなものが一致していないとだめなのですか？
１つ目はタグにタグをコピーしているだけ
２つ目はタグにプロパティをコピーしている
３つ目はタグオブジェクトに、オブジェクトリテラル？をコピーしている？
この辺のことを教えて下さい Nodeオブジェクトに元から存在するプロパティは列挙可能になってないからそのままObject.assginしても何もコピーされない
textContentプロパティだけを取り出してObject.assignするくらいなら
let copy = document.createElement("span");
copy.textContent = span.textContent;
でいいじゃない
もっともノードの複製は
let copy = span.cloneNode(true);
で一発。ただしid等の一意であるべき属性も存在する場合は複製されることに注意 >>593
ノード全体をコピーする場合はcloneで、タグ名などを変えたい場合は教えてもらった方法でやることにします。
1行目なんですが、「 Nodeオブジェクトに元から存在するプロパティは列挙可能になってないからそのままObject.assginしても何もコピーされない 」というのはどういう意味でしょうか？
1つめのやり方に対してだと思いますが、どちらのspanエレメントもtextContentプロパティは持っていると思います。
とりあえず、中身もコピーする場合はプロパティにまでアクセスしないといけないことは分かりました。
object.assignというのはループを回しているわけですよね。おそらく。 素のJS書いてます
DOM要素の中身をまるまる消したいんですが、もっといいやり方ないですか？
今はinnerHTML=""で消してます var el = document.querySelector('#nakamikiero');
while (el.firstChild) el.removeChild(el.firstChild);
別にinnerHTMLでいいと思う 
初心者です。
chrome拡張機能を作っているのですが、自分のコードが他の人から見たら、見づらかったりするのか気になったので評価してくれませんか？
一人で作っているのでコメントはほぼないです。
https://harigami.net/cd?hsh=b5c6452f-fa81-4b69-b554-d68bf8194d75 constって値の変更できないのであとから値を変更したくなった場合letに書き直さないといけないので
最初からconstよりlet使った方が無難だよね？
constの方が速度が速いってこともないだろうし JITの最適化に影響することはあるんじゃない？知らんけど
個人プログラムならそう困ることないし別にいいと思う letってスコープ外からアクセスできないのであとからアクセスしたくなった場合let消してグローバル変数にしないといけないので
最初からletよりグローバル変数使った方が無難だよね？
letの方が速度が速いってこともないだろうし >>601
グルーバルはどこからでも変更できちゃうので基本使わない
せやから変数はバケツリレーしてでも引数として渡す >>602
それが分かるなら、「letはスコープ内で改変可能なので、再代入が必要な変数以外では使用しない」に辿り着くはずなんだがな 再代入が必要な変数が全体の何割あるかまず眺めてみたらいいんじゃね
更にあとから再代入の必要性に気付くパターンに絞って何割あるのか >>602
>>601 がアイロニーだってことくらい気づけよ。 DIVの中にline-hightを設定したテキストを入れた時と同じ場所になるようにDIVと同じサイズのCanvasの中に文字を書き込みたいんだけどどうやるの(´；Д；`) >>608
line-height内でのテキストの上下方向の位置を合わせる方法がわからない >>609
border,line-height,paddongを計算すればいい
というか、ボックスモデルを読め サンプルがこれなんだが、最後の 80*0.64 って奴がline-height*割合で
割合を調整してベースラインの位置に来るように調整してあるんだがfont-sizeやline-heightを変えると0.64じゃ一致しなくなる
https://codepen.io/as124680/pen/wvdwWyO <table id="tb">
<tr>
<td><img src="./test1.png"></td>
<td><img src="./test.2png"></td>
<td><img src="./test3.png"></td>
</tr>
</table>
tableの中にあるimgのelementを取得したいんですけど
imgに個別にidやclassを設定しなくてもそれぞれのimgのelementを取得できる方法があったら
やりかたを教えてください >>615
document.querySelectorAll("#tb td > img");
セレクタの指定は適当なので目的に応じて考えてくれ 「css セレクタ」で検索！
x y は、xの子孫(子・孫・玄孫なども含む)のy。
x > y は、xの子(直下のみ)のy
JavaScript の質問は、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、緊急避難用に立てられたもので、今は使われていません プログラミングするときは必要な処理を必ず日本語化したほうがいいですか？
まず、必要な機能をすべて書き出してから、フローチャート的なものを作る
ぶっつけでコードを書き始めると駄目ですかね。 ストップウォッチを作っています。
１：スタートボタンを押した時にカウントアップを開始し
２：もう１度押すと停止します
３：もう１度押すと途中からのカウントアップを開始します
この途中からのカウントアップのやり方がわからないのでヒントを教えて下さい。
addTime変数にカウントアップ途中の数値をセットし、3に加算すればいいわけですが、上手くイカなかったので教えて下さい。
わからないのはaddTimeの取得方法と、加算のタイミングです。 https://ideone.com/Fq7ki3
コードはこちらになります。
別の質問なんですが、コードのペーストサービスってどこがいいんでしょうか？ 一人で作る場合はそんなことしてる奴ほぼいないと思う
チームで作るならそれをするのはPMの仕事 JSFiddle が多いかも。
Ideone とか
Codepad は、バージョンが古い感じ
日本なら、paiza.IO >>623
どうも
performanceを使うといいんすね
差分の部分も参考にさせてもらいす
わからなかったら聞きます jaavscriptって型あるんですか？
let ms= 1000
としてもデータオブジェクト？じゃないので、getUTCSeconds()などが使えません
let ms = new Date(1000)
これでokです
>>624動作確認しやすいのでjsfiddleにしときます JSは動的型付け言語なので当然型はある
あと所詮60の除算をしてるだけなので、いちいちDate型に変換するのはぶっちゃけ大仰 >>623
performance.nowって時刻を取得して差分を求めるより、正確なタイマーになるんでしょうか？
utcの時刻です。 ブラウザ次第としか
最近は敢えて精度を落としてることもあって、多分変わらんかも >>630
performanceについての質問はしてないですよ。
performanだとcpu性能などに影響されるのか分かりません。 >>631
失礼、performance.now()には触れてなかったな
だが、リファレンスに書いてある
https://developer.mozilla.org/ja/docs/Web/API/Performance/now
> performance.now() メソッドは、ミリ秒単位で計測された DOMHighResTimeStamp を返します。
---
https://teratail.com/questions/348048
> あらゆるイベントに timeStamp というプロパティがあり、これが 0.005ms 程度の精度だそうです。
こう回答されたら、俺ならtimeStampプロパティを使うが >>632
performanceはタイムスタンプを取得しているそうですが、その取得にはcpu性能が影響するのでしょうか。
最初のタイムスタンプの取得が遅れたとしても、終了時のタイムスタンプも同様に遅れるわけですから、差分は変わらないと考えればいいでしょうか。 >>633
CPUに影響しない処理はほとんどないも思うが、GPU演算を期待してるのか？
ハードウェアアクセラレーションは門外漢なので分からん
専門家に確認してくれ
そこまで気にしていて、requestAnimationFrameが候補に挙がらない理由が謎 質問の意図がよく分からないので何とも
完全無欠なタイマーが作りたいって話なら力にはなれん >>634
ありがとうございました。
gpuを期待しているわけではないです。
非力な環境で正確な動作をするかどうか分からないのです。 msから時間（hour）を取得する関数はあるのでしょうか？
getutchourとgethourだと、時刻？が取得されるみたいです。
http://www.htmq.com/js/date_getUTCHours.shtml
1日が86400000msなので、何時間か得るにはこうします
86400000 / 3600000 = 24
getutchoursを使用すると結果は0となります。
let dt = new Date(86400000);
console.log(dt.getUTCHours()); 最近javascriptを始めた者ですが、最初の段階からつまづいています。
参考にしているのはこの本ですが「https://www.sbcr.jp/product/4815601577/」
ブラウザのコンソール機能を使って文字を表示させるのですが、上手くいきません。
「>console.log('おうむ返し');」と打ち込んでも、「Uncaught SyntaxError: expected expression, got '>'」
と言うエラーメッセージが出て上手く表示されません。
本に書いてある通りにやっているつもりなのですが、何故なんでしょうか？
宜しくお願いします。 console.log('おうむ返し');
と打ち込んでください エラーメッセージにそのまま書いてるだろ
なんで読まないんだよ >>642
「illegal character U+FF1B」と出るのですが・・・ 自己解決しました。
「：」を付けるなと言うエラーでした。
しかし、本には「>」「；」を付けろと書いてあるのですが
付けてはいけないのでしょうか？ 「javascript console.log」で検索してみれば？ u+ff1bは全角のセミコロン(；)
;みたいな半角にすれば上手くいく
セミコロンに限らずプログラムを書く時は文字列、コメント以外は基本全角を使ってはいけないことを意識した方がいい
JavaScriptの場合文字列にあたるのは"文字列"、'文字列'、`文字列`の3種類 言い忘れてたけど>はコンソールの入力を表してるだけだからそれ自体は入力しない
javascriptと直接は関係ないけど$とか#も同様 まああとエラー文くらいは英語でも読もうぜ
せっかくエラー出してくれてるんだから 都道府県のデータを地図上に表示させる場合、なにかしらapiを使いますか？
例えば、人口のデータ。
東京10万人、大阪5万人というデータだった場合、東京を赤に、大阪を青にします。
cssのareaとif文でできそうですが、グラフィカルに出来るやり方はあるんでしょうか？ 知らないけど、Google MAP と契約するのじゃないの？ >>651
googlemapほど高機能じゃなくてもいいんですよね。
単なるグラフ化するライブラリなりあれば
ただ、地図ですが JavaScriptエンジニアって国内に何人いるのだろう？
JQueryとAltJSは省いて純粋にJavaScriptを書ける人を対象にした場合。
下のゲータは明らかにおかしい。なんでCSS < JavaScriptになってんの？
21種類のプログラミング言語別エンジニア数
HTML ：325,954人
JavaScript ：299,426人
Ruby ：215,270人
Java ：190,343人
CSS ：187,243人
Python ：176,419人
PHP ：168,821人
C ：131,520人 >>655
というかHTML書けてCSS書けないってどういう状態か不明で草 たぶん、アンケート調査で、HTML, JS, Ruby には使う印を付けるけど、
CSS には付けないのだろう JavaScript技術者は約３０万人もいるのか…。 >>660
アレ？
CやPHPより多いというのはどういうことだ？
JQureryを貼ってるだけでJavaScriptエンジニアを名乗っている奴もいるということか？ >>662
え、本当ですか？
JavaScript技術者は日本国内では実際にどの程度いるか分かる方いますでしょうか？
JQueryのみは除外した場合で。 javascriptわからない奴がjqueryを使いこなせるとも思えんが >>664
とりあえず貼り付けて使ってた女子社員がいた。
当然プロトタイプって何？ 美味しいの？ という感じだった。 まともなwebデザイナーならjsやjqueryくらいなら当たり前に使えるし まともなWebデザイナが少ないと思ってる
このスレでも余所でも何もわかってない丸投げ質問が少なくない ５ｃｈに丸投げ質問してる人が何でWebデザイナだってわかるの？ >>666
JavaScriptがよく分かってない人は多い。
で、国内のJavaScriptエンジニアはどのくらいの数がいるの？ javascriptが動かない環境ってまだまだあるんでしょうか？
ブログの見出しをjavascriptで取得して、ページ内リンク(目次)にしたいのですが。
wordpressならそのようなアドオンがあるんですが、ライブドアブログなので。
見出しは記事内に手書きしたほうがいいでしょうか？ JavaScript の質問は、この板ではなく、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、一時的に緊急避難用に立てたものです 今来てるのがあらしなら
隔離がうまく機能してると言える訳で
本スレや本板を教えるのは逆効果 const thumbs = document.querySelectorAll('.thumb');
thumbs.forEach(function(item,index) {
item.onclick = function() {
document.getElementById('bigimg').src = this.dataset.image;
}
}); スクレイピングしたいんですけど何を勉強すればいいですか
不正アクセスに問われたりしないでしょうか？
セキュリティ対策はどのようなことに注意すればよいでしょうか？ ブログ記事のヘッダ(h要素)を取り出して目次化する機能をjavascriptで作りました。
目次ってのは直接、idを指定して作ったほうがいいんでしょうか？
このような疑問を持ったのは、javascriptが動かない場合を考えてです。 >>680
ワードプレスならプラグインがあるんですが、ライブドアブログなんですよね。
調べましたが、おそらくないと思います。 JavaScript の質問は、この板ではなく、web制作管理板の方へ書き込んでください！
この板のスレは、荒らしが出た時に、一時的に緊急避難用に立てたものです >>683
元々はWeb制作板が本スレだが、Web制作板もある時から次スレが立たなくなり、重複スレの再利用しかされなくなっている
既に本スレがどちらといえる状況ではない為、好きな方に書き込めば良い 最近、ステップ実行というデバッグ方法をはじめてみたんですが、使い方がよくわかりません。
質問です。
１：ステップ実行はブラウザの機能を使うのが普通なんでしょうか？firefoxです
２：ブレークポイントから実行されるようですが、行末までいったらブレームポイントに戻るという挙動似できないのでしょうか？
firefoxです Node.js, VSCode をインストールするのが基本
VSCodeの拡張機能も一杯あるし、デバッグも出来る >>687
どうも
htmlファイル内のjsをデバッグする場合はブラウザになるんですかね？ Firefoxの挙動を調査するにはFirefoxを使う VSCode で、break point を付けたりして、1行ずつデバッグする。
好きなブラウザも起動される
例えば、ボタンをクリックした時のコールバック関数に、break point を付けて、
ブラウザでボタンをクリックすると、そこで止まる
そこから、1行ずつデバッグするような感じ
まあ、VSCodeの使い方・おすすめ拡張機能を学ぶのが先。
YouTube でも見れば？
この板にも、VSCodeのスレがある >>689
>>690
どうも
ブラウザで動かすものなので、すべてブラウザ上のデバッグツールでは駄目なんでしょうか？ >>691
そのWebページを訪れる全てのWebブラウザでデバッグするのが正しい node jsとvscode使ってみたんですが デバッガーのタブを開いて、node.jsをデバッガーとして開き、runcurrent fileを洗濯するという手順でいいんすかね？ >>692
vscode上でのデバッグだとまとめて出来るという意味でしょうか？ >>694
どのようなロジックでそのように解釈した？
VScodeはブラウザではないし、>>691のあなたの考えから飛躍している
意味がわからない >>695
node.jsを使ったデバッグだとまとめてできるのかなと思いこんでました
node.jsはブラウザをvscode上で再現するものではないのですか？
console.logの結果をdebug consoleに表示出来たり。 >>687あたり見て言ってるんでしょ
何が基本なのか知らんけど >>698
そんなんだろうが、そこから憶測で物事を決め付け過ぎる ボタンを無効化したいです
button.setAttribute("disabled");
これだとdisabledがセットされないのですが、なにか間違っているでしょうか？
valueを追加しても同じです。
サンプルコード通りにやってみたんですが、、、 valueは必須
>>1読んでからサンプルコードがあるならまずそれを出して ここは答えだけ教えてもらえる場所じゃないから
それを求めてるなら別の場所に行って >>702
第二引数が省略可能とどこに書いてある？
省略時に属性値が何になったか確かめたか？
setAttributeでdisabled属性を指定する方法をぐぐったか？
setAttributeのMDN英語版を読んだか？ JavaScript の実行環境には、Node.js・ブラウザの2つある。
Node.jsを入れておくと、JavaScript のコード片を、
ブラウザを使わずに実行できるので便利
例えば、拡張機能・Quokka.js では、
console.log しなくても、オブジェクトの中身が表示される
let a = 1
a //=> 1
拡張機能・Code Runner では、右クリックメニューから、
ファイル全体または選択したコード片を実行できる
上の2つは、Node.jsの実行環境
一方、ブラウザで実行するなら、
拡張機能・open in browser では、ローカルファイルアクセスになる
一方、拡張機能・Live Server では、
自分のPC 内にサーバーを立ててから、そこから配信されるので、テストしやすい
ローカルファイルアクセスでは、CORS など、ブラウザの色々な制限がある
どの道、Node.js は絶対に必須。
npm/yarn, webpack, babel など、様々なツール・プロジェクトで使っているから。
Ruby on Rails でも必須 ロジックが分からないといった場合、デバッグは役に立たないのですか？ >>708
ロジックが分からなければ、コードは書けない
デバッグ以前の問題 ステップ実行というのは同じ範囲を何度もループ出来るんでしょうか？
例えばクリックするごとに数字が加算されていくというばあい、同じ範囲をループさせる必要があります
<button id="button1">ボタン</button>
<script>
let button1 = document.getElementById("button1");
mode = false;
num = 0;
button1.addEventListener("click" , function()
{
switch(mode)
{
case false:
mode =true;
num += 1;
break;
case true:
mode = false;
num += 1;
break;
}
console.log(num);
});
</script>
このコードのaddEventListenerの範囲を何度もループさせたいのですが。 イベントにブレークポイント仕込んで
何回もクリックすればええやん >>714
すみません
firefoxなんですが、例えばブレークポイントを以下のように仕込んでもループしません
開発環境によって違うのでしょうか？
以下の0と5にブレークポイントを仕込み、step inを連打しているのですが、この範囲をループしません
console.log("0");
console.log("1");
console.log("2");
console.log("3");
console.log("4");
console.log("5");
>>715
どうも
調べてきます 「javascript 繰り返し」で検索！
for, do...while, while
label, break, continue
for...in, for...of ideやブラウザではなく、コードの方で対処するということですか？ コードに書いてない動作をしたら
デバッグにならんでしょ コードで繰り返してないのに繰り返したらおかしいじゃん
何度もクリックすればいいってのは、イベント仕込んだ要素をってことでしょ
ステップイン連打って、どこをどうしたらそういう理解になるのかわからん >>716
カウントが追加されているかを確認したいんだったら、
デバッグ用にクリック時に変数値を表示するアラートでも出したら？
なんか根本的な部分がわかってない気もするんだけど。 >>721
ステップ実行を使いたいんですよね
ステップ実行で繰り返しは出来ないんですよね
確かに根本は理解出来ていないです >>713
ブラウザを起動して、HTML を読み込んで、
開発者ツールのコンソールを開きながら、ボタンをクリックしていくと、
コンソールに、1, 2, 3 と表示されて、ちゃんと1ずつ増えていく >>722
ステップ実行でもbreakpointでもコードにない動きはしない click イベント内で、break point で止めてから、step 実行していっても、
callback 関数を抜けると、実行が止まる
そこで一旦、ブラウザに戻って、またボタンを押さないと、
callback関数が呼ばれない
つまり、イベントの場合は、VSCode だけでは出来ない。
同時にブラウザも操作して、イベントを起動しないといけない >>725
ステップ実行が何かを調べる事から始めるべき マジですまんが何がやりたいのか分からないのでまともなアドバイスが出来ない
「ステップ実行で繰り返し」が最終目標なら諦めて click イベント内のcallback 関数は、VSCode だけでは実行できない
同時にブラウザも操作して、イベントを起動しないと、
callback関数が呼ばれない >>723
ボタンをクリックしていけばそうなんですが、ステップ実行のstep inの連打でそのような挙動をさせたいのですが、無理なんでしょうか？ >>730
ステップ実行はあくまで、ブレークポイントまでを順に降りて実行するだけ。
意味もなくステップ実行にこだわるなよ。 ん？イベントハンドラの中をステップ実行したいの？
ソコが少し分からん。
あと、バベってたりしない？うまく掛からん事があるよ。 複数から>>718-720,724といわれて、未だにステップ実行で繰り返し処理しようとしてるのは理解出来ない ステップ実行のロジックを理解しなぎゃ話にならない
>>708は何だったのか ChromeならgetEventListeners使ってコンソールから直接イベントを繰り返し発行すればいい
listeners = getEventListeners(button1)
listener = listeners.click[0].listener
// debug(listener) // set breakpoint
for(let i=0;i<10;i++) listener() >>733
繰り返し処理のデバッグはステップ実行を使わないのですか？
ステップ実行がどんな場面で必要かよくわかりませんが、 質問者はブラウザを操作しないで、VSCode だけで、イベントを繰り返したいのだろ？
ブラウザのボタンをクリックすると、イベントが呼ばれるから簡単なんだけど
クリックなど、ユーザーのアクションが無いと、
イベントが呼ばれない事を知らないのかも array.lengthで取得できる配列の長さって、実行時に数えているのでしょうか？
それとも要素数を値として持っているのでしょうか？ 数えてるという言い方が正しいかわからんが
valueを削除したあとlengthを再取得すると減る array.lengthがO(1)かO(n)かってこと？ >>736
繰り返し処理がないコードで繰り返し処理が出来るわけない
コードに繰り返し処理を入れて、デバッグしろ、と何度もいってる さすがに、配列の要素数ぐらい持ってるだろ
関数型のElixir では、リストの要素数を、その都度数えるけど。O(N) >>741
ブレークポイントの範囲内で動かすというようなことが出来るのかなと >>745
繰り返し範囲をどうやって設定するんだ？
何か設定をしたのか？ >>746
ブレークポイントを２つ設定することで、範囲が指定されるのかなと考えていました >>747
3つあったら3つ目には永遠に辿り着かない？
あなたの想定する挙動が公式ヘルプのどこに書いてあった？ >>748
ブレークポイントは２つです。
この範囲内のみの実行が可能かと思っていました。
ヘルプは読んでいないのですが、そういうものかと思いこんでいました。 「ハンズオンJavaScript」と言う難解な本を読んでいます。
classの学習に入る前に、
classを使わずに関数で他のオブジェクトの構造を継承と言うか取り込んだ後、
自身のインスタンスを生成し、
それを返す関数の定義が以下のようにされているのですが、
ここでスプレッド演算子を用いている意味がさっぱり分かりません。
(書籍に説明もありません)
外すとまともに動作しなくなります。
このスプレッド演算子からなる「...parent」は
どういった働きがあるのでしょうか？
function Vector3( x, y, z )
{
let parent = Vector2( x, y );
const o =
{
parent,
...parent,
z,
lengthSq: Vector3_lengthSq,
add: Vector3_add
};
return o;
} parentで親のプロトタイプチェーンにつないで
…parentで親のプロパティをコピーしてるんではないかな javascript技術者は日本国内で何人ぐらいいるのでしょうか？
10万人？ >>753
https://www.netvisionacademy.com/magazine/3230/
> 経済産業省の調査によると、2020年現在のIT人材数は約100万人、
>不足数は約30万人と推計されています。 >>751
レスありがとうございます。
ご助言頂いた後に、何故「parent」を包括してるのに
わざわざ「...parent」と展開しているのかに悩まされたのですが、
継承元のメソッドをオーバーライドしているため、
継承元のメソッドを参照するための措置だと理解するに至りました。
何はともあれすっきりいたしました。ありがとうございました。 >>754
100万人の内JavaScript使える奴は50万人はいるね…。
がっかり。 デザイナーの方が
複雑なアニメションや3Dとか
実装のスキル高かったりしますよ
cssとかのビルドシステムとかも
開発同等ですし プログラミングにはまる方法ありますか？
もう１日獣コーディング出来るという感じの 百獣の王ライオンのように獣分勉強することが獣要だ。 獣コーディングってカッコいいな
コーディングバトルものにありそう javascriptでゲージを表示出来るライブラリってないですか？
かんたんなものでいいんですが
円形や半円形で、残り時間を表示出来るようなもの >>759
> cssとかのビルドシステムとか
どういう意味？ scssとかのcssプリプロセッサやら普通に使うんやから
glupとかGruntとかのビルドシステム組むでしょ
そもそもjsでアニメーションコード書いてんだし あと、UI/UXの設計もデザイナー側でやることが多くなった
そうすると、開発屋はデザイナーの下位作業(下請け感がある)ぽくなる 工程として下流になるのはわかるがなんで下請けやねん JavaScript, CSS のビルドは、Ruby on Rails でも使う。
Webpack, Babel, Gulp など
Bootstrap も、SCSS
>>764
「javascript グラフ ライブラリ おすすめ」で検索！
Google Charts, Highcharts, Chart.js, C3(D3) >>770
JavaScriptでのアプリってさ
静止画で動かないものをプログラミングするよりも
動きのあるものやインタラクションで即応性のあるもののが楽しいと思うよ
canvasやったらお絵描きやら、three.js使ってマウスでグリグリ動かせる3Dも作れるし >>776
ゲームエンジンも使ってますね
確かに楽しい 自分の好きなものとか作ってみたいアイデアを形にすれば楽しい セールストークのような短文が浮かんでは消えるようなスクリプトを書きたいです
その場で表示されて、消えて、別の短文が表示されるみたいに
リストした候補を順番、ランダムで代わる代わる表示させるには
どんなキーワードで検索したら似たような機能のスクリプトを探せますか？
素人が引き継ぎをするようになり、webプログラムの機能の専門用語が分からず難儀しています、、 >>780
そのままJavaScriptアニメーションとかでググればいい
基本的な仕組みは紙芝居やアニメーションと同じで
setIntervalの関数で
DOMの要素なりプロパティを一定時間毎に入れ替えれば良い >>781
有難うございます！
週末に色々試してみます >>779
プログラミン楽しくなった瞬間とかありますか？
やっぱりある程度スキルがつかないとつまらんですわな
まず継続化の時点で躓いている 即時関数ってのは全体の構造を把握しやすくするために使うんでしょうか？
関数化すればアウトラインに出ますもんね。 スキルというか目的じゃないかな
出会い系サイトで女に足跡つけまくるスクリプト書いてた時とか楽しかったわ
すぐ対策されたけど java/C++/C#辺りやってたのでオブジェクトの扱いがよく分からないというかプロトタイプベース？というのを聞いて分からない！文化が違う！ってなってます
なんかその辺上手いこと説明してくれてるとこないですかね >>785
目的あるけど、スキル不足でまだ楽しくない まず目的を明確にすれば？
「Program」には「計画」と言う意味があって
目的に沿って計画を書くのがプログラミング（手続き型言語） >>780
要素が自動的に流れ続ける、loop slider, slide show とか >>784
IIFE (Immediately Invoked Function Expression; 即時実行関数式)は、内部を隠ぺいできる
外から、内部にアクセスできなくなる >>786
prototype, __proto__ は継承チェーン
let Person = function (name) {
this.name = name;
};
let taro = new Person('太郎');
taro.age = 20;
console.log(taro); //=> Person { name: '太郎', age: 20 }
let jiro = new Person('次郎');
console.log(jiro); //=> Person { name: '次郎' }
taro.age = 20;
みたいに、インスタンスにメンバー(データ・関数)を直接追加しても、
そのインスタンスにしか追加されない。
Ruby の特異メソッドと同じ
1階層上に追加しないといけない。
それをプロトタイプチェーンを遡ると言う >>780
function f() {
const ary = ["あ","い","うう"]
let i = 1;
const timer_id = setInterval(function () {
// 0～配列の要素数未満の乱数を発生させて、少数点以下を切り捨てる。つまり、0～2
idx = Math.floor(Math.random() * ary.length)
console.log(i, ary[idx]);
i++;
// 指定回数でタイマーを解除する
if (i > 5) { clearInterval(timer_id); }
}, 1000);
}
f() >>793
有難うございます！
これはJavaScript？
自分で考えてからあれこれ加工するまでには全然至っていません・・
アニメーションも探すとcss3でも可能みたいですね
セールストークの文字列が2箇所あって
例「みんなのお役に立てる」「◯◯です」みたいな感じなのですが
こういう場合は一個づつの要素を動かしてあげる方が簡単ですよね？
3つくらいの組み合わせを、季節ごとに変えようとか考えていて色々試行錯誤してます
ワンセットで、1→2→3と時間指定で変えられれば一番楽なのですが 無名関数内スコープでなおかつ実行時未確定乱数だからかなぁ・・ オブジェクトのプロパティの値に対して、falseを入れておくと、その一つ下のプロパティの存在チェックが
できるのですが、nullにするとエラーが出てしまいます。
一体どのような理由なのでしょうか？
obj = {
obj.abc = false;
// obj.abc = null;
};
if (obj.abc,def) {...} 
>>798
falseはではない(表示しない)
trueはである(表示する)
nullはなにもない(どちらでもない)
だからだと思う >>798
falseはBooleanなオブジェクトだから
nullでやりたいなら?.使うべし >>793
自己修正
>idx = Math.floor(Math.random() * ary.length)
let が抜けていた
VSCode で、拡張機能・ESLint も入れているけど、
letが無くても警告されない >>799-800
ありがとうございます。
falseはオブジェクトだったのですね。
理解できました！
ちなみに "?." とはなんでしょうか？
ググってみましたが出てきませんでした… >>803
新しい文法なんですね
全然知りませんでした。
ちょろっと勉強してみます！！ ぼっち演算子・Null条件演算子・Null安全演算子か
Ruby にも導入された。&.
object&.method 戻り値のない関数ってどういうときに使うんでしょうか？ >>807
alertやconsole.logなどの何らかの出力処理を関数内に含めるか、returnを使うかしないと、外部とのやり取りは出来ないんですよね？ >>809
関数は数値などを加工するものだと思います。
その加工した値を取り出す手段がないと、使う意味がないと思うのですが。 >>806
「プログラミング 関数を作る意味」でググっていくつか読めば分かると思う >>808
alertやconsoleに限らず、その関数内から呼び出せる任意の関数を使って外部とのやりとりはできるわけだが。 localStrageに複数のデータを保存して、ループで取り出したいのですが、pushで保存は可能です。しかし、forで取り出すとカンマの区切りが機能していないようです。
[1,2,3]
こういう配列があった場合、forで取り出すと以下のようになります。
1
,
2
,
3
つまりこれは配列ではなく、文字列として扱われているのだと思います。
localStrageへの保存はどのような方法が一般的なのでしょうか？
以下はstartを押すとlocalStrageに配列を保存し、outputで取りだすというものです。
<button id="start">ボタン</button>
<button id="test">output</button>
<div id="timer" style="border:1px solid red;width:500px;height:500px;"></div>
<script>
let startButton = document.getElementById("start");
let testButton = document.getElementById("test");
let timer = document.getElementById("timer");
let num = 0;
let arr = [];
startButton.addEventListener("click" , function()
{num += 1;
timer.insertAdjacentHTML("afterbegin" ,"<div>" + num + "</div>");
arr.push(num);
localStorage.setItem("saveArray" , arr);
});
testButton.addEventListener("click" , function()
{let array = localStorage.getItem("saveArray");
for(let i = 0;i < array.length ; i ++)
{console.log(array[i]);}});
</script> >>814
JSON.stringify(), JSON.parse() >>815
jsonにするということですが、なぜ配列だと駄目なんですかね。 pythonにとって読み込んだテキストは単なる文字列だから。
“[1,2,3]”と同じ。 おっとpythonスレじゃなかった。javascriptにとってね。 >>818
そういう仕組だと覚えるしかないですね
localstrageって一種の変数みたいなもんじゃないんでしょうかね 外部とのやり取りは、文字列だけ
オブジェクトのシリアル化(直列化)、serialize localstorageだと強制的に文字列に変換されるから、それが嫌ならlocalforageとかのラッパーを使うといい innerhtmlはfor内では機能しないのでしょうか？
クリックしたときにtimerの中にnum_arrの中身をセットしたいです。
しかし、console.log(num_arr[i])での展開はされますが、innerhtmlでのセットは機能していないです。
なぜでしょうか？
<button id="test2">
test2
</button>
<div id="timer"></div>
<script>
let testButton2 = document.getElementById("test2");
let num_arr = [1,2,3,4,5];
testButton2.addEventListener("click" , function()
{
for(let i = 0;i <num_arr.length ; i ++)
{
timer.innerHTML = "<div>" + num_arr[i] + "</div>" ;
console.log(num_arr[i]);
}
});
</script> 書いた通りに動いてるじゃん
一瞬で上書きされるから人間の目には何が起きてるか見えんけど >>823
> for(let i = 0;i <num_arr.length ; i ++)
i ++ とは？ 変数timer が未定義だから
let timer = document.getElementById("timer");
が必要なのでは？ >>826
その方がお行儀がいいのでそうすべきだが、定義はされてる >>823
プラスイコールにしてみればわかるよ
timer.innerHTML = "<div>" + num_arr[i] + "</div>" ;
timer.innerHTML += "<div>" + num_arr[i] + "</div>" ; chrome拡張機能を作っているのですが、insertRuleしようとするとたまにエラーが出てしまいます。
調べてもよくわからなかったのですが、原因わかる方いますか？
Error handling response: Error: Failed to execute 'insertRule' on 'CSSStyleSheet': Failed to parse the rule 'undefined'. >>823＞innerhtmlはfor内では機能しないのでしょうか？
>>828の様にすればinnerHTMLはfor内でも機能してるのが確認出来る
＞クリックしたときにtimerの中にnum_arrの中身をセットしたいです。
なら
//num_arr[i] ではなく
timer.innerHTML = "<div>" + num_arr.join() + "</div>" ;
とすべし、あと名前はtimerではなくてtimesだろう >>830
そのエラー文字列で、Google 検索すれば？ jsを勉強し始めたんですがコールする関数タイポしてもコンパイルエラーとかないんで実行してコケて気づいて直す、を繰り返してしまいます。
こういうテスト以前のコーディングミスについて、コンパイル言語のように事前に検知する方法はないでしょうか？
ちなみにvscodeで開発してます。 漏れは、VSCode で、スクラッチパッドみたいな拡張機能・Quokka.js で、
コードを入力してるけど、文法エラーでは、赤い波線が表示される
拡張機能・ESLint も使っているからかな？
もちろん、Node.js もインストールしているから、
Quokka.jsに書いたコードは、Node.jsで実行されるので、時刻が9時間ずれる >>828
これで解決しました
ありがとう
加算にしないと駄目なんですね(´・ω・`)、、、 eslint、こんなのあるんですね ありがとうございます プログラミンコードの校正ってどこでアドバイスもらえますか？
ストップウォッチ作ったはいいものの、コードぐちゃぐちゃで読んでて分からない
分かりやすく書く方法を教えてほしいのです(´・ω・`)、、、 処理や変数など要所にコメント入れるようにして、
自分でわかるように書き直してみたらいい。
理解も深まるし無駄なところもわかったりする。 https://ideone.com/O5tsDV
ideonにupしました(´・ω・`)、、、
コメント入れているのですが、改善点のアドバイスもらえますか？
コメントアウトしている部分はとりあえずは使わない機能です。 >>841
適当にコード拾ってきてつなぎ合わせたのでなけりゃ、十分理解できるコードだと思うが。
それなりにコメント入ってるし。
むしろ具体的にどこがわからんのよ。
自分で理解して書いたコードだったら、一回全内容にコメント入れてみたら？ >>842
どういう部分と言われても難しいですが、しばらく放置してから見ると動きを理解するのに少し時間がかかるというか
この程度の短いコードですが
複数ファイルに分けたりしたほうがいいのでしょうか？
おそらく、良くわからないのは実行の流れです
フローチャートなどは苦手で書いていません >>843
できるだけ関数化するのと、その関数の名前にはこだわった方がよいかも
ファイルは分けなくてよい
フローチャートは自分も書いたことはない
例えばタイマの初期化が先頭部分とリセットボタンクリックイベントの2箇所にあるが、読みづらい上に不具合のもと
実際にリセットボタンクリック時にはミリ秒がクリアされるのに
起動時にはミリ秒がクリアされていないように見える(ローカルストレージから前回の値を拾ってきてる?)
関数外にはグローバルっぽく扱いたい変数の宣言のみを置いて
初期化は名前を付けて関数にする
イベント内の処理も関数化する
そうするとソースを読むとき、先頭から追いかけるときは
原則関数だけが並んでいる形になり、そこでは細かな処理を気にする必要はない
イベントの処理ではイベント関数の先頭からソースを追いかけるが、
そこでも関数だけがあって細かな内容は気にしなくてよい、という形にする
あとはセンスも必要になるけど、処理の内容を的確に表す分かりやすい関数名であれば、
関数名それ自体がコメントのような役割をはたすので、さらに読みやすくなる フレームワーク無しで開発すると、最後には暴発する。
デザインパターン・ファイル分割などが、統一的に決まっていないから
他人のクソコードを誰も読みたくない
だから、Ruby on Rails を使って、
全員が同じ規約で、レールに乗る。Rails Way
Rails では、Node.js, React, Vue.js, Bootstrap を使う。
これらもフレームワークだから、規約で決まっている
だから、独自のデザインパターンを使うことや、我流は、すべて禁止されている。
つまり、全てフレームワークに従う
コードレビューも、フレームワークに従っていない部分を、修正させられる。
フレームワークのやり方と違いますよと
例えば、伊藤淳一のコードレビュー。
YouTube 動画、2018/10
RSpecで書かれたRailsチュートリアル 第6章のテストコードをレビューしてみた >>844
関数化すると、レビューやテストがやりやすくなる
というのも追加で
あと、関数化といっているのは規模が小さいからで、
規模が大きくなってきたらクラス化したりファイルを分けたりとかの考慮は当然必要になる 関心事がごっちゃ混ぜだから分かりにくい
アプリケーションが管理する状態(モデル)とその状態をユーザーに見せる表現(ビュー)に対する処理を意識して分けること
MVCの基本を学ぶと良い
モデルの初期化処理やビューの初期化処理、モデルのsave/load処理を関数等でまとめること
モデルの変更イベント(mode: stopped -> running)をリッスンしてビューを更新する作りにすると関心事の分離的にも依存性の方向的にも見通しがよくなる eslint、入れてみたところ明らかに怒られる筋合いのない箇所で大量に怒られが発生して鎮火に試行錯誤してたらクソ時間食って本末転倒だったので切ってしまいました・・・ >>844
変数は出来るだけローカルにして、関数化出来る部分は出来るだけ関数化するということですよね。
MVCも調べているところです。
これはMVCの３つのクラスに分ければいいんでしょうか？ Ruby on Rails が、MVC の代表
React, Vue.js のFlux 系フレームワーク。
Store, View, Action
サーバーがRails のAPI モード・Web Socket などで、
クライアント側のHTML が、React, Vue.js, Bootstrap が多い >>851
ソースを修正してみた
https://codepen.io/cocotto/pen/OJgmXyo
自分はMVCとかよく分からんので、元のロジックは基本的にそのままで
機械的に細かく関数に分けてみただけだが
一応意識したのはタグの操作(insertAdjacentHTMLとかsetAttributeなどの行)は
ソースとしては非常に読みづらいので1行2行でも関数化したのと、
ボタンの状態変化をupdateButtonStatus()の1箇所にまとめ、
アクションの種類によらずその1種類の関数だけを呼べばよいようにしたことくらい mvcってどうやってエリアを分けるんでしょうか？
model controller viewのエリアです
単にコメントアウトで分けるのですか？ >>853
回答どうも
似たような
タグの操作というのはmvcでいうところのviewですよね。
ボタンの状態もviewですよね。
controllerはキーイベントなどのことだと思います。
modelってどの部分が該当するんでしょうか 100年やっても、MVC を作れない。
MVC のRuby on Rails をやった方が良い
それで、React, Vue.js のFlux 系フレームワークで、
Store, View, Action
Model, Store は、データ
View は、HTML
Controller は、それ以外の雑多なもの
Action は、データを変更するイベント スネークマンショーのチリ紙交換のコント思い出したw >>855
modelはビジネスロジックを扱う部分
今回のプログラムでは
modeなどの状態管理や累積時間を操作する処理が該当
>>似たような
最初からロジックは変更してないといっている
MVCやフレームワークはアプリを作成する上の考え方やお作法なので、
多人数のプロジェクトに参加する場合には覚えて使いこなすことが必須で、
理解している人同士では話が通じやすい
一方で、たとえばLaravelというフレームワークでは新規にプロジェクトを作成すると、
コードを1行も書いていない状態で、数千のファイルが生成される
開発ではお作法に従って適切なファイルを適切に修正していく必要があるが、
そもそもお作法を理解するまでに学習コストがかかり、理解するまでは読みやすいとは限らない
1ページ2ページのwebアプリでフレームワークを導入すべきかも検討が必要
とはいえ小規模なプログラムでも
ビジネスロジック部分ではUI操作を混ぜない、
UI操作の途中でビジネスロジックに影響を与えない、
などとした方が読みやすく保守性も上がる、とは言われていて、
本来的にはMVCなどの考え方を導入すべきかもしれないが、
小規模な趣味的アプリならUI操作部分を関数化して追い出すだけで
多少見やすくなるんじゃないか、というのが 853 の例
趣味でなく就職のトレーニングのつもりならMVCでもフレームワークでも頑張って勉強してもらうしかない ↑回答どうも
趣味程度ですね。
ただ、それでも分かりやすくはしたいので、mvcの考え方だけ取り入れます。
本物のmvcがよくわかりませんけどね。 javascriptだとmvcがなじまないから何らかのフレームワークを使うってことなんですかね？ >>861
それはhentaimanに直接聞くべき内容だと思うが >>856
に書いたように、
Ruby on Rails は最初から、Node.js, Webpack, Babel を使う
多いのは、React, Bootstrap。
日本では、Vue.js も使う
最近の転職では、Vue.js, TypeScript も有利だと、
YouTube で有名な、雑食系エンジニア・KENTA が言ってる
サーバー側がRailsのAPIモードで、
フロントエンドが、React, Vue.js
ほとんどのベンチャー・学校・サロンは、これ 例えば、食べチョクでは、AWS, Ruby on Rails, React
若い娘が1人で起業するような場合は、Heroku, Rails, Bootstrap とか テラワロスな回答が2つもついててteratailのレベルの低さに驚愕した
一番基本のクライアントサイドのMVCを知らずにまともなUIコードを書けるわけがない javascriptでmvcは使うんですか？
違う概念があるんでしょうか？ YouTube で有名な、雑食系エンジニア・KENTA のサロン・動画を見ればわかるけど、
基本的には、どこの会社も転職用ポートフォリオは、Ruby on Rails のみ。
他のフレームワークのシェアが少ないので、それらで作っても誰も見ない。
Laravel, Django など
React, Vue.js も、バックエンドで使うかと言われれば、使わない
だから基本、サーバー側は、Rails のAPI モードで、
フロントエンドに、React, Vue.js, Bootstrap を使う 単純な例では、a.html に、
<button id="btn_1">押して</button>
と書いて、jQuery を読み込んでから、ボタンを押すと、ajax で、a.json を読み込む
$( function ( ) {
$('#btn_1').click(function(){
$.ajax({
url: 'a.json',
type: 'GET',
dataType: 'json'
}).done(function(data){
console.log( data )
});
});
} );
a.jsonには、
{ "title": "指輪物語" }
と書いておく
a.html上で、右クリックメニューから、
VSCode の拡張機能・Live Server を起動すれば、HTMLが表示される
(VSCode, Node.js は、インストールしておく)
a.jsonがデータ(モデル)で、a.htmlがView。
データがデータベースになれば、Rails などの本格的なフレームワークを使う
他にも、多くのページ・routing を設定するなら、Controller も必要になる ttps://radiko.jp/reader/
Widgets: Google Tag Manager
JavaScript Libraries and Functions: Moment JSMoment JS
Web Servers: nginx xamppのローカル上では何故かjQueryが作動してくれるのですが、そのファイルをエックスサーバーに上げると作動してくれません、、
気になったのはCDNの位置で、何故かheader.phpに記載されています
jQuery本文はindex.phpに記載してます
phpのファイルにはbodyが無いため、ネットで調べても検索結果が無いのですが・・確認すべき点があればご指摘いただけませんか？
教えていただきたいのは
jQueryを読み込ますCDNの位置とjQuery本文の記載場所です、、
宜しくお願い致しますm(_ _)m cdnはhead内
header.phpがどうなってるか知らんがそこにheadタグがあるならそこ
本文？はcdnのjQueryの読み込みより後ならhead内でもbody内でもいい
bodyが無いというのは抜け落ちてるか見落としかどっちか もしかしてWordPress？
回答に必要な情報があるならちゃんと書いてね header.php が単に、メニューバーなどを定義した、
部分テンプレート・パーシャルなのか、
それとも、HTML の<head>タグなのか？
<head>タグなら、body よりも、先に読み込まれるでしょ？
試しに、bodyの終了タグ直前で、読み込んでみれば？
もちろん、jQuery は、自分のコードよりも先に読み込まないと動かない >>871-873
皆様有難うございます！
業者にwordpressで作成していただいたものをカスタマイズしてます
素人で検索ワードも効率的に選べなかったのですが、アドバイスをもとにネット検索をして少しだけわかってきました
今回、改修したいファイルはindex.phpですが、headとbodyはheader.phpにありました(何故か</body>は見当たらず・・)
なので、明日は</body>を書き込み、その直前にjQueryの本文を入れて試してみようと思います まず今日までの作業は忘れて「WordPress jQuery」で検索
大抵jQueryは導入済で、自作のスクリプトの側を工夫すれば使える
正直不理解なまま業者の納入物をブッ壊してるように見えるぞ >>875
有難うございます！
確かにCDNでjQueryが導入済みだったので、いきなりFanction以下の本文を記入してもxampp上では動いてくれたのですが、、
一応、ローカル環境だけでいじくり回して解らなくなったらバックアップのデータで復元してます
何故かサーバーにアップしたら動かない、、
ライブラリのバージョンが違うのかはどうやって判断すれば良いのでしょうか？
業者は2.2.1でしたが、3.6.0にすべきかどうか？
なぜ、bodyの終了タグが無いのか？
一応、body自体を消してみたけど、何ら崩れたりもせず動いてました
header.phpのheadの終了タグの前にjQueryの本文を記入しましたが、レイアウトが崩れました
index.phpに記載した内容に影響のあるscriptなので、別のファイルに記載したら駄目なのか？
一晩寝て、アドバイスの通り検索から始めて理解を深めてから先に進むことにします、、 >>873
一晩寝て思いついたのですが
header.phpはメニューだけを記述したファイルのようです
そこのheadにhtmlの宣言？CSSの呼び出し、CDNが記載されてました
他にhead,body,CDNを記述したファイルは見つかりません
そもそも.htmlというファイルが無いサイトって成り立つのでしょうか？
index.phpはトップページの内容を記述してますが、headもbodyも記述がありません、、
index.phpに記載の内容に対してjQueryを作動させたいのですが、、
xampp上では何故か上手くいってるんですよね
index.phpにbodyを新たに記述するってのは違反行為でしょうか？
そもそもhtmlの知識もなくカスタマイズしようとしてまして、、 >>877
一般に公開するwebならその程度の知識でいじるのはやめといた方がいいよ body云々の話はどうでもいい
(header.php、footer.phpでワンセット)
htmlの勉強も必要だけどまずWordPressのお作法を勉強しろ(WordPress javascriptで検索)
原因を探るならページを表示した際のソースをxamppと本番環境で見比べてみればいい >>878-879
ご指摘はごもっともですが、他に適任者は居なく業者からも実装したことが無いと放り投げられてるのでやるしか無いのです
上でも指摘していただきましたが、wordpressで jQueryは設定されていて、私の作成したfunctionの記述を再確認したところ上手く作動するようになりました！
やはり壊していたのは自分自身だったと・・ >>880
その流れだと普通は他の業者探さないか？ 自己責任で勝手に会社のをいじるのか、人生ひっくり返されないようにな wordpressネタで色んなスレで暴れてる釣り師だよ <style>
#test_id{
filter:sepia(80%) blur(1px);
}
</style>
のようにcssで設定されているfilterをjavascriptで取得するにはどうすればいいんですか？
getComutedStyleとgetPropertyValueでも取得できませんでした。 >>881-882
ECサイトとかじゃなくて単なる零細企業の企業サイトですから・・ 例えば、Ruby on Rails なら、部分テンプレート(Partial)で、
メインの内容・ヘッダー・フッター・サイドメニューなど、
ページの各部分をバラバラに作る
_main_content.html.erb
_header.html.erb
_footer.html.erb
_sidemenu.html.erb
上の各部分を、全体のテンプレート・application.html.erb で読み込む
拡張子ERB は、Rubyの構文で書いて、HTML へ変換する。
a.php と同じ。PHPの構文で書いて、HTMLへ変換するだろ
Rubyでは、ERB内で、<% ～ %>, <%= ～ %> に、Rubyの構文を書けば、
それが解釈されて、HTMLへ変換される。例えば、
ERB
<% price = 100 * 1.1 %>
<p>値段は<%= price %>円です</p>
変換されたHTML
<p>値段は110円です</p> WordPress はプロ向きじゃない。
デザインの本ばかりで、Railsみたいに、フレームワークの仕組みを学べる本がない
プログラミングはコーディングするものじゃない。
ほぼ、ずっとフレームワークの仕組みを読むこと。
これが、開発のほとんどの時間を占める
だから、WordPressの仕組みは、web制作管理板のWordPressのスレで聞くように言ってる。
各テンプレートを読み込む順番とか、どれが本体のHTMLなのかとか
この板で聞いても、個別のフレームワークの仕組みは誰も知らない
だから皆、専用のサロンへ入る。
例えばRailsなら、YouTube で有名な、雑食系エンジニア・KENTA のサロンへ、3千人が入っている
そういうコミュニティーへ入らないと無理。
独学では作れない。教えてもらわないと無理 >>884
jQuery なら、sepia(0.8) blur(1px)
と、文字列で出力された。
JavaScript のオブジェクトにならなかった！
<img src="a.jpg" id="img_01">
<style>
#img_01{ filter:sepia(80%) blur(1px); }
</style>
$( function ( ) {
prop = $( '#img_01' ).css( 'filter' )
console.log( prop );
} ); classでインスタンスを作っている人いますか？
これってすごく中途半端でかえって分かりにくいです。 three.jsのオブジェクトはこんな感じで作ったりするけど？
for (let i = 0; i < 1000; i++) {
const sprite = new THREE.Sprite(material);
// ランダムな座標に配置
sprite.position.x = 500 * (Math.random() - 0.5);
sprite.position.y = 100 * Math.random() - 40;
sprite.position.z = 500 * (Math.random() - 0.5);
// 必要に応じてスケールを調整
sprite.scale.set(10, 10, 10);
scene.add(sprite);
} 何が中途半端か分からんけどTypeScriptでも触ってみたら class 構文を使わず、継承チェーンを自作しているようなコードは、地獄
そういう香具師は追放
>>897
継承自作はガチでやばい ES2015まではclass無かったんですよね？それまではどうしていたんですか？ リサイズイベントが複数設置していて、望んだ順番で発火して欲しいのですが、
何か方法はありますでしょうか？
現状は各リサイズイベントにて、setTimeoutを用いてイベントの発火を間引いていますので、
その間引く時間をそれぞれ変更して対応しています。 クラスにして引数渡すメソッドにすりや良いんじゃね？ すいません
windowsのローカルで動くスクリプトを書いてて質問です。（JSX）
children = folder.getFiles();
でディレクトリにあるファイル一覧を取得してるんですが
children[0].path = decodeURI(children[0].path);
みたいにファイルのパスをURLデコードしても、デコードしたパスが上書きされません。
ファイルパスに日本語が含まれていると後の処理でエラーが出るので
色々試してる途中なのですが、むしろ「日本語がURIエンコードされている」ことが問題なのかなと思ったので
いったんデコードを試みてる次第です。
どなたかよろしくお願いいたします。 >>903
一行でやらずに間挟んでみたら？
tmp = decodeURI(children[0].path);
children[0].path = tmp; classを導入するならjavaみたいにクラスベースにするべき。 >>907
中身がプロトタイプのままならfunctionでコンストラクタを書いた方が、
プロトタイプチェーン、this、継承の挙動が把握しやすいから。 >>908
糖衣構文と把握できない人にはそうかもしれないな >>909
従来のままのほうが分かりやすくない？
何のためにclassを追加したのだろうか？ https://note.affi-sapo-sv.com/js-class.php
JavaScriptのクラスは、内部的にはsuperキーワードが追加された以外は以前と変わっていません。
そのため、以前できなかったことは、今でもできません。
クラス定義を使えば、わかりやすいコードを作れるという意見もありますが、誰にとってわかりやすいかいまいち不明。
prototypeを隠蔽しているので、初心者がJavaScriptの本質を理解しにくくなる気もします。
class構文は内部でどんな置き換えをしているのか、ということを理解してからでないと、勉強にならないですね。
でも理解したら、わざわざclassを使う必要がない気がします。
使いたければ使えばいいんじゃない？と思います。 classでインスタンスを生成した場合、関数の入れ子・クロージャ・関数の合成は
どのように実装すればいいのでしょうか？ jsonファイルをfetchで読み込んで表示するページ作りたいんですが読み込んだjsonファイルの更新日時を取得する方法ってありますか？ HTTPのレスポンスヘッダーにLast-Modifiedがあれば >>914
理解してない機能はわかりにくい
理解した機能はわかりやすい
それだけの話 関数の呼び出しコストという文言を見るのですが、具体的にはどのようなコストなのでしょうか？
関数スコープが生成される？的なコストと処理量などでしょうか？ 検索の時間
家の本棚から探すのと図書館に行って探してくるのとの違い プログラミング初心者＋αです。
const a = オブジェクト.length
console.log(a);
ということをやると
undefined:undefined
つまり未定義と表示されて正常に認識してくれない。
console.log(オブジェクト.length);
ならうまくいくのに。
プロパティの値を変数に割り当てられないのでしょうか。 >>920
再現しないんだが
Objectにはlength無いけどなんの話か教えてくれ >>919
ありがとうございます。
オーバーヘッドと似たようなもんだと考えてよいのでしょうか？
forEach が遅いのは関数呼び出しだからってのを、何処かで見まして、
インライン関数でも遅いので、自分の中で『検索』ってのと繋がらないです… >>924
ゴメン、CDNのボトルネック的な事かと思っただけで
コールスタックとかリターンアドレスやらメモ化なんて知らないです。
どっちにしろ人間もコンピュータも間接的な呼び出しは遅いようだ
以下参考
2019年版: JavaScriptのループの考察
https://qiita.com/shibukawa/items/4cae2a1410754d519232
【Python】関数呼び出しのコストを計測してみた
https://qiita.com/stokes/items/e8440329fb6f37944a9b 元のhtmlが<td id=***>文字列</td>と言う形でユニークなidが振られています。文字列の部分がokだった場合、字色を赤に変えたいのですがどのようなコードとすればよいでしょうか
試しに該当箇所にreplaceでspan styleを当てると元のタグが消えてテーブルが破壊されてしまいました >>928
ヒントありがとうございます
解決しました 下記のようにhtmlを変数の中に入れて、複数ある.itemクラスを順番にループして
その中の.hogeクラスのインナーを取得したいです。
しかしhoge変数に入れて処理しようとすると何故かunderfindになってしまいます。
どなたかアドバイス頂けないでしょうか
（いったん変数に入れた方がすっきりするのでそうしたいです）
var DOM = $('#test').html(document.getElementById('text').value);
DOM.find('.item').each(function(i){
var hoge = $('.hoge',this);
alert(this.getElementsByClassName('hoge')[0].innerHTML);//こっちはinnerHTMLの中身がちゃんと表示される
alert(hoge.innerHTML);//こっちはunderfindになる
} alert( hoge.text() );
にするとマークアップ部分を抜いたテキストを取得できることに気付きましたが
マークアップも含んだ状態のインナーhtmlが欲しいんですよね… >>931
まさかと思ってやってみたらいけました、そうかー配列で持ってたのかー
ありがとうございます 配列とHTMLcollectionは似て非なるものやぞ >>934
hogeはHTMLcollectionじゃないぞ if (true) {}
if (a === 300) {}
if文は真偽値だけの判定と比較の判定だったら、真偽値だけの方が速いとかありますか？
複数個所で同じ比較の判定が必要な場合、結果を真偽値にして使い回した方がよいのか
知りたいです。 初学者あるあるだけどそんなの誤差だから保守しやすいコードを書くのが正しい 誤差なのですね
何の真偽値か調べるの手間ですもんね
ありがとうございました。 >>937
前者が速いが、フラグ変数を使わずにすむロジックを考案するのが最も効率的 >>937
ちなみに複数箇所で同じ判定をしなければならない判定は、フラグ変数を使う方が保守性が高い
将来、判定処理を更新する際に更新箇所が一つですむし、複数箇所に同じ判定があると更新漏れのリスクがある
>>940でいったように、判定箇所が一カ所になるようロジックをくむのが最適 最近vueやらreactやら仕事で触ることになったんだけど、
みんなこの巨大なvueのtemplate構文とかどうやって読み解いてるんだ・・・？
実際のUIがイメージできるようになるのかコツとかある？ vueはGoogleの拡張いれたら分かりやすくやった >>940-941
台風でネット繋がらなくて、お礼言うの遅れてすみません…
すっごい腹落ちしました。
どうしても複数になる場合はフラグ変数使っていこうと思います。 javascriptで関数はオブジェクトって書いてあったんですよ
でもオブジェクトって例えばconst o = { name: "noname", mail:"sage}みたいに定義されるものではないのですか？ >>948
関数はObject型
{}はnew ObjectでありObject型
new ArrayもObject型
https://tc39.es/ecma262/#sec-typeof-operator スクレイピングに興味があるのですが1時間に1回の頻度のGETだけで訴えられる危険があるって本当ですか？ jqueｒｙなんですが
jqXHRオブジェクトから逆算してクエリ文字列を得る方法ってありませんか？
var a = $("index[name=hoge]");
a.xxxx()= → "index[name=hoge]" みたいな関数とかプラグインとか >>953
あった
a.selector
が、1.9で消された >>948
JSの型には、String Number Boolean Null undefined Symbolなどの他、Objyectがあります
プリミティブでない型は全てObject型です
Objectの例は
let o={};
let a=[];
let f=function(){}
function f(){}
などがあります >>948
あと、オブジェクトという意味合いは結構あいまいです
JSではプリミティブはそれ自体に関数やパラメータなどを保持しません
ObjectはObject（）の派生ですので関数やパラメータを持ちます
型という意味合いでは、typeof でObject型なのか判定できますのでお試しを
オブジェクトを目的物、対象物という表現でとらえれば
文字や数字も、扱う対象物として、オブジェクトと表現できますが
型としの意味合い（始祖Object()を継承してるか）なのか
対象物という意味合いなのか、混乱したときには整理してみるといいかもです >>960
ようやく、>>953が出てきたと思ったら、ただの感想か
相変わらず、このスレの質問者は自己中だな アロ関とthisが分かりにくい。
全部バインドしとけばいいの？ >>965
thisだけでなくselfをもっと活用すればいいのでしょうか？ 質問です。
https://developer.mozilla.org/ja/docs/Web/JavaScript/A_re-introduction_to_JavaScript
の
var input;
do {
input = get_input();
} while (inputIsNotValid(input));
を実行したら、
Uncaught ReferenceError: get_input is not defined
と出ました。
get_input()は自作関数だと思いますかが、
どんな関数になるのか教えて下さい。 <input id="address">
function get_input(){
return document.querySelector("#address").value
} >>970
こんな深夜にありがとうございます。
ただ、すみません、
Uncaught ReferenceError: document is not defined
というエラーが出ました。
このdocumentというのはどのように定義したらよいですか？
あと、
<input id="address">
は同じフォルダにindex.htmlのような名前で保存すればよいですか？ >>969
var input;
do{
input=get_input();
}while(inputIsNotValid(input));
function get_input(){
return confirm('input!');
}
function inputIsNotValid(input){
return !input;
} >>969
サンプルコードは、
inpu=get_input() // 入力されたものをinputに代入する
do-whileは、inputIsNotValid()関数の戻り値がtrueの時に繰り返す
inputIsNotVarid()は、入力されたinput値が不適切の時にtrueを返す
という内容を説明しています
get_input()がどのような入力になるのか
inputInNotValid()で、inputの適否をどう判定しているのかは問いません、ということです
このようなコードを見たときには、関数名で働きが説明できている、という前提ですので
関数名をよく読んで、戻り値を推測して読んでください >>969
あと、このコード自体は
「有効な値が入力されるまでループする」というコードです
confirm関数はシンプルな入力関数で、OKボタンでtrueを、キャンセルボタンでfalseを返します >>972
理想的な必要十分なコードだけど
promptじゃね 45億年もの長きにわたり僅かな変化を積み重ねた塩基配列の微妙なズレと
あなたと私の養育環境における、例えば接種してきたたんぱく質や食物繊維の種類や量
照射された日照量や、退社した細胞数の数、知り合った女性や先生が持つ遺伝子配列とのずれとの調和
そのような本当に些細な差が、promptなのかconfirmなのかを決したのだと思います
そこには完全な正解はないのかもしれませんが、バリデーションチェックという意味ではpromptで説明すべきかもしれません >>966
「～が分かりにくい」でお茶を濁さず、アロー関数とthis値の性質を学習して、分からない部分を具体化してから、調査or質問せよ
ということだ
>>966で書いてるような「～すればいい」を理屈を度外視して、方法論だけ求めるのは思考停止
現状だと質問の体を成してない >>968
質問を立て逃げ、誹謗中傷
そんなことしてる人にいわれてもな >>971
documentがないってブラウザ以外の実行環境なの？ >>964
とても情緒深く、文学的なご質問で、私のような無知で下賤な者が触れてよいのか悩みましたが
アロー関数自身にアロー関数内のプロパティ、もしくは引数を紐づけたいということなのでしょうか？ >>972-976 && >>979
> documentがないってブラウザ以外の実行環境なの？
Chromeのコンソールで実行することで望んだ通りの出力になりました。
それまではネットで勧められるままVSCodeで実行していました。
皆さん、ありがとうございました！ >>981
がんばってくださいね
継続して学んでいれば今感じている疑問の殆どは解消します
一歩を進められたご自身の力を信じて進んでください >>981
982の「疑問」=>「疑問や違和感」に訂正です >>980
アロー関数にプロパティを紐づけする必要ないよな
無名関数、即時関数のプロパティに外部からアクセスするようなコードはナンセンスだし
>>981
Chromeのコンソールでコード入力してんのかな？
そんなことしてたら面倒くさいだろな
vscodeでjavascriptを実行すればいいんだけど
支障がるみたいで、どういう感じになってるのか興味ある .>>1000
そうだな、お前みたいな破廉恥極まりないやつを極刑にできないなんてな >>987
先(>1000)をみる前に現在を見つめては よろしくお願いします
下記の二つの関数、c1()とc2()でカウンターを作りました
c1()はカウントされず、c2()はカウントされます
同じようなコードなのにc1()を複数回呼び出しても
変数cがインクリメントされないのはなぜなのでしょうか？
function c1(){
let c=0;
return c++;
}
function c2(){
let c=0;
return function(){return c++};
}
let s1=c1();
let s2=c2();
console.log(
s1, // 0
s1, // 0
s2(), // 0
s2(), // 1
); 仕様通りとしか
c1のcはc1が呼び出される度に定義されるからカウント不可
そもそも上のコードでc1は１回しか呼び出されていないし c2の中のfunctionの中で書いてないけどcが定義されて、呼び出されるごとにそのcがインクリメントされているような挙動。 >>989
c1は呼び出される度に変数cが初期化される
s2は呼び出されても変数cが初期化されない カウンタを初期化する部分を繰り返し呼び出す関数の外に出してやればいい
let c=0;
function c1(){
return c++;
} >>990はレキシカルを理解してるなら
s1とs2のレキシカルが違うことをだな >>989
関数やブロックはプロパティをLexicalという場所に登録するんだけど
プロパティを参照した時には、関数内やブロック内のLexicalを参照し
そこにプロパティが登録されてないとその直外のLexicalを参照します
関数は、呼び出しごとに内部Lexicalが生成されるので
c1();c1();c1()と呼び出すと、別々の3つの内部Lexicalが生成され
それらに別々のlet cが登録されるので、c=0となります
s1にはc1()への関数の参照が格納されてるので
s1を複数回呼び出すと、c1()を複数回参照し
上記と同じ結果になります
一方でc2()がreturnで戻す内部関数は直外のLexicalのあるcを参照します
s2（）を複数回呼び出すと、同じLexicalのcを参照するので
s2()の複数呼び出しでcはインクリメントされていくのですね
990先生や994先生のご指摘を血肉にされるといいでしょう ところでクロージャーって用語の使い方について質問があるんだけどc2自体をクロージャーって言うのかc2が返してる無名関数をクロージャーって言うのかどっちが正しいの？ closer != function
closer == function + environment.information
JSで説明されてるクロージャーは
関数、関数の内部情報、外部参照ポインタのセット
っていう大まかな理解でいいと思います
function f(){let a;}の場合、
関数f、内部プロパティa、外部参照ポインタの参照先（グローバル）、というセットがクロージャー
ちょっと大まかすぎますか？
返される無名関数はクロージャーの仕組みを
コードで理解するために多用されているために
それ自体をクロージャーと認識する人も多いでしょう
また関数内プロパティは外部から直接アクセスできないので
外部からクローズになっているという意味で
関数自体をクロージャーといっていたり
外部から関数内にアクセスできない状態をクロージャーという人も多いでしょう
次スレで先生方からアドバイスいただけますといいですね
私も心待ちにしています
>>999様、ありがとうございます このスレッドは１０００を超えました。
新しいスレッドを立ててください。
life time: 1682日 18時間 0分 27秒 5ちゃんねるの運営はプレミアム会員の皆さまに支えられています。
運営にご協力お願いいたします。
───────────────────
《プレミアム会員の主な特典》
★ 5ちゃんねる専用ブラウザからの広告除去
★ 5ちゃんねるの過去ログを取得
★ 書き込み規制の緩和
───────────────────
会員登録には個人情報は一切必要ありません。
月300円から匿名でご購入いただけます。
▼ プレミアム会員登録はこちら ▼
https://premium.5ch.net/
▼ 浪人ログインはこちら ▼
https://login.5ch.net/login.php レス数が1000を超えています。これ以上書き込みはできません。
