Como criar e utilizar funções em JavaScript.
Tags: javascript, beginners
Published: 2023-01-23 20:10:30

De seu uso como uma linguagem de script front-end para desenvolvimento web, o Javascript evoluiu e agora está sendo implantado em várias pilhas e ambientes de aplicativos, principalmente pelo seu domínio de mercado no mundo da programação. Entre os recursos mais poderosos do JavaScript está seu uso para funções, mas como elas funcionam? Vamos analisar.



Funções são uma das principais ferramentas de programação em JavaScript. Elas permitem a criação de código reutilizável e organizado, tornando o desenvolvimento de aplicações mais eficiente.

Uma função é um conjunto de instruções que podem ser executadas quando é chamada. Ela pode receber parâmetros, realizar cálculos e retornar valores. A declaração de uma função se baseia em :fornecer seu nome, separar os argumentos com parênteses e declarar em chave como no caso abaixo:

```
function minhaFuncao(objeto) {
  objeto.make = "Toyota";
}

var meucarro = {make: "Honda", model: "Accord", year: 1998};
var x, y;

x = meucarro.make;     // x recebe o valor "Honda"

minhaFuncao(meucarro);
y = meucarro.make;
```



Há outros casos em que a função pode ser decalarada dentro de uma variável.


```
function sumAndPrint()
{
   var a = 5;
   var b = 7;
   var sum = a + b;
   document.write(sum);
};
```

A função recebeu o nome de `sumAndPrint`, não dete nenhum argumento guardado, mas foi declarado em chaves os valores de uma variável. Isso é conhecido como funções de ordem superior.





**Parâmetros de Função**

Em JavaScript, parâmetros de função por padrão são `undefined`. No entanto, em algumas situações pode ser útil definir um valor padrão diferente.

Nas versões ECMAScripts antigas, a estratégia geral para definir padrões era testar os valores de parâmetro no corpo da função e atribuir um valor se eles fossem undefined. Se, no exemplo a seguir, nenhum valor é fornecido para b na chamada, seu valor seria undefined ao avaliar a*b e a chamada para multiplicar retornaria `NaN`. 

No entanto com parâmetros padrão, a verificação no corpo da função não é mais necessária. Agora você pode simplesmente colocar 1 como valor padrão para b no campo de declaração de parâmetros.

Veja os dois modos:



```
// MODELO CLÁSSICO
function multiplicar(a, b) {
  b = typeof b !== 'undefined' ?  b : 1;

  return a*b;
}

multiplicar(5); // 5
```


```
//MODELO ATUAL
function multiplicar(a, b = 1) {
  return a*b;
}

multiplicar(5); // 5
```



**ARROW FUNCTIONS**

E como existe uma evolução constante no mundo da programação, com foco em acrescentar novos recursos e melhorar a experiência de uso do programador, foi criado as ARROW FUNCTIONS,com o objetivo de declarar uma função de maneira mais curta, veja com o caso a seguir:


```
// Antes de Arrow
hello = function() {
  return "Hello World!";
}
```

```
// Após o uso de Arrow
hello = () => {
  return "Hello World!";
}
```


Conseguimos perceber que utilizando Arrow, a denomização é retirada deixando apenas os parêntes, e antes de delcarar parâmetros por uma chave, é utilizado =>, trazendo o nome de Arrow na forma de escrita da função.

Vale lembrar que ao utilizar Arrow Functions, existe uma alteração no modelo de uso de `this`. Normalmente ao declarar uma função padrão, o `this` é usado para um objeto chamar uma função. Já utilizando Arrow, o `this` irá _sempre_ representará um objeto que chama uma função.


```
// Método Function:
hello = function() {
  document.getElementById("demo").innerHTML += this;
}

// The window object calls the function:
window.addEventListener("load", hello);

// A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);
```


```
// Arrow Function:
hello = () => {
  document.getElementById("demo").innerHTML += this;
}

// The window object calls the function:
window.addEventListener("load", hello);

// A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);
```


Com base no que vimos,conseguimos entender o funcionamento de uma Função. Funções são fundamentais e  amplamente utilizadas em todos os tipos de aplicações. Elas permitem a criação de código organizado e reutilizável, tornando o desenvolvimento mais eficiente e fácil de manter.

> Obrigado por ler.