JavaScript 静的メソッド

概要: このチュートリアルでは、JavaScriptの静的メソッドとその効果的な使用方法について学習します。

JavaScript 静的メソッド入門

定義によると、静的メソッドはクラスにバインドされ、そのクラスのインスタンスにはバインドされません。そのため、静的メソッドはヘルパーメソッドやユーティリティメソッドを定義するのに役立ちます。

ES6以前では、静的メソッドをクラスのコンストラクタに直接追加して定義します。たとえば、次のようなPerson型があるとします。

function Person(name) {
    this.name = name;
}

Person.prototype.getName = function () {
    return this.name;
};Code language: JavaScript (javascript)

次のコードは、Person型にcreateAnonymous()という静的メソッドを追加します。

Person.createAnonymous = function (gender) {
    let name = gender == "male" ? "John Doe" : "Jane Doe";
    return new Person(name);
};Code language: JavaScript (javascript)

createAnonymous()メソッドは、プロパティ値にPerson型のインスタンスを必要としないため、静的メソッドとみなされます。

createAnonymous()メソッドを呼び出すには、インスタンスではなくPerson型を使用します。

var anonymous = Person.createAnonymous();Code language: JavaScript (javascript)

ES6におけるJavaScript静的メソッド

ES6では、staticキーワードを使用して静的メソッドを定義します。次の例は、PersonクラスにcreateAnonymous()という静的メソッドを定義しています。

class Person {
	constructor(name) {
		this.name = name;
	}
	getName() {
		return this.name;
	}
	static createAnonymous(gender) {
		let name = gender == "male" ? "John Doe" : "Jane Doe";
		return new Person(name);
	}
}Code language: JavaScript (javascript)

静的メソッドを呼び出すには、次の構文を使用します。

let anonymous = Person.createAnonymous("male");Code language: JavaScript (javascript)

クラスのインスタンスから静的メソッドを呼び出すと、エラーが発生します。例:

let person = new Person('James Doe');
let anonymous = person.createAnonymous("male");Code language: JavaScript (javascript)

エラー

TypeError: person.createAnonymous is not a functionCode language: JavaScript (javascript)

クラスコンストラクタまたはインスタンスメソッドからの静的メソッドの呼び出し

クラスコンストラクタまたはインスタンスメソッドから静的メソッドを呼び出すには、クラス名に続いて.と静的メソッド名を使用します。

className.staticMethodName();Code language: CSS (css)

あるいは、次の構文を使用することもできます。

this.constructor.staticMethodName();Code language: CSS (css)

まとめ

  • JavaScriptの静的メソッドは、クラスのインスタンス間で共有されます。そのため、クラスにバインドされます。
  • 静的メソッドは、クラス名を使用して呼び出し、インスタンスからは呼び出さないでください。
  • クラスコンストラクタまたはインスタンスメソッド内で静的メソッドを呼び出すには、className.staticMethodName()またはthis.constructor.staticMethodName()を使用します。
このチュートリアルは役に立ちましたか?