Crie a sua própria função Extend

Publicado por Javier Zambrano Ferreira em 04/06/2011

[ Hits: 5.743 ]

0 0

Denuncie Favoritos Indicar Impressora

Crie a sua própria função Extend

Há várias situações em que há necessidade de unir propriedade de dois objetos, essa função faz essa tarefa no Javascript.

Crie a sua própria função Extend

Uma das melhores funções encontrada nos Frameworks Javascript é a extend: jQuery.extend( target, [ object1 ], [ objectN ] ). A função é responsável em unir dois objetos, tendo como resultado um único objeto com propriedades de ambos.

Mas como ela é implementada? Abaixo segue um exemplo de código:

Object.extend = function (destino, fonte) {
   //Navega por todas as propriedades do objeto fonte
   for (propriedade in fonte) {
      //e adiciona cada propriedade no objeto destino
      destino[propriedade] = fonte[propriedade];
   }
  //retorna o objeto modificado
   return destino;
};

O que estamos fazendo no código é adicionar a função extend ao tipo Object por prototype do Javascript, isso é assunto para outro post. A nova função recebe dois objetos literais: destino e fonte. O objeto destino é o objeto que resultará da união de ambos, o objeto fonte terá todas as propriedades copiadas para destino. É importante observa, que propriedades com mesmo nome, por exemplo, destino["idade"] = 14 e fonte["idade"] = 20 serão sobrescrito, ou seja, destino["idade"] passará a ter o valor 20.

Vamos simplificar melhor o seu uso:

  var livro1 = {
   'editora' : 'xxxxx',
   'isbn' : '9999999'
  }

var livro2 = {
  'titulo': 'Era uma vez',
'volume':  '1'
}

//Objeto resultante da união do livro1 e livro2
var livro = Object.extend(livro1, livro2);

//Livro terá as seguintes propriedades:
livro = {
    'editora' : 'xxxxx',
   'isbn' : '9999999',
   titulo': 'Era uma vez',
  'volume':  '1'
}

Outras dicas deste autor

Nenhuma dica encontrada.

Leitura recomendada

Migrando máquinas físicas para máquinas virtuais

Documentação

Instalando tudo via apt-get usando o Ubuntu

Instalação do Adicional de Segurança WARSAW via linha de comando

Menu popup dinânico (DHTML) com infinitos níveis usando apenas CSS

Comentários

Nenhum comentário foi encontrado.