これまで学習したJavaScriptの知識を言語化してみる。
2021年夏、本格的にJavaScriptの学習を始めました。
そこで、今までに学習してきたJavaScriptの知識をまとめて言語化してみました。
ぼくの主なプログラミング学習方法は、Udemyが7割、Youtubeが3割くらい。
無料で有益な情報が得られるYoutubeだけでも、ある程度は学べますが、
Udemyで多少の受講料を払って学習した方がより気持ちが入って確実に身になりますね。
Udemyは頻繁にセールを行っているので、そのタイミングで購入すれば、ほとんどの講座が2000円以下で買えます。
プログラミング講座以外にも役立つ講座が沢山あるので日々の学習にオススメです。^ ^
さて、いざ得た知識をひとつひとつ言葉で書き記そうと思うと、これがなかなか難しいもので。苦笑
今後も得た知識のアウトプットの場として、随時追記して行きます。
気になる点がございましたら、DMにてお気軽にご意見お寄せ下さい。^ ^
JSファイルの読み込み
JSファイルはHTMLが読み込まれた後に実行することが多いので、基本的にはbody閉じタグの手前に記述。
または、headタグ内に、
<head>
<script src=“main.js” defer></script>
</head>
と、scriptタグ内にdeferと記述することにより、HTMLファイルを読み込んだ後にJSファイルを実行することが可能になる。
変数の宣言
再代入可能な変数は「let」、再代入が出来ない変数は「const」で定義する。
ES6以前は「ver」を使っていたが現在は非推奨。
インクリメント演算子とデクリメント演算子
インクリメントは数値の値を1増加させる⇨++i(前置), i++(後置)
デクリメントは数値の値を1減少させる⇨--i(前置), i--(後置)
なお、演算子には前置演算子と後置演算子があり、計算式で代入する順番が異なると、結果が変わってしまうので要注意。
for文
for文とは決められた回数だけ繰り返し処理を行う制御文である。
例）
for(let i = 0; i < 10; I++) {
console.log(i);
};
if文
if文は条件分岐処理を記述する際に使用する。
例）
if(条件式) {
// 条件がtrueの場合こちらを実行
}else{
// 条件がfalseの場合こちらを実行
}
HTML要素の取得とイベント処理
HTML要素を取得する際は、要素にidを指定して、「getElementById」を使う。
クリックした時のイベント処理は「addEventListener」を使う。
例）
document.getElementById(‘id名’).addEventListener(‘click’, function() {
// 実行したい処理 ;
});
アロー関数
無名関数を記述しやすくした省略記法である。
function() {};
↓↓↓↓↓↓
() => {};
即時関数
他のJavaScriptファイルで同じ名前の変数や関数があった場合に誤って上書きしてしまうことを防ぐ為に、予めプログラム全体を囲む関数の事。
正式には「即時実行関数式」と呼ばれる。
アロー関数で書いた場合
↓↓↓↓↓↓
(() => {
// 実行したい処理
})();
まだまだ他にも学ぶべきことは山積みだけど、実務をこなしながら分からないことはどんどんググろう。
Web開発者向けの学習プラットフォーム、MDNのリファレンスを参照するのが間違いがなくて確実ですね。
https://developer.mozilla.org/ja/docs/Web/JavaScript
P.S.
先日、初めてJavaScriptを使って写真ギャラリーを作ってみました。
