クラスフィールド、privateな#フィールド、staticメンバー
publicフィールドを持つクラスを作り、privateな#フィールドでデータを隠し、staticプロパティやメソッドを追加します。
「クラスフィールド、privateな#フィールド、staticメンバー」はCoddyKit上の無料JavaScript Academyレッスンです。 これはレッスン1/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavaScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 JavaScript Academyコースには全3レッスンが含まれています。
クラスを使う理由
目標:小さく明確なクラスを作ります。
- パブリックフィールドとメソッド
- 状態を隠す#privateフィールド
- クラスレベルのヘルパーに使うstaticプロパティとメソッド
- 例は小さく読みやすく保ちます

パブリックフィールドとコンストラクター
パブリックフィールドと小さなメソッドを持つクラスを作ります。初心者向けに、ロジックはシンプルに保ちます。
// Public fields and a simple method
class Counter {
// public field with default
value = 0;
constructor(start) {
// use a default if start is not provided
this.value = Number.isFinite(start) ? start : 0;
}
inc() {
this.value = this.value + 1;
}
}
const c1 = new Counter(2);
c1.inc();
console.log("value:", c1.value); // 3

プライベート#フィールド
#privateフィールドは言語によって強制され、クラス本体の内部でのみ使用できます。必要に応じて、読み取り用メソッドを公開します。
// Private # fields hide internal state
class SafeCounter {
// private field (only inside the class)
#value = 0;
constructor(start) {
this.#value = Number.isFinite(start) ? start : 0;
}
inc() { this.#value = this.#value + 1; }
getValue() { return this.#value; } // expose via method
}
const sc = new SafeCounter(5);
sc.inc();
console.log("safe value:", sc.getValue());
// External access fails (uncommenting the next line would throw):
// console.log(sc.#value);

安全に読み取るためのgetter
getterは、フィールドをプライベートに保ったまま、派生値や検証済みの値を返せます。
// Getters provide read-only views; simple guard logic
class User {
#name = "Anonymous";
constructor(name) {
if (typeof name === "string" && name.trim().length > 0) {
this.#name = name.trim();
}
}
get name() {
return this.#name;
}
}
const u = new User(" Ayla ");
console.log("name:", u.name);

staticメンバー
staticメンバーはインスタンスではなくクラスから呼び出します(例:MathHelp.circleArea())。
// Static = belongs to the class, not to instances
class MathHelp {
static PI = 3.14159;
static circleArea(r) {
if (!(typeof r === "number" && r >= 0)) return 0;
return MathHelp.PI * r * r;
}
}
console.log("PI:", MathHelp.PI);
console.log("area r=2:", MathHelp.circleArea(2));
// Instances do not have the static members:
const mh = new MathHelp();
console.log("instance has PI?", "PI" in mh); // false

初心者に適した習慣
ヒント:
- メソッドが少なく、明確な小さなクラスを優先します。
- 本当のプライバシーには#privateを使います。アンダースコアは命名規則にすぎません。
- 定数やユーティリティはstaticメンバーに置きます。
- 外部からのアクセスが必要なら、最小限の読み取り用メソッド(getter)だけを公開します。

プライベートフィールドの基礎クイズ
クイックチェック:#privateフィールドです。

まとめ
まとめ:単純な状態にはパブリックフィールドを使い、内部を隠すには#privateを使い、クラスレベルのヘルパーにはstaticを使います。各クラスは小さく、読みやすく保ちます。

よくある質問
「クラスフィールド、privateな#フィールド、staticメンバー」レッスンは無料ですか?
はい。「クラスフィールド、privateな#フィールド、staticメンバー」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、JavaScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 JavaScript Academyコースには全3レッスンが含まれています。
「クラスフィールド、privateな#フィールド、staticメンバー」で何を学びますか?
publicフィールドを持つクラスを作り、privateな#フィールドでデータを隠し、staticプロパティやメソッドを追加します。 ブラウザで直接実行するハンズオンコードでJavaScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
JavaScript Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのJavaScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/3です。
「クラスフィールド、privateな#フィールド、staticメンバー」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavaScript Academyレッスンでコードを書いて実行できますか?
はい。すべてのJavaScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- クラスフィールド、privateな#フィールド、staticメンバー
- 継承、super、コンポジションを優先する場面
- Mixin(体験) — 深い階層なしで簡単に再利用