Definições de Método

No ECMAScript 2015 foi introduzida uma sintaxe reduzida para definição de métodos em inicializadores de objetos. É uma abreviação para uma função atribuída ao nome do método.

Sintaxe

var obj = {
  propriedade( parametros… ) {},
  *generator( parametros… ) {},
// também com chaves computadas:
  [propriedade]( parameters… ) {},
  *[generator]( parametros… ) {},
// compare ES5 sintaxe para getter/setter:
  get propriedade() {},
  set propriedade(valor) {}
};

Descrição

A sintaxe reduzida é similar à da getter e setter  introduzida no ECMAScript 5.

Dado o seguinte código:

var obj = {
  foo: function() {},
  bar: function() {}
};

Agora você pode reduzi-lo para isto:

var obj = {
  foo() {},
  bar() {}
};

Generator methods

Os generator methods também podem ser definidos utilizando a sintaxe reduzida.

  • Observe que o asterisco (*) na sintaxe reduzida deve estar antes do nome da propriedade generator. Assim, * g(){} funcionará, porém g *(){} não.
  • Se o método não for generator, sua definição não pode conter a palavra-chave yield. Dessa forma, generator functions legadas também não funcionarão, lançando um SyntaxError. Sempre utilize yield em conjunto com o asterisco (*)
// Utilizando a propriedade com nome (pre-ES6)
var obj2 = {
  g: function*() {
    var indice = 0;
    while(true)
      yield indice++;
  }
};

// O mesmo objeto utilizando a sintaxe reduzida
var obj2 = { 
  * g() {
    var indice = 0;
    while(true)
      yield indice++;
  }
};

var coisa = obj2.g();
console.log(coisa.next().value); // 0
console.log(coisa.next().value); // 1

Métodos assíncronos

Funções assíncronas também podem ser definidas usando a sintaxe reduzida.

// Utilizando a propriedade com nome (pre-ES6)
var obj3 = {
  f: async function () {
    await alguma_promise;
  }
};

// O mesmo objeto com a sintaxe reduzida
var obj3 = { 
  async f() {
    await alguma_promise;
  }
};

Generator methods assíncronos

  Os generator methods também podem ser assíncronos

var obj4 = {
  f: async function* () {
    yield 1;
    yield 2;
    yield 3;
  }
};

// O mesmo objeto com a sintaxe reduzida
var obj4 = {
  async* f() {
   yield 1;
   yield 2;
   yield 3;
  }
};

Métodos reduzidos não são construíveis

Métodos assim definidos não são construtores e lançarão um TypeError se você tentar instanciá-los.

var obj = { 
  metodo() {},
};
new obj.metodo; // TypeError: obj.method is not a constructor

var obj = { 
  * g() {} 
};
new obj.g; // TypeError: obj.g is not a constructor (modificado no ES2016)

Exemplos

Caso de teste simples

var obj = {
  a : "foo",
  b(){ return this.a; }
};
console.log(obj.b()); // "foo"

Nome de propriedades computados

A sintaxe reduzida também suporta nome de propriedades computados.

var 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

Especificações

Especificações Estado Comentário
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Method definitions' in that specification.
Padrão Initial definition.
ECMAScript Latest Draft (ECMA-262)
The definition of 'Method definitions' in that specification.
Rascunho  

Compatibilidade de browser

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
Method definitionsChrome Full support 39Edge Full support 12Firefox Full support 34IE No support NoOpera Full support 26Safari Full support 9WebView Android Full support 39Chrome Android Full support 39Firefox Android Full support 34Opera Android Full support 26Safari iOS Full support 9Samsung Internet Android Full support 4.0nodejs Full support Yes
Async generator methodsChrome Full support 63Edge No support NoFirefox Full support 55IE No support NoOpera Full support 50Safari No support NoWebView Android Full support 63Chrome Android Full support 63Firefox Android Full support 55Opera Android Full support 46Safari iOS No support NoSamsung Internet Android Full support 8.0nodejs Full support 10.0.0
Full support 10.0.0
Full support 8.10.0
Disabled
Disabled From version 8.10.0: this feature is behind the --harmony runtime flag.
Async methodsChrome Full support 55Edge Full support 15Firefox Full support 52IE No support NoOpera Full support 42Safari No support NoWebView Android Full support 55Chrome Android Full support 55Firefox Android Full support 52Opera Android Full support 42Safari iOS No support NoSamsung Internet Android Full support 6.0nodejs Full support 7.6.0
Full support 7.6.0
Full support 7.0.0
Disabled
Disabled From version 7.0.0: this feature is behind the --harmony runtime flag.
Generator methods are not constructable (ES2016)Chrome Full support 42Edge Full support 13Firefox Full support 43IE No support NoOpera Full support 29Safari No support NoWebView Android Full support 42Chrome Android Full support 42Firefox Android Full support 43Opera Android Full support 29Safari iOS No support NoSamsung Internet Android Full support 4.0nodejs ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
User must explicitly enable this feature.
User must explicitly enable this feature.

Veja também