1648497720
JavaScript の Array
クラスはグローバルオブジェクトで、高水準、リスト風のオブジェクトである配列の構築に使用されます。
ES6の配列メソッドは便利だけど「種類が多すぎて使い所・使い方が分からない」という方のために、現役フロントエンドエンジニアがよく使うメソッドを3つに絞って解説しました。
番外編として正規表現メソッドも紹介してます。
★JavaScript入門のコードをまとめたGitHub
https://github.com/deatiger/JavaScriptBasic
1648497720
JavaScript の Array
クラスはグローバルオブジェクトで、高水準、リスト風のオブジェクトである配列の構築に使用されます。
ES6の配列メソッドは便利だけど「種類が多すぎて使い所・使い方が分からない」という方のために、現役フロントエンドエンジニアがよく使うメソッドを3つに絞って解説しました。
番外編として正規表現メソッドも紹介してます。
★JavaScript入門のコードをまとめたGitHub
https://github.com/deatiger/JavaScriptBasic
1648519200
JavaScriptを使う最大の理由、と言っても過言ではない「DOM要素の変更」を解説します。
画像のプレビュー表示やコメント機能も、DOM操作を使えば実現できます。
1. innerTextでテキストを書き換える
2. innerHTMLでHTMLごと書き換える
3. setAttribute()で画像を置き換える
4. insertAdjacentHTML()でHTMLを挿入する
★CodePen
https://codepen.io/Torahack/pen/eYpLVLR
★JavaScript入門のコードをまとめたGitHub
https://github.com/deatiger/JavaScriptBasic
1648511220
DOM操作できないのが許されるのは小学生までだよね〜。
ということでJavaScriptを使う最大の目的であるDOM操作の基本を解説します。
勉強と復習のためにJavaScriptのDOM操作について記事にしていこうと思います。
DOMとは
今回はDOM要素の取得が中心です。
特に、申込フォームで役立つtipsをご紹介しています。
★ソースコード(CodePen)
https://codepen.io/Torahack/pen/RwWBGjM
★即時関数によるカプセル化の解説動画
https://youtu.be/1VyEfy03NTg
★JavaScript入門のコードをまとめたGitHub
https://github.com/deatiger/JavaScriptBasic
1648574220
僕がよく使う「文字列操作」のメソッドを5つご紹介します。
使えない知識はムダなので、実戦で使えるものだけ。
<目次>
0:00 オープニング
2:11 split()メソッドの使い方
3:30 slice()メソッドの使い方
8:41 lengthプロパティの使い方
10:54 toLocaleString()メソッドの使い方
12:15 replace()メソッドの使い方
17:25 まとめ
★CodePen
・getUrlQuery https://codepen.io/Torahack/pen/mdVeqRX
・dateToString https://codepen.io/Torahack/pen/rNxOYwO
・countStringLength https://codepen.io/Torahack/pen/ZEQbavG
・localePrice https://codepen.io/Torahack/pen/LYGpOrj
・returnCodeToBrTag https://codepen.io/Torahack/pen/mdVeqjj
1648563360
「正規表現」という言葉にアレルギー反応を示していませんか?
確かに正規表現は、初心者にとって最もとっつきにくい領域です。
けど、この動画を見ればもう大丈夫。
少しも怖くないわ(レリゴー)
★CodePen
・RegExpパターン練習
https://codepen.io/Torahack/pen/pojQOgp
・RegExp(メールアドレスと電話番号の検証)
https://codepen.io/Torahack/pen/dyYQgRW
★JavaScript入門のコードをまとめたGitHub
https://github.com/deatiger/JavaScriptBasic