メソッド定義
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
ECMAScript 2015 より、オブジェクトイニシャライザーのメソッド定義のための短い構文が導入されました。これは、メソッドの名前に割り当てられた関数の簡略構文です。
試してみましょう
const obj = { foo() { return "bar"; }, }; console.log(obj.foo()); // Expected output: "bar" 構文
js
const obj = { get property() {}, set property(value) {}, property( parameters… ) {}, *generator( parameters… ) {}, async property( parameters… ) {}, async* generator( parameters… ) {}, // 算出されたキーも使用可能: get [property]() {}, set [property](value) {}, [property]( parameters… ) {}, *[generator]( parameters… ) {}, async [property]( parameters… ) {}, async* [generator]( parameters… ) {}, }; 解説
ジェネレーターメソッド
ジェネレーターメソッドも、同様に簡略構文を使用して定義することができます。
次のように行います。
- ジェネレータープロパティ名の前にアスタリスク (
*) が必要です。すなわち、* g(){}は動作しますが、g *(){}は動作しません。 - 非ジェネレーターメソッド定義では
yieldキーワードを入れることはできません。つまり 旧式のジェネレーター関数は動作せず、SyntaxErrorが発生します。yieldは常にアスタリスク (*) と一緒に使ってください。
js
// 名前付きプロパティを使用 const obj2 = { g: function* () { let index = 0; while (true) { yield index++; } }, }; // 簡略構文を使用して同じオブジェクトを生成 const obj2 = { *g() { let index = 0; while (true) { yield index++; } }, }; const it = obj2.g(); console.log(it.next().value); // 0 console.log(it.next().value); // 1 非同期メソッド
非同期メソッドも簡略構文を使用して定義することができます。
js
// 名前付きプロパティ const obj3 = { f: async function () { await some_promise; }, }; // 簡略構文を使用して同じオブジェクトを生成 const obj3 = { async f() { await some_promise; }, }; 非同期ジェネレーターメソッド
ジェネレーターメソッドも非同期関数にすることができます。
js
const obj4 = { f: async function* () { yield 1; yield 2; yield 3; }, }; // 簡略構文を使用して同じオブジェクトを生成 const obj4 = { async *f() { yield 1; yield 2; yield 3; }, }; メソッド定義はコンストラクターではない
メソッドがコンストラクターになることはできません。インスタンス化しようとすると TypeError が発生します。
js
const objA = { method() {}, }; new objA.method(); // TypeError: obj.method is not a constructor const objB = { *g() {}, }; new objB.g(); // TypeError: obj.g is not a constructor (ES2016 で変更) 例
簡単なテストケース
js
const obj = { a: "foo", b() { return this.a; }, }; console.log(obj.b()); // "foo" 計算されたプロパティ名
簡略構文は計算されたプロパティ名にも対応しています。
js
const bar = { foo0: function () { return 0; }, foo1() { return 1; }, ["foo" + 2]() { return 2; }, }; console.log(bar.foo0()); // 0 console.log(bar.foo1()); // 1 console.log(bar.foo2()); // 2 // A global function function foo() { return 1; } let name = "foo"; console.log(window[name]()); // 1 仕様書
| Specification |
|---|
| ECMAScript® 2026 Language Specification # sec-method-definitions |
