はじめに
こんにちは。web開発未経験からwebアプリケーションエンジニアになるため、勉強を始めようと思い記事にいたします。
私のこれまでの経験はC言語を嗜む程度であり、コンピュータサイエンスに関する知識がゼロのところからのスタートとなりますので暖かく見守っていただけると幸いです。最終的にはReact、Next.jsとモダンなweb開発?へと繋げていけたらと思います。また、初学者の方は、私の記事と一緒に勉強していけたらと思います。
よろしくお願いいたします！
1. アロー関数（簡潔さが命！）
アロー関数はコードを短く、シンプルに書けるから、実戦ではよく使われるらしい。特にコールバック関数や、関数の中でシンプルな処理をしたいときに便利だと。
例えば、配列の各要素を2倍にするなら、アロー関数でこんな感じに書ける：
const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]
アロー関数のおかげで、無駄なく簡潔に書ける。returnを省略できるのがポイント。
2. デフォルト引数（めんどくさい処理を回避！）
実戦では、関数に引数を渡さないときもあるかも？そんなときに役立つのがデフォルト引数。
const greet = (name = 'Guest') => {
return `Hello, ${name}!`;
};
console.log(greet()); // "Hello, Guest!"
console.log(greet('Luna')); // "Hello, Luna!"
引数を忘れてもデフォルトで処理してくれるから、コードの頑丈さが増す。これで引数を渡し忘れた初心者にも優しいコードが書ける。
3. 即時関数（IIFE）
「この関数、すぐに実行したいけど、外に影響を与えたくない！」ってとき、即時関数（IIFE）が役立つ。ブロックスコープを持ちながら、一度だけ実行されるのが特徴。
(function() {
console.log('This runs immediately!');
})();
グローバルスコープを汚さないし、使い捨ての処理を書くときに超便利。だから、他のコードと衝突することがなく、クリーンな設計ができる。
4. 高階関数（関数を返す、または引数に関数を取る）
関数を引数に取ったり、関数を返す高階関数は、実戦でかなり強力なツール。例えば、何度も同じ操作をするけど、ちょっとだけ処理が違う場合に便利。
const multiplier = (factor) => {
return (num) => num * factor;
};
const double = multiplier(2);
console.log(double(5)); // 10
const triple = multiplier(3);
console.log(triple(5)); // 15
こんな風にカスタマイズ可能な関数を作れる。プロジェクトの中で使い回しできる関数を作るときは、こういう柔軟性が必要。
5. コールバック関数（非同期処理の親友）
非同期処理（例えばデータベースやAPIとのやりとり）では、コールバック関数が大活躍。例えば、データの読み込みが完了した後に処理を行うことができる。
const fetchData = (callback) => {
setTimeout(() => {
const data = 'Sample data';
callback(data);
}, 2000); // 2秒後にデータを取得
};
fetchData((result) => {
console.log(`Fetched: ${result}`);
});
これで、時間のかかる処理が終わったタイミングで後続の処理を行える。
6. クロージャ（Closure）
クロージャは、関数が定義されたときのスコープを保持する特殊な機能だ。クロージャを使うと、関数外からでも関数内の変数にアクセスできるようになる。
コードをコピーする
function outer() {
let count = 0;
function inner() {
count++;
console.log(count);
}
return inner;
}
const counter = outer();
counter(); // 1
counter(); // 2
counter(); // 3
inner関数がouter関数のcount変数にアクセスできる。このように、内部関数が外部関数の変数を覚えている状態をクロージャという。
これがむずいな。
const counter = outer();ではouterが呼ばれて、return innerが起こることによって、次回以降のcounterではinnerだけが呼ばれてるんだな。はえー。
おわりに
網羅などできちゃいませんが、一旦触れてみました。ChatGPTのみだと、情報の正確性や、網羅性を担保することができないので、しっかり体型的に勉強するにはプロンプトを工夫するか、本やドキュメントを活用しないとなと思います。
それでは失礼します。