funções de JavaScript pode ser invocado de 4 maneiras diferentes.
Cada método difere na forma como this é inicializado.
A this palavra-chave
Em JavaScript, a coisa chamada this , é o objeto que "possui" o código atual.
O valor de this , quando utilizado em uma função, é o objecto que "possui" a função.
Note-se que this não é uma variável. É uma palavra-chave. Você não pode alterar o valor do this .
Chamando uma função JavaScript
Você já aprendeu que o código dentro de uma função JavaScript será executado quando "algo" o invoca.
O código em uma função não é executada quando a função é definida. Ele é executado quando a função é chamada.
Algumas pessoas usam o termo "chamar uma função" em vez de "invocar uma função".
Também é bastante comum dizer "invocar uma função", "iniciar uma função", ou "executar uma função".
Neste tutorial, vamos usar invocação, porque uma função JavaScript pode ser invocado sem ser chamado.
Invocando uma função como uma função
Exemplo
function myFunction(a, b) {
return a * b;
}
myFunction(10, 2); // myFunction(10, 2) will return 20
Tente você mesmo " A função acima não pertence a qualquer objeto. Mas, em JavaScript, há sempre um objeto global padrão.
Em HTML o objeto global padrão é a página HTML em si, de modo que a função acima "pertence" à página HTML.
Em um navegador do objeto principal é a janela do navegador. A função acima torna-se automaticamente uma função de janela.
myFunction() e window.myFunction() é a mesma função:
Exemplo
function myFunction(a, b) {
return a * b;
}
window.myFunction(10, 2); // window.myFunction(10, 2) will also return 20
Tente você mesmo " Esta é uma forma comum de chamar uma função JavaScript, mas não é uma prática muito boa.
As variáveis globais, métodos ou funções podem facilmente criar conflitos e erros de nome no objeto global.
O objeto global
Quando uma função é chamado sem um objeto proprietário, o valor de this se torna o objeto global.
Em um navegador web o objeto global é a janela do navegador.
Este exemplo retorna o objeto de janela como o valor do this :
Exemplo
function myFunction() {
return this;
}
myFunction(); // Will return the window object
Tente você mesmo " Chamando uma função como uma função global, faz com que o valor de this ser o objeto global.
Usando o objeto de janela como uma variável pode facilmente travar o seu programa.
Invocar uma função como um método
Em JavaScript você pode definir a função como métodos de objeto.
O exemplo a seguir cria um objeto ( myObject ), com duas propriedades ( firstName e lastName ), e um método ( fullName ):
Exemplo
var myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
myObject.fullName(); // Will return "John Doe"
Tente você mesmo " O fullName método é uma função. A função pertence ao objecto. myObject é o dono da função.
A coisa chamada this , é o objeto que "possui" o código JavaScript. Neste caso, o valor de this é myObject .
Teste-o! Alterar o fullName método para retornar o valor do this :
Exemplo
var myObject = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this;
}
}
myObject.fullName(); // Will return [object Object] (the owner object)
Tente você mesmo " Invocando uma função como um método de objeto, faz com que o valor de this ser o próprio objeto.
Chamando uma função com um construtor Function
Se uma chamada de função é precedida com a new palavra-chave, é uma invocação construtor.
Parece que você criar uma nova função, mas desde que as funções JavaScript são objetos que você realmente criar um novo objeto:
Exemplo
// This is a function constructor:
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
// This creates a new object
var x = new myFunction("John","Doe");
x.firstName;
// Will return "John"
Tente você mesmo " A invocação construtor cria um novo objeto. O novo objeto herda as propriedades e métodos de seu construtor.
A this palavra-chave no construtor não tem um valor.
O valor do this será o novo objeto criado quando a função é chamada.
Chamando uma função com um método de Função
Em JavaScript, funções são objetos. funções de JavaScript têm propriedades e métodos.
call() e apply() são métodos função JavaScript predefinidos. Ambos os métodos pode ser utilizado para invocar uma função, e ambos os métodos devem ter o objecto do proprietário como primeiro parâmetro.
Exemplo
function myFunction(a, b) {
return a * b;
}
myObject = myFunction.call(myObject, 10, 2); // Will return 20
Tente você mesmo " Exemplo
function myFunction(a, b) {
return a * b;
}
myArray = [10, 2];
myObject =
myFunction.apply(myObject, myArray); // Will also return 20
Tente você mesmo " Ambos os métodos de pegar um objeto proprietário como o primeiro argumento. A única diferença é que call() leva os argumentos da função separadamente e apply() leva os argumentos da função em uma matriz.
No modo estrito JavaScript, o primeiro argumento torna-se o valor de this na função chamado, mesmo se o argumento não é um objeto.
No modo de "não rigorosa", se o valor do primeiro argumento é nulo ou indefinida, é substituído com o objecto global.
Com call() ou apply() você pode definir o valor do this , e invocar uma função como um novo método de um objeto existente.