DeclarationとExpression、Arrowの基本
function declarationとexpressionの違い、arrow functionの構文、シンプルな利用パターンを学びます。
「DeclarationとExpression、Arrowの基本」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン1/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全3レッスンが含まれています。
導入
目標: 関数の宣言と式を見分け、基本的なアロー構文を学び、目的に合った最も簡潔な形式を選びます。
- 宣言
- 式
- アローの基本
関数宣言
関数宣言はホイスティングされるため、定義より上に呼び出しを記述できます。
// Function declaration
// Can be called before or after its definition (hoisted)
console.log(greet("Ayla"));
function greet(name) {
return "Hello, " + name + "!";
}
console.log(greet("Coder"));
関数式
関数式は実行時に作成されるため、代入文の後で呼び出します。
// Function expression
// Assigned to a variable; not callable before this line
const add = function (a, b) {
return a + b;
};
console.log("Sum:", add(2, 3));
アロー関数の基本
アロー関数は簡潔に記述できます。パラメーターが1つの場合は括弧を省略でき、1行の本体ではreturnを省略できます。
// Arrow function basics
// Short, expression-friendly syntax
const double = (n) => {
return n * 2;
};
const square = n => n * 2; // simple one-liner for demo
console.log(double(4));
console.log(square(4));
形式の選び方
名前付きのユーティリティには関数宣言を使用し、小さなインラインヘルパーにはアロー関数を使用します。
// Pick the simplest form for clarity
// Use declarations for top-level named utilities
function toTitle(name) {
return "Title: " + name;
}
// Use arrows for tiny inline helpers
const shout = text => text.toUpperCase();
console.log(toTitle("Intro"));
console.log(shout("hello"));
初心者向けのヒント
ヒント:
- 関数には、何をする関数か分かる名前を付けます。
- 1つの関数には小さなタスクを1つだけ持たせます。
- 本体は短く平坦に保ち、戻り値を明確にします。
ホイスティングのクイズ
クイックチェック: ホイスティングの動作
まとめ
まとめ: 関数宣言はホイスティングされ、名前付きのユーティリティに適しています。関数式とアロー関数は実行時に作成され、小さなヘルパーに適しています。
よくある質問
「DeclarationとExpression、Arrowの基本」レッスンは無料ですか？
はい。「DeclarationとExpression、Arrowの基本」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全3レッスンが含まれています。
「DeclarationとExpression、Arrowの基本」で何を学びますか？
function declarationとexpressionの違い、arrow functionの構文、シンプルな利用パターンを学びます。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
JavaScript Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/3です。
「DeclarationとExpression、Arrowの基本」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavaScript Academyレッスンでコードを書いて実行できますか？
はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- DeclarationとExpression、Arrowの基本
- Parameter、Default、Rest、Return
- thisの基本、call/apply/bind（入門）