O JavaScript esta palavra- chave
Exemplo
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
O que é isso ?
A palavra-chave JavaScript this
refere-se ao objeto ao qual ela pertence.
Tem valores diferentes dependendo de onde é usado:
- Em um método,
this
refere-se ao objeto proprietário . - Sozinho,
this
refere-se ao objeto global . - Em uma função,
this
refere-se ao objeto global . - Em uma função, no modo estrito,
this
éundefined
. - Em um evento,
this
refere-se ao elemento que recebeu o evento. - Métodos como
call()
, eapply()
podem se referirthis
a qualquer objeto .
isso em um método
Em um método de objeto, this
refere-se ao " dono " do método.
No exemplo no topo desta página, this
refere-se ao objeto pessoa .
O objeto person é o proprietário do método fullName .
fullName : function() {
return this.firstName + " " + this.lastName;
}
isso sozinho
Quando usado sozinho, o proprietário é o objeto Global, portanto, this
refere-se ao objeto Global.
Em uma janela do navegador, o objeto Global é [object Window]
:
Exemplo
let x = this;
No modo estrito , quando usado sozinho, this
também se refere ao objeto Global
[object Window]
:
Exemplo
"use strict";
let x = this;
isso em uma função (padrão)
Em uma função JavaScript, o proprietário da função é a associação padrãothis
para .
Assim, em uma função, this
refere-se ao objeto Global [object Window]
.
Exemplo
function myFunction() {
return this;
}
isso em uma função (estrita)
O modo estrito de JavaScript não permite vinculação padrão.
Então, quando usado em uma função, no modo estrito, this
é undefined
.
Exemplo
"use strict";
function myFunction() {
return this;
}
isso em manipuladores de eventos
Em manipuladores de eventos HTML, this
refere-se ao elemento HTML que recebeu o evento:
Exemplo
<button onclick="this.style.display='none'">
Click to
Remove Me!
</button>
Vinculação de método de objeto
Nestes exemplos, this
é o objeto pessoa (O objeto pessoa é o "dono" da função):
Exemplo
const person = {
firstName : "John",
lastName : "Doe",
id : 5566,
myFunction : function() {
return this;
}
};
Exemplo
const person = {
firstName: "John",
lastName : "Doe",
id : 5566,
fullName : function() {
return this.firstName + " " +
this.lastName;
}
};
Em outras palavras: this.firstName significa a propriedade firstName deste objeto (pessoa).
Ligação de função explícita
Os métodos call()
e apply()
são métodos JavaScript predefinidos.
Ambos podem ser usados para chamar um método de objeto com outro objeto como argumento.
Você pode ler mais sobre call()
e apply()
posteriormente neste tutorial.
No exemplo abaixo, ao chamar person1.fullName com person2 como argumento, this
fará referência a person2, mesmo que seja um método de person1:
Exemplo
const person1 = {
fullName: function() {
return this.firstName + " " + this.lastName;
}
}
const person2 = {
firstName:"John",
lastName: "Doe",
}
person1.fullName.call(person2); // Will return "John Doe"