Diferenças em Javascript

Front-end
#1

Boa tarde!

Qual a diferença entre:

var foo = function (){
}

foo = fucntion (){
}

this.foo = function(){
}

?

Estou com dúvidas na hora de interpretar os erros de códigos de exemplo que encontro na intrent por conta disso.

#2

Nos 3 casos você está associando uma variável a uma função.

var foo = function (){ }
Nese caso, a variável foo será uma variável local no escopo da função em que foi criada

foo = fucntion (){ }
Nesse caso foo será uma variável global, sendo acessada de qualquer lugar

this.foo = function(){ }
Nesse caso vai criar a variável no contexto de this e isso depende para onde this está apontando.
Como é sempre muito fácil se enganar onde this aponta, eu geralmente evito usar.

#3

Oi Abel! Muito obrigado pela ajuda. Eu queria aproveitar e te perguntar mais uma coisa.

Eu tenho o seguinte código (é um teste):

[code]PageObjects = function() {

var preencheCaixa = dvr.findElement(by.id('global-search'));
var opcaoBusca = dvr.findElement(by.css('#search > ul > li:nth-child(1) > a'));

this.pesquisar = function(pesquisa) {

    //dvr.findElement(by.id('global-search')).sendKeys(pesquisa);
    preencheCaixa.sendKeys(pesquisa);
    opcaoBusca.click();

};

};[/code]

Por alguma razão, na função pesquisar(pesquisa) a linha preencheCaixa.sendKeys(pesquisa) não funciona.

Essa função, está sendo chamada/executada em outra classe. Para fazer a função funcionar, eu preciso descomentar a linha 08 e comentar as linhas 09 e 10.

#4

Pra verificar onde está o problema você deveria conferir o log do javascript e se tem algum erro acontecendo.
Se o teste está sendo rodado no browser, você geralmente pode conferir no Console.

Repare que as duas opções de código que passou não são equivalmentes.

var preencheCaixa = dvr.findElement(by.id('global-search'));
    var opcaoBusca = dvr.findElement(by.css('#search > ul > li:nth-child(1) > a'));

Este trecho é executado quando a função PageObjects é criada e os objetos podem não estar disponíveis nesse momento.
Já no segundo caso:

Esse trecho tenta encontrar o elemento quando a função pesquisar é chamada (e não quando é declarada) e portanto o elemento pode estar disponível esse momento.

Talvez transformando preencheCaixa e opcaoBusca em funções e chamando elas dentro da função pesquisar, você obtenha o comportamento desejado.

#5

Eu debuguei o código (me enrolei um pouco com o debugger do webstorm) e quando a linha preencheCaixa.sendKeys(pesquisa); é executada, ela tem o valor que eu queria armazenado corretamente.

De qualquer forma obrigado pela ajuda, vou continuar tentando batendo cabeça rs.

#6