O JavaScript que você deveria conhecer.

Não ser tão técnico te faz ser um diferencial no mercado, acredita nisso?

Se você está lendo esse post, acredito que ficou curioso em saber o que estaria escrito aqui. A coisa é bem simples, vou relatar o que aprendi em um curso de JavaScript há um tempo atrás, mostrar algumas definições e como aplico na empresa em que eu trabalho.

A ideia surgiu quando um brother, de um grupo de desenvolvedores do whatsapp, falou a seguinte frase:

Galera, uma dica de coração para vocês crescerem: estudem mais os conceitos e menos “como faz”. Entendam, realmente, bem os conceitos.

Foi então que achei interessante compartilhar alguns dos conceitos e funções que havia aprendido e que já aplico nos projetos da empresa =)

Conceitos

Closures

São funções que referenciam variáveis de outro escopo, ou seja, você já tem uma função que executa um determinado código e referencia uma variável de escopo global ou qualquer outro escopo para dentro dela. Closures por padrão tem 3 cadeias de escopo: Acesso ao seu próprio escopo, funções externas e acesso global. Conheça mais sobre closures aqui.

Etapa de Hoisting

Essa etapa trabalha com escopo da aplicação, ela faz uma leitura de todas as funções, variáveis e argumentos e as executa, uma vez declarada, logicamente, no topo do escopo. Nos exemplos abaixo você consegue entender melhor.

No primeiro exemplo o Hello() entra na estapa de hosting como verdadeiro, pois ela existe e pode ser executada. Já o hi() recebe uma função como valor, porém ela é hoisted, ou seja, vai para o topo do escopo antes da execução sendo declarada como var hi. Sendo assim o seu valor é indefinido(undefined) e não é reconhecida como function.

No segundo exemplo number() é declarado no incício do escopo com o valor 5 e depois do return eu declaro novamente o number() com outro valor e mesmo sendo escrito no final da função, ele é interpretado como hoisted e vai para o início do escopo com um novo valor. Então ele sobreescreve e passa a valer 15.

Aqui tem um post bem legal do @caio_gondim que fala sobre hoisting e hoisted.

Função dentro de função

É um tipo de uso que não traz problemas, quando se usa de maneira correta. Uma função dentro de outra função tem seus níveis de acesso. As funções que são filhas tem acesso as anteriores, ou seja, níveis acima. Mas nem todas as funções de nível acima tem acesso as de níveis inferiores.

Pelo exemplo acima, você consegue ver que a função c() acessa todas as outras funções, da mesma maneira a função b() também acessa. Porém a função a() só acessa seu próprio escopo e a função de b().

PS: Função dentro de função também pode ser considerada um closure, não?

High Higher order function

É um tipo de conceito que precisa ter 1 de 2 critérios. Uma função como argumento, o tal do callback, ou retornar uma função como resposta da função. Usa-se muito esse conceito para dividir em pequenas partes seu código JavaScript.

High Order Function e First-class Function

Há uma diferença. Quando você diz que a linguagem tem First-class functions (funções de primeira classe), isso significa que você pode atribuir uma função em uma variável em tempo de execução, podendo ser passados, manipulados, retornados.

O conceito de High Order Function pode ser aplicado às funções de um modo geral. O conceito de First-class function só tem a ver com as funções em linguagens de programação. É mais comum dizer que “uma linguagem tem ou não tem função suporte de funções de primeira classe”.

Exemplo de linguagens sem o suporte: C, Pascal e Java.

As duas coisas estão intimamente relacionadas, uma vez que é difícil imaginar uma linguagem com funções de primeira classe que não iria também oferecer suporte ao conceito de High Order Function e vice-versa.

IIFE — Immediately-Invoked Function Expression

É um conceito bem legal para usar, digamos, funções auto-executáveis. Ela tem uma sintaxe bem limpa e clara. Pode-se dizer que seu nível de acesso é “Private”. Tendo a vantagem de que nenhuma função pode acessar elementos criado em seu escopo, tornando-se, tecnicamente, algo privado.

Ainda sobre esse conceito de IIFE existe um POST bem legal do @cowboy (Ben Alman) que ele diz que não é bem auto-executável e sim é apenas a chamada da expressão “()”

Funções Anônimas

Obviamente é toda função que não possui um nome, ou seja, o seu atributo name é uma string vazia. Mas também são consideradas funções anônimas as funções que são passadas como valor para uma variável, pois não entram na etapa de hoisting como function e sim como valor atribuído para uma variável, como informa o exemplo 2.

Funções

Call()

É uma função bem legal de se usar, ele executa uma função e espera uma lista como argumento para passar ao contexto this, ou seja, digamos que você já conhece a ordem e a quantidade dessa lista que será passada como argumento, use o call. Saiba mais sobre a função call() aqui.

Apply()

O Apply é semelhante ao call(), ele é executado e espera um array como argumento, ou seja, digamos que você não sabe a ordem dos argumentos, mas que eles estejam em sequência, usa o apply. Saiba mais sobre a função apply() aqui.

Ambos o call() e apply() são chamadas de funções.

Uma coisa interessante entre o call() e apply() é que ambos podem retornar valores diferentes do contexto this de um função com diversas chamadas, mudando apenas o contexto this do argumento da chamada.

Map()

A função map() também é bem irada ela é bem simples. Ela recebe um callback como argumento e referencia um array. Então ele executa esse callback para cada item do array. Saiba mais sobre a função map() aqui.

Considerações

Nos últimos tempos eu tenho saído da minha zona de conforto, tenho otimizado meu tempo e estudado bastante JavaScript puro, seus Frameworks, Nodejs, Conceitos de programação e Programação funcional.

Para nós, desenvolvedores, saber somente como fazer não é o suficiente, às vezes saber conceitos e como aplicá-los pode nos tornar diferenciados no mercado. Por isso estude coisas que você acha chato, pois grandes oportunidades pedem como requisitos conhecimento não técnicos.