https://shirakawa.weblike.jp/blog-page/2021/11/22… の続き。
練習場
https://oldcygwin.web.fc2.com/index_old.html
ログインしてからftp (そのうちgit_pushしたいが当面はemacsのdiredで)
https://web.fc2.com/
practice100.html~practice199.html:
JavaScriptの練習(基本編、ライブラリ使わない編)。
演算子 https://www.tohoho-web.com/js/operator.htm#other やっておこう。練習予定。と思ったが、
caseも抜けていて、https://www.tohoho-web.com/js/statement.htm#case
C言語が持っている物は大体全部持っている、で制御構文は練習省略でもいいかも。(2023.03)
instanceof https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/instanceof
JSのimportとrequireの違い https://qiita.com/minato-naka/items/39ecc285d1e37226a283 https://qiita.com/TakeshiNickOsanai/items/7899a60044d71aa8d899
JSにinterfaceは無い件 https://qiita.com/roomberry/items/71b1f9e7900cdee05f55 http://web.archive.org/web/20150517042907/http://d.hatena.ne.jp/yinkyweb/20110727/1311784268
\
以下は、javascript es2015 以降で追加されたオブジェクト mdn、でググった。確認しつつ、
練習課題に追加した。(とりあえず今はES6まででいいや)
ES?で追加された機能の一覧 https://www.tohoho-web.com/js/what.htm
(JS古本が2003.10なのでこれはありがたい。不足分の練習課題を上に追記中)
JavaScript ES6で追加された機能 https://www.webdesignleaves.com/pr/jquery/javaascript_02.html
JavaScript 「再」入門 https://developer.mozilla.org/ja/docs/Web/JavaScript/A_re-introduction_to_JavaScript
ES2015(ES6) 入門 https://qiita.com/soarflat/items/b251caf9cb59b72beb9b
\
今更ながら、JSが物理層へのアクセスがなく論理層へのアクセスのみだからか、送受信して解釈され
るスクリプト言語のためなのか、C/C++とは違いすぎると気付く。(2024.08)
遅まきながら、気付いた時に重要そうな物だけメモっていく。
・JSでは、オブジェクトはキーと値のペアを保持するデータ構造である。C/C++はbinやdataその
もの。
・JSオブジェクトにアクセスするためには、ドット記法(object.key)だけでなく、ブラケット記法
(object[key])も使う。C/C++ではa[b]は配列にしか使わない。
JSのコマンド(メソッド)を知らな過ぎるので、基本の100本ノックでもやるか:(2022.08)
具体的にやりたい事が決まったらJSコマンドググる?う~ん、
LinuxやC/C++の時はどうだったかな、やっぱ100本ノックやってた気がする。効いたかは正直微妙。
実践(電子手帳と格安PCでLinux、仕事でC/C++)で必要になった、が一番効いた。がやらないよりは
いいかぁ?。100本ノックとは参考書籍1の基本知識以降の全サンプルを動かしてみること。
practice199.html:(参考書籍1のAPPENDIX、https://www.tohoho-web.com/js/ )
APPENDIXに付いてるよく使われるオブジェクト(のメソッドとプロパティ)の説明をザッと見ておけば
いいか。全てのオブジェクトはwindow以下にあるのだろうが何処にあるか分からない場合、practi
ce199のコメントアウトを外して再読み、各オブジェクトを切り換えて生成させ、ブラウザのコマンド
プロンプトからconsole.log()入力して確認した。一覧と説明見るだけならAPPENDIX印刷してスキマ
時間でもいけるな、実装有無は後から確認するとして。コマンドプロンプトは、Ctrl+Shift+I。
(後から分かったが、古くて非推奨だったり通常使う物はある程度限られていたり、ザッとでも見な
くてよい物の方が多い。当面は参考書籍2の100本ノックだけでよしとする。2023.05)
DOMツリーと簡単なDOM操作例。https://ja.javascript.info/dom-nodes
\>> window.document.body.style.background = ‘red’;
要素の取得方法まとめ https://qiita.com/amamamaou/items/25e8b4e1b41c8d3211f4
\
参考考察:
window.documentの直下にbodyとformが同レベルで存在し、body.formではない。参考書籍1にある以下、
DOMを利用するには、HTMLを構造的に記述する必要があります。ここでの「構造的である」とは、HTMLの要素を入れ子にしないということを意味しています。
というのはそういうことか?。がしかし、inputはformの下にいる。formを外すといなくなった。どこ行っ
た?。<input name=”in1″、とやって探すと、
\>> document.getElementsByName(“in1”) //Element(=要素)
NodeList [ input ]
となってクリックするとアクセスできる。正しそうだ。がしかし、formを戻してgetElementsをやっても
答えは同じだった。いるんだろうがDOMのどこかは分からない。DOMの構成はブラウザ都合であり、JSは
ピンポイントで教えられた位置(絶対位置ではない)で使えれば問題ないということか?。
全ての要素はツリー構造のObject https://www.tohoho-web.com/js/basic.htm#object を継承していて、
formから生成した場合はその下にinputはいるが、inputだけを生成した場合はその上にformはいない、
ということか。入れ子にしないというのは、formの下にformを作るなということだな。
(上のツリー構造のObjectの図にはwindow.consoleとか書いてないのもあるがブラウザで見た方が早い。
DOMの所 https://www.tohoho-web.com/js/dom.htm に書いてあったりする)
プロトタイプベース https://typescriptbook.jp/reference/values-types-variables/object/prototype-based-programming (2023.05)
\
NodeList [ input ] は、NodeList.input とも書けるか? (2024.08)
NodeList [ input ]のように表示されるのは、NodeListオブジェクトが特定のタグ(<input>など)の
リストを保持していることを示しています。
NodeListは配列のようなインデックスでアクセスします。NodeList.inputのようなキーアクセスはでき
ません。NodeList自体は、JavaScriptオブジェクトのようにキーと値のペアで構成されているわけでは
ありません。インデックスを使ってアクセスするコレクションの一種です。(Firefoxのconsoleで見たら
確かにそうだった。というか思い出した)
例えば、inputs[0]のように、インデックスを指定してアクセスします。
// 複数の要素が同じname属性を持っている場合
const inputs = document.getElementsByName(“in1”);
console.log(inputs[0]); // 1つ目の input 要素
console.log(inputs[1]); // 2つ目の input 要素(もしあれば)
anchorsオブジェクト
簡単な説明と https://www.tohoho-web.com/js/anchors.htm を読んだ。
\>> console.log(window.document.anchors)
\>> console.log(window.document.anchors[0].name)
https://html-coding.co.jp/annex/dictionary/html/a/
HTML5ではインライン要素/ブロックレベル要素といったタグの分類に変更があり、<a>タグの中に<div>タグなどの元ブロックレベル要素を含めてもよいことになりました。
https://jill-tone.com/html_amp_noname/
HTML5ではaタグへのname属性は非推奨 (がしかしname入れないとdocument.anchorsが見れないぞ~。getEle
mentByIdとかが必要になる。window.document.allには多分いつも全部ある)
appletsオブジェクト
簡単な説明と https://www.tohoho-web.com/js/other.htm#objApplet を読んだ。
\>> console.log(window.document.applets)
https://html-coding.co.jp/annex/dictionary/html/applet/
<applet>タグはHTML5で廃止されたため、替わりに<object>タグを使用することが推奨されています。しかし、<object>タグでプログラムを埋め込んでも動作しないブラウザがあり、対応が完全ではありません。そのため、限られた状況でしか使用できず<object>タグや <applet>タグや <embed>タグなどが混在した状況になっています。JavaアプレットはJava-11で廃止。
<object>: 外部オブジェクト要素
\>> console.log(window.document.all)
でしか見れない。<object> https://developer.mozilla.org/ja/docs/Web/HTML/Element/object https://www.tohoho-web.com/html/object.htm
がnameを入れるとwindow.document.”name”で見れる。
オブジェクトタグからhtml要素を取得するにはどうすればよいですか? https://tagsqa.com/detail/9937
【JavaScript】Objectタグのdata要素を変更する https://blog.beatdjam.com/entry/2016/11/15/232215
よくあるMIMEタイプ https://developer.mozilla.org/ja/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types https://www.tohoho-web.com/wwwxx015.htm
argumentsオブジェクト
簡単な説明と https://www.tohoho-web.com/js/function.htm を読んだ。
\>> console.log(window.Function)
でargumentsがある事を確認。何の準備もなく以下をやるとエラーになる。
\>> console.log(window.Function.arguments)
Uncaught TypeError: ‘caller’, ‘callee’, and ‘arguments’ properties may not be accessed on strict mode functions or the arguments objects for calls to them
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Functions/arguments
関数check(value)を有効にして実行するとobjectができてその中でならargumentsが見れる。
\>> check(0)
lengthであれば外からでも見れる。argumentsはnullのまま。
\>> console.log(check.length);
array(配列)オブジェクト
簡単な説明と https://www.tohoho-web.com/js/array.htm を読んだ。
\>> console.log(window.Array)
dateオブジェクト
簡単な説明と https://www.tohoho-web.com/js/date.htm を読んだ。(2023.05)
\>> console.log(window.Date)
\newしないと使えないObject。ブラウザがhtmlを読み込んでも日付け(Object)は生成されないため?
Documentオブジェクト
簡単な説明と https://www.tohoho-web.com/js/document.htm https://www.tohoho-web.com/js/dom.htm#getElementById を読んだ。ブラウザの主たる表示部分の事。
\>> console.log(document.cookie); (2023.06)
Cookieで指定可能な属性の種類と設定方法 https://www.javadrive.jp/javascript/webpage/index18.html
cookie https://developer.mozilla.org/ja/docs/Web/API/Document/cookie https://www.tohoho-web.com/wwwcook.htm
\>> console.log(window.document)
document.clear()やってもクリアされないと思ったら非推奨だった。https://developer.mozilla.org/ja/docs/Web/API/Document/clear やっぱMDNは確認しないといかんな。
\>> window.document.clear()
DOMナビゲーション (2023.06)
https://ja.javascript.info/dom-navigation
DOM上のすべての操作はdocumentオブジェクトから始まります。そこから任意のノードにアクセスできます。
要素ノードを取得、作成、削除
https://www.javadrive.jp/javascript/dom/
https://developer.mozilla.org/ja/docs/Web/API/Document/body
https://developer.mozilla.org/ja/docs/Web/API/Node/removeChild
(要素bodyのObjectかと思ったが、プロパティでNodeとかいうやつが入っていた。確かに上の方でNodeList
とか出てたなあ)
https://www.javadrive.jp/javascript/dom/index1.html#section1
DOM ではドキュメントを構成するオブジェクトのことを「ノード」と呼びます。ノードはさらに種類に応じて「要素(エレメント)ノード」「テキストノード」「属性(プロパティ?)ノード」などに分類されます。(やっぱりObjectか)
属性とプロパティ (2023.10)
https://ja.javascript.info/dom-attributes-and-properties
eventオブジェクト
簡単な説明と https://www.tohoho-web.com/js/event.htm を読んだ。
\>> console.log(window.event)
buttonをクリックしてイベントでalert画面を出したままログを取るとオブジェクトが見れる。生成され
ている。tohohoにpreventDefault()は載ってないが、上の方法で確認できる。(2023.06)
event索引と一覧 https://developer.mozilla.org/ja/docs/Web/Events https://developer.mozilla.org/ja/docs/Web/API/Event/preventDefault
https://www.tohoho-web.com/js/form.htm#name
フォームを構成する個々のエレメント(部品)オブジェクトを指定します。0 から始まる通し番号や、<input> タグなどの name 属性で指定したエレメント名(例では “ELEM1″)を用いて参照します。
共通部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmCommon を読んだ。(2023.06)
\>>
\
Button部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmButton を読んだ。(まだ未読)
\>>
\
Checkbox部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#checked を読んだ。(まだ未読)
\>>
\
Hidden部品オブジェクト
簡単な説明と https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/hidden を読んだ。(まだ未読)
\>>
\
Option部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#options を読んだ。(2023.06)
\>> console.log(document.forms);
\
Password部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmText を読んだ。(まだ未読)
\>>
\
Radio部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmButton を読んだ。(まだ未読)
\>>
\
Reset部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#reset を読んだ。(まだ未読)
\>>
\
Select部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmSelect を読んだ。(2023.06)
\>> console.log(document.forms);
\ https://www.tohoho-web.com/js/dom.htm#querySelector
\JSはCSSのセレクタ表現ができるということ。style.cssの中のセレクタ記述とは関係ない。
\
Submit部品オブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#submit を読んだ。(2023.05)
\>>
\
Text部品オブジェクト
Textarea Elementオブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm#ElmText を読んだ。(2023.06)
\>>
Formオブジェクト
簡単な説明と https://www.tohoho-web.com/js/form.htm を読んだ。(2023.05)
document.forms https://developer.mozilla.org/ja/docs/Web/API/Document/forms
\>> console.log(window.document.forms);
\>> console.log(form); (<form …>を作ってから見た)
Frameオブジェクト
簡単な説明と https://www.tohoho-web.com/js/window.htm#frames を読んだ。(まだ未読)
\>>
Historyオブジェクト
簡単な説明と https://www.tohoho-web.com/js/history.htm#history を読んだ。'<- ->’が書いてある欄の事。(まだ未読)
\>>
Imageオブジェクト
簡単な説明と https://www.tohoho-web.com/js/image.htm を読んだ。(まだ未読)
HTMLの要素を取得:Image要素。JavaScriptで画像作成:Imageオブジェクト。
\>>
linksオブジェクト
簡単な説明と https://www.tohoho-web.com/js/other.htm#objLink を読んだ。(まだ未読)
\>>
locationオブジェクト
簡単な説明と https://www.tohoho-web.com/js/location.htm#location を読んだ。スキームとアドレス(URL)が書いてある覧の事。
ハッシュを使ったテクニック、と実際
https://shirakawa.weblike.jp/blog-page/2026/01/06…
\>>
Mapオブジェクト
APPENDIXにはない。https://www.tohoho-web.com/js/map.htm を読んだ。(まだ未読)
\>>
Mathオブジェクト
簡単な説明と https://www.tohoho-web.com/js/math.htm を読んだ。(2023.05)
\newできない固定されたObject。
mimeTypeオブジェクト
簡単な説明と https://www.tohoho-web.com/js/other.htm#mimeTypes を読んだ。(まだ未読)
\>>
navigatorオブジェクト
簡単な説明と https://www.tohoho-web.com/js/navigator.htm を読んだ。(2023.05))
\>> navigator.geolocation.getCurrentPosition(success,fail);
\リンク先には無い。参考書籍2の287p。許可してもFirefoxだと失敗するのでChromeで確認した。
Numberオブジェクト
簡単な説明と https://www.tohoho-web.com/js/number.htm を読んだ。(2023.05)
\>>
Objectオブジェクト
APPENDIXにはない。https://www.tohoho-web.com/js/object.htm https://www.tohoho-web.com/js/basic.htm#object
を読んだ。(2023.05)
Object https://developer.mozilla.org/ja/docs/Web/JavaScri…
\参考書籍2にはObjectの追加/削除は書いてないが、Object.assign()/delete演算子でできる。
\Objectが削除されても表示は変わらない。DocumentObjectでModelを更新しないと変わらない。
以下で 安全なWebアプリの作り方を調べた時に、__defineSetter__に遭遇。(2025.12)
https://shirakawa.weblike.jp/blog-page/2024/01/27…
https://www.tohoho-web.com/js/object.htm#prototype
>> console.log(Object.prototype.__defineSetter__)
https://developer.mozilla.org/ja/docs/Web/JavaScri…
コンストラクタ関数のプロトタイプへのメソッド追加は、practice125.html参照。
Pluginオブジェクト
簡単な説明と https://www.tohoho-web.com/js/other.htm#plugins を読んだ。(まだ未読)
\>>
RegExpオブジェクト
簡単な説明と https://www.tohoho-web.com/js/regexp.htm を読んだ。(まだ未読)
\>>
Setオブジェクト
APPENDIXにはない。https://www.tohoho-web.com/js/set.htm を読んだ。(まだ未読)
\>>
screenオブジェクト
簡単な説明と https://www.tohoho-web.com/js/other.htm#screen を読んだ。(まだ未読)
\>>
Stringオブジェクト
簡単な説明と https://www.tohoho-web.com/js/string.htm を読んだ。(2023.06)
indexOf https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/indexOf
\>> console.log(String);
\“(テンプレートリテラル)でもできた。
Symbolオブジェクト
APPENDIXにはない。https://www.tohoho-web.com/js/basic.htm#type を読んだ。(まだ未読)
https://www.tohoho-web.com/js/symbol.htm
\>>
Windowオブジェクト
簡単な説明と https://www.tohoho-web.com/js/window.htm を読んだ。(2023.05-2023.06)
windowオブジェクトの下には、history,location,document,consoleオブジェクトがある。
https://www.tohoho-web.com/js/basic.htm#object
scroll https://developer.mozilla.org/ja/docs/Web/API/Window/scroll
\>> console.log(window.recalc);
\参考書籍2でsetTimeout()やaddEventListener()がTimerやEventのオブジェクトでなくwindowオブジェ
\クトなのは何故か?。(回答は下部。2024.11)
\>> console.log(window.location);
\>> setTimeout(function(){
\ //保存ボタンを押す.ブラウザ上で組んだから補正でclick()に気付けた.
\ document.querySelector(‘form input[type=”submit”][name=”SAVE”][value=”保存”]’).click();
\ }, 25 * 60 * 1000); // 25分後に1回だけ実行. (2024.11)
\
JavaScriptについて、setTimeout()やaddEventListener()がTimerやEventのオブジェクトでなくwindowオブジェクトなのは何故か?。(->ChatGPT)
`setTimeout()` や `addEventListener()` が JavaScript において `window` オブジェクトで定義されている理由は、JavaScriptの設計の歴史と実行環境であるブラウザの構造に関連しています。以下にその理由を説明します。
### 1. `window` はブラウザ環境のグローバルオブジェクト
\- ブラウザでは `window` がグローバルオブジェクトとして機能
\ – ブラウザにおいて、グローバルスコープにあるすべての関数や変数は、`window` オブジェクトのプロパティとしてアクセス可能です。
\ – `setTimeout()` や `addEventListener()` はブラウザ環境で標準的に提供されるAPIであり、グローバルスコープで使えるように設計されました。そのため、これらは `window` オブジェクトの一部とみなされます。
### 2. タイマーやイベントリスナーの管理はブラウザの役割
\- `setTimeout()`
\ – タイマー処理はブラウザのイベントループによって管理されます。JavaScriptエンジン自体にはタイマーの概念がなく、タイマーの実行はブラウザ(またはNode.jsなどの実行環境)が提供します。
\ – このため、`setTimeout()` はタイマー管理をブラウザに依存しており、ブラウザのグローバルオブジェクト(`window`)に属する形となります。
\- `addEventListener()`
\ – イベントリスナーはDOM要素やグローバルイベント(例: ウィンドウのリサイズやスクロールなど)に紐付けられますが、これもブラウザがイベントのキューと発火タイミングを管理します。
\ – `addEventListener()` の設計もブラウザのグローバルイベント管理を扱いやすくするために `window` に定義されています。
### 3. 歴史的な理由
\- シンプルな設計としての選択
\ – JavaScriptの初期設計では、APIの使いやすさが重視されました。当時、モジュール化や抽象化はそれほど進んでいなかったため、すべての基本的な機能を `window` に集約する設計が採用されました。
\- 互換性の維持
\ – 後のJavaScript標準化(ECMAScript)の過程で、既存のブラウザ機能との互換性を維持する必要がありました。このため、`setTimeout` や `addEventListener` のようなブラウザAPIはそのまま `window` のメソッドとして残っています。
### 4. 実際の仕様的な位置づけ
\- タイマー関連のAPI
\ – `setTimeout` や `setInterval` は、ブラウザの “Web APIs” の一部です。これらは ECMA-262(JavaScriptの仕様書)には含まれず、ブラウザが実装する「ホスト環境」の一部として定義されています。
\ – `window` がホスト環境のグローバルオブジェクトであるため、これらのAPIは `window` の一部となっています。
\- イベントリスナー
\ – イベントリスナーも “DOM Level 2 Events” などの仕様に基づき、ブラウザが提供するAPIの一つです。DOMのイベント管理機能も `window` を起点に動作するため、`addEventListener` も `window` に紐付いています。
### 補足: `window` を意識しない場合
`setTimeout` や `addEventListener` は、グローバルスコープに直接定義されているため、通常は `window` を明示的に記述する必要はありません。
setTimeout(() => console.log(‘Hello’), 1000); // これでOK
window.setTimeout(() => console.log(‘Hello’), 1000); // 明示的に記述
この設計は、ブラウザ特有のJavaScript環境を理解する上で重要であり、Node.jsなどの他のJavaScript環境(グローバルオブジェクトが `global` になる)では異なるAPI設計が用いられています。
\
addEventListener() サーバーやアプリのセキュリティー JavaScriptの問題 4h-001.html
https://shirakawa.weblike.jp/blog-page/2024/01/27…
https://developer.mozilla.org/ja/docs/Web/API/Even…
practice128.html も参照。
postMessage() https://www.tohoho-web.com/js/window.htm#postMessage
そのほかのメソッド、プロパティ
ビルトイン関数(グローバル関数)
簡単な説明と https://www.tohoho-web.com/js/builtin.htm を読んだ。(2023.05-2023.06)
カスタムデータ属性(なおかつグローバル属性でもある)
https://developer.mozilla.org/ja/docs/Web/HTML/Global_attributes/data-*
https://developer.mozilla.org/ja/docs/Learn/HTML/Howto/Use_data_attributes
参考書籍2でthumbsはwindowの下にもdocumentの下にもいない。thisやthrowも同じレベル。
decodeURIComponent() 4h-001.html https://shirakawa.weblike.jp/blog-page/2024/01/27…
\>>
参考情報:
JavaScript入門・完全版コース/プログラミング初心者向け、コスパ最強講座
https://www.youtube.com/watch?v=ig3GosWuKF0 (最初の方だけ見た。続きはそのうち見る。2023.04)
【初心者向け】JavaScriptはどうやって生まれた?たった10日の奇跡【プログラミング言語の歴史】
https://www.youtube.com/watch?v=iCB7K7EPxmA
\
CJS, UMD, ESMとは?その違い。 | milestones
https://de-milestones.com/what-is-cjs-umd-esm/
AMDはライブラリ使う編で
https://seesaawiki.jp/lifewithslackzaurus_15_0/d/HTML/CSS/JavaScript%a4%ce%ce%fd%bd%ac%20%bc%c2%c1%a9%20%bb%a8%c2%bf%a4%ca%b5%ad%cf%bf%a3%b2
バブリング と キャプチャリング
https://ja.javascript.info/bubbling-and-capturing
(Firefoxのインスペクターのイベントリスナーで見るバブルフェーズ(バブリングフェーズ))
\
Reactを使いこなすために知っておきたいJavaScriptの機能 (2023.10)
https://kinsta.com/jp/blog/javascript-react/#react-1
letがvarよりも優れている点は以下の通りです。
letはブロック文のスコープに変数を宣言するものです。一方でvarは、ブロックスコープに関係なく、関数全体に対してグローバルまたはローカルに変数を宣言します。
グローバル変数letは、windowオブジェクトのプロパティではありません。window.variableNameでアクセスすることはできません。
letは、その宣言に達した後にのみアクセスすることができます。変数は、制御フローが宣言されたコード行に到達するまで初期化されません(letの宣言は非ホイストです)。
letで変数を再宣言すると、SyntaxError を投げます。
varを使って宣言した変数はブロックスコープを作らないため、ループ内やif文の内部でvarを使って変数を定義すると、ブロック外からアクセスしてしまう可能性があり、コードのバグにつながることがあります。
\
通常の関数とアロー関数の違いは「書き方だけ」ではない。異なる性質が10個ほどある。
https://qiita.com/suin/items/a44825d253d023e31e4d
(アロー関数は再利用しにくいので、今後は使わないようにするか)
アロー関数を使わないようにしたら今更ビックリ、JSって、関数の中で関数宣言しとるやないかい、
と気付いた件。
[JavaScript] 猿でもわかるクロージャ超入門 2 関数の中の関数
https://dqn.sakusakutto.jp/2009/01/javascript_1.html
https://tsudoi.org/weblog/4852/
\
気づけばプロ並みPHP https://seesaawiki.jp/lifewithslackzaurus_15_0/d/HTML/CSS/PHP%a4%ce%ce%fd%bd%ac%20%bc%c2%c1%a9%20%bb%a8%c2%bf%a4%ca%b5%ad%cf%bf
Backbone.jsで学ぶ MVCフレームワーク[実践]入門 https://seesaawiki.jp/lifewithslackzaurus_15_0/d/HTML/CSS/JavaScript%a4%ce%ce%fd%bd%ac%20%bc%c2%c1%a9%20%bb%a8%c2%bf%a4%ca%b5%ad%cf%bf%a3%b3
の二つの練習をやってみて、目的を持って1から作る系が一番身に付くなあと思った。そこで、
簡単なのでいいからCMSを自作してみよう。(2022.08)
javascript ブログ自作、でググった:
javascript CMS自作、でググった:
cms 作り方、でググった:
https://www.arikuimaru.com/blog20200808.html https://www.start-point.net/blog/web/php/cms/
https://note.com/suipedia/n/n88c7b47bda1a https://denkenmusic.com/cms%E3%82%92%E8%87%AA%E4%BD%9C%E3%81%97%E3%81%A6%E3%82%AA%E3%83%AA%E3%82%B8%E3%83%8A%E3%83%AB%E5%8B%95%E7%9A%84%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%92%E3%83%95%E3%83%AB/ https://www.petitmonte.com/php/blogsystem_create.html https://masimaro-comp.com/index.php?page=1
https://seesaawiki.jp/lifewithslackzaurus/d/HTML/CSS/JavaScript%a4%ce%ce%fd%bd%ac (seesaaも参考になる。jQuery大漁?)
と思ったが、オブジェクト一覧をザッと見てからやろう。
\
JavaScriptでゲームプログラミング
https://ayax.jp/g_javascript_game/1_canvas/drawing
参考書籍:
JavaScriptハンドブック 1998.10, 2003.10(4th)
https://honto.jp/netstore/pd-book_02367600.html
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects (JSハンドブックのAPPENDIXの
\オブジェクト一覧の最新)
(約20年前に買ったのは1st。最近になって4thと一緒に読み始めた。今も使えるかMDNを見ながら)
確かな力が身につくJavaScript「超」入門 第2版 2019.09
https://www.sbcr.jp/product/4815601577/
(約20年ぶりに最近のJSの本を買った。偶然だが今回もSB本だった)(2022.06)
(古いJS本とネット検索で調べて練習していたが、最近のJS本で基礎の取りこぼしを拾っておこう。後回し
\になりそう。サボっていたHTML/CSSを1回くらいは練習するか)
O’Reilly Japan – JavaScript 第7版 – オライリー・ジャパン 2021.12 (未読)
https://www.oreilly.co.jp/books/9784873119700/
Software Design 2022年2月号 JavaScriptの関数を極める (未読)
https://gihyo.jp/magazine/SD/archive/2022/202202
開眼! JavaScript 2013.06
https://www.oreilly.co.jp/books/9784873116211/