De forma geral a sua é mais simples, então, entre as duas, é a que eu faria porque eu prefiro a Navalha de Ocam.
Eu não estou vendo motivos para fazer da primeira forma. Mas poderia ter em um exemplo mais real. Exemplos artificiais são complicados para estabelecer o que é bom ou não porque eles não tem contexto, e contexto é tudo para decidir sobre a aplicabilidade de algo. E não saber isso é o maior problema de programadores novatos (alguns programam por décadas e ainda são como novatos porque não gostam de aprender, gostam só de ver resultados).
Um motivo para fazer da primeira forma seria dar nome para uma rotina, e isso é uma forma de evitar um comentário explicando o que aquilo faz. Mas só faria sentido se a função tivesse um nome explicativo, chamando teste2()
não serve para isso.
Ainda acho exagerado na maioria das vezes, e quase certamente nesse caso, até porque é pequeno e o código ali faz algo bem padronizado e que é quase auto explicativo por ele mesmo. Sem falar que criar essa função pode piorar a performance (não estou afirmando porque pode haver otimizações), mas não é o melhor motivo para evitar criar a função.
Se a função fosse genérica e recebesse inclusive que elemento que deve pegar faria um pouco mais de sentido, mas tenho minhas dúvidas se não seria exagerado. De qualquer forma fazendo assim seria outro código. Para esse exemplo eu não faria a função secundária fora dela tentando manter a ideia do primeiro código, ainda mais se manter o nome teste()
. Para outro exemplo o problema é outro e a decisão deve ser outra. Aí novamente, esse não é o melhor motivo para escolher fazer uma função genérica, essa decisão deve observar outras coisas para decidir por isso.
De fato dá para simplificar, esse exemplo eu faria assim:
function boolPortugueseElement() {
document.getElementById('element').innerHTML = true ? 'verdadeiro' : 'falso';
}
boolPortugueseElement();
<div id='element'>
</div>
Coloquei no GitHub para referência futura.
Quando você simplifica tende a ficar mais fácil entender e fica menos necessário fazer outras coisas. Algumas pessoas não gostam porque dizem que é menos legível. Eu não acho que esse caso seja, legibilidade é subjetiva. Alguns dizem que dificulta para o estagiário, mas o estagiário deve ser ensinado programar, não diminuir a barra para ele. Eu bato o olho nisso e entendo perfeitamente o que acontece ali. Os códigos da pergunta eu demorei para entender, especialmente o primeiro. Mas reforço que a falta de bons nomes ajudou não entender.
O mais indicado é dar bons nomes antes de qualquer outra preocupação.
Acho muito mais importante colocar o ;
do que essa preocupação, porque isso pode dar problema. Não entendo porque pegou moda das pessoas não usarem mais ele.
Eu acho que as pessoas criam variáveis demais. Eu criaria uma para dar legibilidade, mas só se o nome for muito explicativo e o código que ela processe seja complexo, caso contrário é só para complicar o código.
Embora tivesse no título, na pergunta mesmo não havia clareza que queria saber sobre o var
. Nunca deixe de usar o var
, a não ser que prefira usar o let
. Então nesse ponto o primeiro código está errado. Sim, funciona, mas ele poderia apresentar problemas em outra situação. Acostume-se usar sempre do jeito mais correto, igual ao que eu falei sobre o ;
, só porque pode não usar em algumas situações, pra que não usar? Que ganho espera ter em não usar?
Mas eu colocaria o var
no primeiro código, não sei porque não foi colocado.
Veja Qual é a diferença entre declaração de variáveis usando let e var?.