Javascript: Arrow Functions
De Aulas
Revisão de 09h50min de 22 de abril de 2024 por Admin (discussão | contribs) (Criou página com 'Afluentes: Desenvolvimento Front-end I = Arrow Functions = As ''arrow functions'' foram introduzidas no ES6 e permitem escrever a sintaxe de uma função de forma mais r...')
Afluentes: Desenvolvimento Front-end I
Arrow Functions
As arrow functions foram introduzidas no ES6 e permitem escrever a sintaxe de uma função de forma mais reduzida.
Código JavaScript sem arrow function:
function hello() {
return "Hello World!";
}
O mesmo é válido da seguinte forma:
hello = function() {
return "Hello World!";
}
Código JavaScript com arrow function:
hello = () => {
return "Hello World!";
}
Por exemplo:
<!DOCTYPE html>
<html>
<body>
<h1>Arrow Function</h1>
<p>Demonstrando uma <i>arrow function</i> simples.</p>
<p id="demo"></p>
<script>
hello = () => {
return "Olá mundo!";
}
document.getElementById("demo").innerHTML = hello();
</script>
</body>
</html>
E pode ficar mais curto ainda. Se a função retorna apenas um valor, é possível remover as chaves:
hello = () => "Hello World!";
Se a função tiver parâmetero, você pode passar eles dentro parênteses:
hello = (val) => "Hello " + val;
Ou sequer precisa usar os parênteses:
hello = val => "Hello " + val;