NÃO ENTENDO - IIFE

[xfelipee]

Olá Fernando, me desculpa mais uma vez está incomodando. Mas eu tenho uma dúvida!

Se a IIFE não retorna nada, para que ela serve então(fora manter o escopo das variáveis)? Não faz muito sentindo para mim, quando ela executa, ela faz o quê?

@fdaciuk

[fdaciuk]

Oi @xfelipee! Nunca é um incômodo meu caro! Pergunte sempre que achar necessário :)

Sobre a IIFE, a ideia principal é essa mesmo: evitar que tudo vá para o escopo global, já que dados em escopo global podem ser alterados em qualquer parte da aplicação, incluindo por scripts de terceiros :)

Quando você mantém tudo em escopo local, o código fica mais previsível, pois você sabe exatamente o que está sendo alterado :)

A IIFE foi pensada pois o JavaScript (até o ES5) ainda não tem um sistema de módulos. A partir do ES6, foi adicionado um sistema de módulos, para manter tudo local sem a necessidade de, necessariamente, envolver tudo em uma função auto-executável :)

E também só criamos uma função anônima auto-executável, pois se você criar uma função nomeada, ela também vai para o escopo global, o que não faz muito sentido, já que queremos que tudo seja local :)

Essa função, assim que executada, e o seu código interno é finalizado, o garbage collector do JavaScript remove ela da memória, já que ela não vai mais ser usada.

Criando uma função em escopo global, não é possível remover ela de memória, pois é impossível saber se ela ainda será usada ou não :)

Ficou mais claro? :)

[xfelipee]

• Veja só, eu aprendi(estudando só) que as variáveis dentro de uma função só existem enquanto ela está em execução. Então como eu consigo acessar o "name" depois que a função foi executada?
• Seria porque essa function já funciona como objeto?
• E o objeto instanciado nesse caso é o new Person( ) ?

Obrigado mais uma vez.

/------------------------------------------/

Criando uma função em escopo global, não é possível remover ela de memória, pois é impossível saber se ela ainda será usada ou não :)

• function nome( ) { } é uma função de escopo global e o garbage collector não serve para ela?
• Eu tinha entendido quando você falou de escopo de função que era necessário criar variáveis com "var" para gargabe collector atuar e apagar elas da memória. Eu achava que servia para todo o escopo da função.

[fdaciuk]

Oi @xfelipee! Vamos lá:

Veja só, eu aprendi(estudando só) que as variáveis dentro de uma função só existem enquanto ela está em execução. Então como eu consigo acessar o "name" depois que a função foi executada?

Está certíssimo! O ponto com a variável name é que, em navegadores, ela é uma global, já setada pelo navegador, que representa o nome da janela atual. Inclusive, ela é sempre uma string. Se você tentar atribuir qualquer outro tipo de dado para essa variável, vai ver que ela vai sempre transformar esse tipo de dado em string.

Mais informações sobre a global name aqui: https://developer.mozilla.org/en-US/docs/Web/API/Window/name

---

function nome( ) { } é uma função de escopo global e o garbage collector não serve para ela?

Isso mesmo! Essa função foi criada em escopo global, logo ela nunca será removida de memória, até que a aba do navegador que está rodando a aplicação onde essa função foi definida seja fechada :)

---

Eu tinha entendido quando você falou de escopo de função que era necessário criar variáveis com "var" para gargabe collector atuar e apagar elas da memória. Eu achava que servia para todo o escopo da função.

Isso mesmo! Quando você não usa var, a variável é criada em escopo global, e não poderá ser removida de memória até que a aba seja fechada :)

[xfelipee]

Isso mesmo! Quando você não usa var, a variável é criada em escopo global, e não poderá ser removida de memória até que a aba seja fechada :)

• Logo, a function nome( ) { } não funciona o garbage collector para suas variáveis internas, é isso? Elas continuam armazenas mesmo depois de executadas, porque o escopo dessa função é global?

[fdaciuk]

Logo, a function nome( ) { } não funciona o garbage collector para suas variáveis internas, é isso? Elas continuam armazenas mesmo depois de executadas, porque o escopo dessa função é global?

Para as variáveis declaradas dentro dessa função, quando elas não forem mais utilizadas, elas serão sim removidas de memória. O que não vai ser tirado da memória é a função nome. Mas como funções têm escopo próprio, a cada execução dessa função, novas variáveis serão criadas :)

[xfelipee]

• Explica isso ai, como é isso? o console.log(name) retornar "undefined"

PS: No mais, tudo entendido. Por hoje é só. Obrigado Fernando!

[fdaciuk]

O console.log sempre vai retornar undefined, pois esse método log não tem retorno definido. O que ele faz é "logar" o valor passado via argumento no seu console.

Faça um teste:

console.log('a');

Você vai ver que o resultado vai ser:

undefined
a

O primeiro resultado é o retorno do método (quando usado return. Se return não for usado, ele retorna sempre undefined por padrão).

O segundo resultado é o valor da variável, logado (exibido) no console.

No caso da variável name, como eu disse antes: essa é uma variável especial. Ela é sempre global. Eviter usar name para nomes de variável, principalmente se estiver no escopo global :)

No caso, a próxima linha após o undefined deveria exibir <empty string> no Firefox. Ao menos aqui pra mim exibe isso :)

Pode até testar com uma string vazia mesmo, que você vai ter o mesmo resultado:

console.log('');

=)

[xfelipee]

• Veja isso. Tem alguma coisa a ver com o ES6? Hoje eu abusei. Me desculpa ai novamente. Mas infelizmente eu não sou você. Sou burro.

PS: Eu sei, como você falou, a variável "name" é problemática. Mas eu estava apenas fazendo um teste.

[fdaciuk]

haha! Você não é burro não, simplesmente está aprendendo, e por ter sede de conhecimento, está tirando suas dúvidas. Isso é louvável. Parabéns :)

Sobre o erro: não tem a ver com ES6. Na verdade, o ES6 não muda nada no comportamento do que já existem em ES5. Aprendendo ES5, você aprende a base da linguagem, nada muda nas versões posteriores. Apenas novas features são adicionadas :)

O que acontece é o seguinte: name é uma global, desde o momento em que a sua aplicação carrega em uma aba do navegador. window.name já está disponível. Quando você faz isso:

(function () {
  'use strict';
  name = 'felipe';
})();

Você está simplesmente reatribuindo uma valor a uma variável já existente (lembre que window.name e só name é a mesma coisa, desde que não haja uma declaração da variável name - com var - dentro da função onde ela foi usada).

Por isso não dá erro, e por isso você tem acesso ao valor dessa variável fora da IIFE.

Já no caso de xname, esse nome ainda não existe. Você simplesmente atribuiu um valor a ela dentro da função. Como essa variável não está declarada ainda, e você está usando use strict, você vai obter esse erro dizendo que você não deve atribuir valor a uma variável que não foi definida :)

Ficou melhor assim pra entender a diferença? =)