Quando é um objeto no Javascript construída?

Question

Considere a seguinte função Javascript (1):

function setData(domElement) {
  domElement.myDataProperty = {
    'suppose': 'this',
    'object': 'is',
    'static': 'and',
    'pretty': 'big'
  };
};

Agora, o que eu não gosto sobre esta função é que exatamente o mesmo objeto é criado cada vez que a função é chamada. Como o objeto não muda Eu preferiria criá-lo apenas uma vez. Portanto, pode fazer os seguintes ajustes (2):

var dataObject = {
  'suppose': 'this',
  'object': 'is',
  'static': 'and',
  'pretty': 'big'
};

function setData(domElement) {
  domElement.myDataProperty = dataObject;
};

Agora, o objeto é criado uma vez que quando o script é carregado e armazenado em dataObject. Mas vamos supor que setData é chamado apenas ocasionalmente - na maioria das vezes que o script é carregado a função não é usada. O que eu não gosto sobre esta função, nesse caso, é que o objeto é sempre criada e mantida na memória, incluindo muitas ocasiões em que nunca serão usados. Achei que você poderia fazer algo assim para encontrar o equilíbrio ideal (3):

var dataObject;

function setData(domElement) {
  if (!dataObject) {
    dataObject = {
      'suppose': 'this',
      'object': 'is',
      'static': 'and',
      'pretty': 'big'
    };
  }
  domElement.myDataProperty = dataObject;
};

Será que isso faz sentido? Eu acho que isso depende de quando o intérprete decide criar um objeto. Será que realmente esperar até que passe a condição !dataObject, ou ele entrar na função, tenta ser esperto e decide construir isso com antecedência? Talvez diferentes mecanismos JavaScript ter políticas diferentes com relação a isso?

Então, claro, há a questão de saber se essas otimizações nunca vai importa na prática. Obviamente, isso depende de fatores como o tamanho do objeto, a velocidade do motor, a quantidade de recursos disponíveis, etc .. Mas, em geral, qual você diria que é a otimização mais significativo: a partir de (1) a (2) ou a partir de (2) a (3)?

Answer 1

A resposta é, você não é suposto saber. Os exemplos que mostraram ter muito pouca diferença entre eles. A única maneira que você jamais razoavelmente preocupar com isso é se você tivesse evidência real de que uma forma ou de outra foi noticably prejudicar o desempenho ou uso de memória em um intérprete particular. Até então, é o trabalho do intérprete que se preocupar com essas coisas para você.

Dito isto, se você realmente quer saber ... Experimente e descubra. chamar as diferentes versões 1.000.000 vezes e ver que diferença faz.

Faça uma versão gigante do objeto e ver se isso faz um dente. Assista gerenciador de tarefas. Tente diferentes navegadores. Informar seus resultados. É uma maneira muito melhor para descobrir que apenas pedindo um bando de idiotas na internet o que acho que pode ser o caso.

basta ter em mente que objeto tem que estar na memória de qualquer maneira, independentemente ... como texto de origem

Answer 2

Um novo objeto deve ser criado - não pode não ser, em parte porque a especificação exige isso, mas principalmente porque o comportamento alternativa seria contra-intuitivo, tomar:

function f() {
    return {a : "b", c: "d"};
}
o=f();
alert([o.c, o.e]); // Alerts "b,"
delete o.c;
o.e="f";
o=f();
alert([o.c, o.e]); // If the object was only created once this would produce ",f"

Você realmente espera que uma nova expressão de objeto não realmente produzir o objeto que você está pedindo? Porque é isso que você parece querer.

É concebível que você só quer fazer:

var myFunction = (function(){
    var object = {a: "b", c: "d"};
    return function() { return object; }
})();

Qual seria obter o efeito desejado, embora você tem que perceber que o objeto que você está retornando é um objeto completamente mutável que pode ser mudado, e todos estariam compartilhando a mesma instância mutante.

Answer 3

Em primeiro lugar, eu implementá-lo em situação # 2 e carregá-lo uma vez, imediatamente após a página é carregada.

Se havia um problema com a velocidade de página, gostaria de medir o tempo necessário para tarefas específicas dentro da página.

Se era muito caro para criar o objeto (relativamente falando), então eu iria passar para situação # 3.

Não há nenhum ponto em adicionar o 'if' se ele realmente não compra qualquer coisa ... e, neste caso, a criação de um grande objeto / simples é nenhum suor das costas de seu CPU. Sem medições, você não está otimizando - você está apenas disparando cega

.

Na verdade, é um método bastante comum de inicializar as coisas que eu usei pessoalmente em C ++ e Java.

Answer 4

Em primeiro lugar, essa otimização nunca será assunto na prática.

Em segundo lugar, a última função é exatamente tão bom quanto a primeira função. Bem, quase. No primeiro eu suponho que você está à mercê do coletor de lixo, que deve destruir o velho objeto quando você domElement.myDataProperty Reassign. Ainda assim, sem saber exatamente como funciona o coletor de lixo em sua plataforma de destino (e isso pode ser muito diferente entre os navegadores), você não pode ter certeza que você está salvando qualquer tipo de trabalho realmente.

Answer 5

Tente todos os três em um par de navegadores e descobrir o que é mais rápido.