以下は、提供された英文文本を日本語に翻訳したものです。

JavaScriptクラス：初心者ガイド

こんにちは、未来のJavaScriptの魔法使いたち！今日は、JavaScriptのクラスの世界に興味深い旅をすることになります。コードを書いたことがない人も心配しないでください。私はあなたの親切なガイドとして、ステップバイステップで進めましょう。このチュートリアルの終わりには、プロのように自分のクラスを作成できるようになるでしょう！

JavaScriptクラスとは？

仮想の動物園を建てているとしましょう。それぞれの動物を個別に説明したくないですよね？それがクラスの役に立つところです。クラスは、その型のすべてのオブジェクトが持つべきプロパティと行動を定義する蓝图のようなものです。

簡単な例から始めましょう：

class Animal {
  constructor(name, species) {
    this.name = name;
    this.species = species;
  }

  makeSound() {
    console.log("動物は音を立てる");
  }
}

この例では、Animalは私たちのクラスです。これは、「動物園のすべての動物には名前、種、そして音を立てる能力がある」と言っているようなものです。

JavaScriptクラスの定義

JavaScriptでクラスを定義するには、classキーワードとクラス名をfølえます。クラス名は通常、大文字で始めます。これは必須ではありませんが、クラスを他のコードから区別するための一般的な慣習です。

constructor()メソッド

constructor()メソッドは、クラスで作成されたオブジェクトを初期化するための特別なメソッドです。このクラスから新しいオブジェクトを作成するときに自動的に呼び出されます。

class Book {
  constructor(title, author, year) {
    this.title = title;
    this.author = author;
    this.year = year;
  }
}

ここで、title、author、yearはすべてのBookオブジェクトが持つプロパティです。thisキーワードは作成されるオブジェクトを指しています。

JavaScriptオブジェクトの作成

クラスができたので、いくつかのオブジェクトを作成しましょう！

let myBook = new Book("大いなる盖茨ビー", "F. スコット・フィッツジェラルド", 1925);
console.log(myBook.title); // 出力: 大いなる盖茨ビー

newキーワードは、私たちのBookクラスの新しいインスタンスを作成するために使用されます。これは、「JavaScript、このBook蓝图を使って新しい本を作ってくれ！」と言っているようなものです。

JavaScriptクラスメソッド

メソッドは、クラスに関連する関数で、クラスのオブジェクトが実行できる行動を定義します。

class Dog {
  constructor(name) {
    this.name = name;
  }

  bark() {
    console.log(`${this.name} は言います: ワンワン！`);
  }

  fetch(item) {
    console.log(`${this.name} は ${item} を拾います`);
  }
}

let myDog = new Dog("バディ");
myDog.bark(); // 出力: バディ は言います: ワンワン！
myDog.fetch("ボール"); // 出力: バディ は ボール を拾います

この例では、bark()とfetch()はDogクラスのメソッドです。私たちが作成するすべてのDogオブジェクトはこれらの能力を持つことになります。

JavaScriptクラスの種類

JavaScriptは主に2つの種類のクラスをサポートしています：

1. デクリレーション：これまで使用してきたものです。

   class Rectangle {
     // クラス本体
   }

2. 式：クラスも式として定義できます。

   let Rectangle = class {
     // クラス本体
   };

どちらも同じ結果を得ますが、クラスデクリレーションはより一般的で読みやすくなります。

JavaScriptクラスのホイスト

関数デクリレーションとは異なり、クラスデクリレーションはホイストされません。これは、コードの前にクラスを使用することはできないことを意味します。

// これはエラーをスローします
let p = new Rectangle(); // 参照エラー

class Rectangle {}

常にクラスを使用する前に定義してください！

ストRICTモードとクラス

楽しい事実：クラスの本体は常にストRICTモードで実行されます。これはどういう意味でしょうか？これは、あなたのコードが雑なものであることを許さない厳しい先生がいるようなものです。例えば：

class StrictClass {
  method() {
    undeclaredVariable = 5; // これはエラーをスローします
  }
}

ストRICTモードでは、変数を使用する前に宣言する必要があります。これは一般的なコードのミスをキャッチし、コードをきれいに保つのに役立ちます！

クラスメソッドテーブル

以下は、いくつかの一般的なクラス関連メソッドのハンドブックです：

メソッド	説明
constructor()	クラスの新しいインスタンスを初期化する
static	クラスの静的メソッドを定義する
extends	他のクラスを親として新しいクラスを作成する
super	親クラスのコンストラクタを呼び出す
get	ゲッターメソッドを定義する
set	セッターメソッドを定義する

結論

おめでとうございます！あなたはJavaScriptのクラスの世界への最初の一歩を踏み出しました。新しいスキルを学ぶ際には、練習が成功の鍵です。自分でクラスを作成してみてください。例えば、CarクラスにstartEngine()とdrive()メソッドを追加してみたり、SuperheroクラスにuseSpecialPower()メソッドを追加してみたり。

クラスはJavaScriptの強力なツールで、組織化された、再利用可能なコードを作成するのに役立ちます。これはプログラミングのレゴブロックのように、個別に簡単ですが、組み合わせると素晴らしいものを築くことができます。

codingを続け、学び続け、すぐに複雑なアプリケーションを簡単に構築できるようになるでしょう。未来の開発者たち、ハッピーコーディング！

Credits: Image by storyset