Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Duvida sobre a declaração a variável 'valor'

Referente ao curso JavaScript na Web: manipule o DOM com JavaScript, no capítulo Comportamento do formulário e atividade Capturando valor do input

por Lorenzo Lopes Costa
| 81.7k xp | 4 posts

na aula o professor cria uma variável com o nome de 'valor' que recebe o 'input.value' e na linha de baixo um console.log para mostras oque tem dentro dessa variável. até ai OK

a minha duvida é o porque declarar essa variável 'valor' sendo que ele poderia apenas colocar o 'input.value' diretamente dentro do console.log

fiz o teste aqui e funciona corretamente, e já vi em outros cursos professores fazendo esse tipo de declaração nem entender o real motivo, se é questão de boas praticas , para melhorar a legibilidade do código ou algo do tipo. Obrigado!!

Meu código:

novaTarefa.addEventListener('click',()=> {
    const input = document.querySelector('[data-form-input]')
    console.log(input.value)
})

Código da aula:

novaTarefa.addEventListener('click',()=> {
    const input = document.querySelector('[data-form-input]')
    const valor = input.value
    console.log(valor)
})
2 respostas
solução!
por Cândido Luiz Lucas De França
| 22.6k xp | 33 posts

Fazer essa atribuição const valor = input.value torna o código mais legível. Imagine que dentro dessa função seja necessário diferentes validações a respeito desse valor do input. O código ficaria menos legível caso utilizasse a abordagem em que se utiliza o input.value diretamente.

por Cândido Luiz Lucas De França
| 22.6k xp | 33 posts

Exemplo com a atribuição: 

exemplo.addEventListener('click',()=> {
    const input = document.querySelector('[data-form-input]')
    const valor = input.value
    if (valor >= 10 && valor <= 20{
        console.log(valor * 2)
    }
})

Exemplo sem a atribuição:

exemplo.addEventListener('click',()=> {
    const input = document.querySelector('[data-form-input]')
    if (input.value >= 10 && input.value <= 20{
        console.log(input.value * 2)
    }
})