Closure Série - POO para JS

Escrito por

Hoje vou continuar a falar sobre como passar de Programação Orientada-objetos para JavaScript cada vez mais funcional.

Uma outra coisa bastante diferente para se comparar entre ambos os paradigmas é o uso de closure. No JavaScript, anteriormente tínhamos reproduzido aquela “classe” e acabamos criando uma closure. Vamos supor que eu faça uma função dessa forma:

1function func1() {
2 const name = ‘tulio faria’
3
4 function func1b(){
5 console.log(name)
6 }
7
8 func1b()
9}
10
11func1()

Em JavaScript é normal e podemos fazer uma função dentro de uma função como no exemplo acima. Você percebeu que eu consegui acessar o ‘name’? Isso é uma característica do JS. Por conseguir colocar uma função em uma variável, é possível ter funções dentro de funções. Essa função interna consegue acessar o escopo da função pai.

No cenário, vamos executar esse código todo síncrono e em seguida ele morre, porém, existe uma outra situação onde eu consigo manter esse escopo vivo. Vamos supor que eu queira passar uma saudação:

1function func1() {
2 const saudacao = ‘Ola’ +name
3
4 function func1b(){
5 console.log(saudacao)
6 }
7
8 return func1b
9}
10
11const saudarOTulio = func1(‘Tulio Faria’)
12
13saudarOTulio()

Quando eu fiz isso, a func1 passou a ser uma closure porque ela travou esse escopo inteiro, nisso eu posso a qualquer momento chamar essa saudação. Existem alguns tipos de funcionalidades dentro do JS  que permitem que a gente faça alguns tipos interessantes, como por exemplo:

1const contador = function(num) {
2 let atual = 1
3
4 let timer = setInterval(() => {
5 if (atual === num) {
6 clearInterval(timer)
7 }
8
9 console.log(atual++)
10 }, 1000)
11}
12
13contador(5)

Temos um contador que está usando todas as variáveis do lado de fora e temos um contador separado. Perceba que o setInterval está usando as variáveis de fora, isso cria um enclausuramento dessas variáveis. Outra coisa importante: esse código é assíncrono, então sempre que chamamos o setInterval, colocamos isso no event loop.

Confira o video:

Deixe suas dúvidas e sugestões nos comentários. Curta o DevPleno no Facebook, se inscreva no canal no YouTube e cadastre seu e-mail para não perder as atualizações. Abraço!

Evolua mais rápido

Junte-se a milhares de desenvolvedores no nosso time de alunos premium e alcance mais rápido o próximo nível da sua carreira.

Ver cursos Premium