Criar função dólar($) no JavaScript

Postado em: 14 de novembro de 2008 por Pedro Rogério

Você já pensou em efetuar economia de código ao criar seus códigos JavaScript? Será que ao invés de digitar um getElementById, não seria mais interessante você digitar um simples $(dólar), igual os mais famosos Frameworks JavaScript fazem? Micox já deixou a sua sugestão, onde ao invés de você digitar isso:

function juntaEnd(){
    var rua = document.getElementById('input_rua').value
    var num = document.getElementById('input_num').value
    var bairro = document.getElementById('input_bairro').value
    var cidade = document.getElementById('input_cidade').value
    var estado = document.getElementById('input_estado').value
    return rua+num+bairro+cidade+estado
}

Seria melhor você criar uma outra função e utilizar dessa forma:

function get(quem) { return document.getElementById(quem) }
function juntaEnd(){
	var rua = get('input_rua').value
	var num = get('input_num').value
	var bairro = get('input_bairro').value
	var cidade = get('input_cidade').value
	var estado = get('input_estado').value
	return rua+num+bairro+cidade+estado
}

Agora, semelhante aos Frameworks JavaScript:

function $(obj){
	return document.getElementById(obj);
}

Adaptado ao código do Micox, ficaria da seguinte forma:

function $(obj) { return document.getElementById(obj) }
function juntaEnd(){
	var rua = $('input_rua').value
	var num = $('input_num').value
	var bairro = $('input_bairro').value
	var cidade = $('input_cidade').value
	var estado = $('input_estado').value
	return rua+num+bairro+cidade+estado
}

Como podem ver, é uma boa economia de código.

Isso pode lhe interessar:

Sobre Pedro Rogério

Pedro Rogério é desenvolvedor web por paixão, não saberia fazer melhor outra coisa. Além de escrever para o Pinceladas da Web é proprietário do blog CSS no Lanche, blog voltado ao desenvolvimento front-end.

Deixe seu comentário

5 comentários para esse post

Barba disse: 14.11.08 ás 15:02

#1

ou melhor ainda:

function juntaEnd(){
var rua = $(’#input_rua’).val();
var num = $(’#input_num’).val();
var bairro = $(’#input_bairro’).val();
var cidade = $(’#input_cidade’).val();
var estado = $(’#input_estado’).val();
return rua+num+bairro+cidade+estado
}
Alexsandro disse: 14.11.08 ás 15:38

#2

Realmente é uma boa economia, com isto podemos criar scripts com menos bytes e muitos dispotivos agradece a economia de banda.

Uma série de benefícios!
Gabriel Gilini disse: 14.11.08 ás 15:52

#3

Perfeito, também uso variáveis para document, body, etc.
ex:

function foo(){
var d = document;
var b = d.body;
// Faz algo
}

Só recomendo que não usem o $ para identificadores em seus códigos, a não ser que tenha sido gerado por máquina.

Do ECMA-262 3ed Cap 7.6
“This standard specifies one departure from the grammar given in the Unicode standard: The dollar sign ($)
and the underscore (_) are permitted anywhere in an identifier. The dollar sign is intended for use only in
mechanically generated code.”
Leonir disse: 22.11.08 ás 11:08

#4

Num caso como este eu também gosto de economizar a palavra chave var, substituindo o ponto e vírgula, por uma simples vírgula. Assim o primeiro var surte efeito para todas as variáveis até o próximo ponto e vírgula.

function juntaEnd(){
var rua = $(’#input_rua’).val(),
num = $(’#input_num’).val(),
bairro = $(’#input_bairro’).val(),
cidade = $(’#input_cidade’).val(),
estado = $(’#input_estado’).val();
return rua+num+bairro+cidade+estado;
}
felipe disse: 16.01.09 ás 14:55

#5

eu faço assim

function $(){
return((a=arguments[0]).match(/^#([-.\w\d]+)$/i))?document.getElementById(RegExp.$1):document.getElementsByTagName(a)
}

$(”#id”) ou $(”tag_name”)[0]