Oi sumidos, olha eu de volta depois de um tempo praticando a "Solitude"(Quem nunca hahaha) resolvi voltar com tudo trazendo um artigo quentinho sobre javascript.
Dessa vez vamos falar de Functions, as famosas funções em javascript. Vamos aprender o que são, onde vivem e do que se alimentam.
Na orientação a objetos podemos chamar as funções de métodos que consistem em um objeto que traz um código executável podendo conter parâmetros.
Todas as definições que implementamos dentro de uma função não conseguem ser acessadas fora dessa função, ou seja, fora do escopo.
Vamos declarar uma função na prática e ver como funciona:
Temos uma função que foi declarada com a palavra reservada que é própria do javascript function e atribuímos a ela o nome de myFunction.
Dentro dos parenteses() atribuimos um argumento que usaremos no escopo(Escopo é o 'Corpo' da função, guardem esse segredinho),
e dentro da nossa função, chamamos retorno do nosso argumento passado por parâmetro.
Então, ao executarmos a nossa função, teremos o seguinte resultado:
Qualquer argumento que passarmos no parâmetro será retornado na função
Vamos praticar mais um pouquinho, agora com uma operação?
Dentro de uma função podemos executar operações, condições, exibir contextos e mais uma infinidade de possibilidades. No exemplo a seguir vamos fazer uma operação:
Na função criada chamada soma, passamos duas variaveís como parâmetro e no retorno realizamos a soma desses parâmetros. Podemos realizar diversas operações dentro de uma função, soma, multiplicação, divisão, subtração, verificações condicionais e por ai vai.
Ao executar nossa função o usuário deve passar dois números no parâmetro. Ao chamá-la teremos o seguinte resultado:
E ai curtiu? Tente praticar agora um pouquinho, bora colocar a mão na massa e testar com diversas formas e depois volte aqui para aprender mais um pouquinho hehe!!!
Arrow Functions
Funções do tipo Arrow Function surgiram com o ES6 e vieram para economizar tempo dos desenvolvedores e simplificar o escopo da função. Estas expressões de funções são melhor aplicadas para funções que não sejam métodos, e elas não podem ser usadas como construtoras (constructor).
As funções arrow functions tem return implícito, ou seja, se a sua função for simples, basta terminá-la com com o retorno esperado, como no exemplo a seguir:
Caso a sua função seja mais extensa, com maiores especifições, ai sim você pode chamar o return:
Filter, Map e Reduce
Funções do tipo Filter, Map e reduce nos permitem executar operações sem alterar nossos objetos / arrays, de acordo com as nossas necessidades de forma limpa e organizada. Vamos conhecê-las:
Para implementar nossas funções, vamos criar um objeto:
Filter:
A função do tipo Filter tem nada menos que o papel de filtrar, ou seja, gerar um retorno de acordo com a condição passada.
Vamos criar uma const chamando o nosso objeto e com a função filter vamos retornar a apenas os homens do objeto pessoas:
Ao executar nosso código, o retorno será esse:
Map:
A função do tipo Map posibilita a criação de um novo objeto com base no já existente:
Executando, esse será o retorno com o curso acrescentado no objeto:
Reduce:
Entre as funções Filter, o Map, o _Reduce é a função que exige maior atenção devido a sua complexidade. O Reduce nos permite realizar transformar o tipo do nosso objeto.
No exemplo, vamos somar as idades de todoas pessoas do objeto com o Reduce.
O primeiro parâmetro age é a variável que irá armazenar a nossa soma, ou seja o valor que o totalIdades terá. O parâmetro person representa o item que estamos iterando dentro do nosso objeto. Todo esse escopo é o primeira parâmetro que carrega o escopo do nosso totalIdades, que chama a propriedade idade de dentro do nosso objeto e realiza a soma ao passar por cada item e depois retorna o valor da propriedade. O segundo parâmetro zero, é o valor inicial :
Esse será o nosso resultado:
Alguns anos atrás eu vi a melhor definição ilustrada do Filter Map e Reduce no Global Nerd, olhem só que bacana:
Se você chegou até aqui, P-A-R-A-B-É-N-S, aprendemos juntos o monte de coisas legais que podemos fazer com as funções. Espero que tenham gostado. Tem algo que quer acrescentar, ou até corrigir? É só deixar seu recadinho. Até breve...
Top comments (2)
Cuidado com isto.
Arrow Function
trouxerem bem mais coisas além de retornos implícitos.A principal funcionalidade é preservar o contexto do pai, não fazendo o chamado "context shadowing", onde não cria um novo
this
.Muito obrigada pela observação Tiago, vou reestruturar a explicação nesse ponto.😊