7

Qual a diferença prática entre eu criar uma função construtora desta forma:

function construtora (nome, sobrenome) {
    this.nome = nome
    this.sobrenome = sobrenome
}

Ou desta forma:

function construtora (nome, sobrenome) {
    let obj = {}
    
    obj.nome = nome
    obj.sobrenom = sobrenome
    
    return obj
}  
1

1 Resposta 1

4

No seu primeiro exemplo, você têm uma função que funciona como construtura (constructor function), que retorna uma nova instância de objeto se você chamá-la utilizando o operador new. Assim:

function construtora(nome, sobrenome) {
  this.nome = nome;
  this.sobrenome = sobrenome;
}

const instance = new construtora('John', 'Doe');
console.log(instance);

Como você não especificou na resposta se está usando o new ou não, acho pertinente falar que se você simplesmente invocar a função, sem utilizar o operador new, um objeto não será retornado. A chamada simplesmente retornará undefined:

function construtora(nome, sobrenome) {
  this.nome = nome;
  this.sobrenome = sobrenome;
}

const instance = construtora('John', 'Doe');
console.log(instance); // undefined

A partir do ECMAScript 2015 (vulgo ES6), esse padrão "prototípico" clássico para atingir um certo tipo de "orientação a objetos" no JavaScript foi sendo menos usado, uma vez que a construção class foi introduzida. Mas não se engane, pois class não passa de mero açúcar sintático para essa antiga abordagem prototípica.


Já no seu segundo exemplo, não diria que a função (construtora) é, de fato, uma função construtora. Você está criando um tipo de função fábrica (factory function), por que você cria um objeto literal e o retorna. Vale dizer que nos dois casos um objeto está sendo criado, mas há uma sutil diferença a qual eu entro em mais detalhes nesta outra resposta.

De forma resumida (leia a pergunta referida para saber mais), nesse segundo exemplo, você está criando um objeto literal (o que não é o caso no primeiro exemplo). Desse modo, se você verificar, a forma como os objetos foram construídas é diferente e, nesse caso, os construtores também. Veja:

function construtora1(nome, sobrenome) {
  this.nome = nome;
  this.sobrenome = sobrenome;
}

function construtora2(nome, sobrenome) {
  let obj = {};
  obj.nome = nome;
  obj.sobrenom = sobrenome;
  return obj;
}

const instance = new construtora1('John', 'Doe');
const obj = construtora2('Luiz', 'Felipe');

console.log(instance);
console.log(obj);

console.log(instance.constructor.name); // "construtora1"
console.log(obj.constructor.name); // "Object"

Note que, apesar das propriedade próprias (own properties) dos objetos instance e obj serem as mesmas, os construtores são diferentes, o que também indica uma diferente cadeia de protótipos.


A título de preferência, eu pessoalmente considero o nome da função do primeiro exemplo construtora correto, já que a função está construindo um objeto (contrutora é o construtor do objeto se este tiver sido criado através do operador new).

No entanto, o nome da função (construtora) do segundo exemplo não me parece tão preciso, já que não é a função (construtora) que constrói o objeto, mas sim Object. Vale lembrar que, internamente, quando você cria objetos literais, eles são construídos a partir de Object.

Do ponto e vista semântico e interno da linguagem, há a diferença de que, quando se chama uma função sem o operador new, a propriedade interna [[Call]] é invocada. Quando a função é chamada utilizando o operador new, a propriedade interna [[Construct]] é chamada. Consulte esta tabela para saber mais.

A própria especificação (na tabela referida) refere-se às funções que implementam [[Call]] como "callable" e às funções que implementam [[Construct]] como "constructors". Vale salientar que toda constructor function é, também, callable.


Não tem a ver com a pergunta, mas note que coloquei ponto e vírgula no final de cada statement. Pode parecer "frescura", mas criei esse hábito para evitar algumas situações bizarras que podem ocorrer se você não utilizar o ponto e vírgula em todas as linhas (veja mais sobre o assunto aqui).

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .