const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
fullName: function() {
return this.firstName + " " +
this.lastName;
}
};
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h1>The JavaScript <i>this</i> Keyword</h1>
<p>In this example, <b>this</b> refers to the <b>person</b> object.</p>
<p>Because <b>fullName</b> is a method of the person object.</p>
<p id="demo"></p>
<script>
// Create an object:
const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
// Display data from the object:
document.getElementById("demo").innerHTML = person.fullName();
</script>
</body>
</html>
I JavaScript hänvisar nyckelordet detta
till ett objekt.
Vilket objekt beror på hur detta
anropas (används eller anropas).
Nyckelordet detta
hänvisar till olika objekt beroende på hur det används:
I en objektmetod hänvisar detta
till objektet.
Enbart hänvisar detta
till det globala objektet.
I en funktion hänvisar detta
till det globala objektet.
I en funktion, i strikt läge, är detta
odefinierat
.
I en händelse hänvisar detta
till elementet som tog emot händelsen.
Metoder som call()
, apply()
och bind()
kan hänvisa detta
till alla objekt.
detta
är inte en variabel. Det är ett nyckelord. Du kan inte ändra värdet på denna
JavaScript-handledningen för denna
JavaScript-metoder är åtgärder som kan utföras på objekt.
En JavaScript metod är en egenskap som innehåller en funktion definition.
John
Hind
50
blå
function() {return this.firstName + " " + this.lastName;}
Metoder är funktioner som lagras som objektegenskaper.
Du kommer åt en objektmetod med följande syntax:
objectName.methodName()
Du kommer vanligtvis att beskriva fullName() som en metod för personobjektet, och fullName som egenskap.
Egenskapen fullName kommer att köras (som en funktion) när den anropas med().
Det här exemplet får åtkomst till fullName() metoden för ett personobjekt:
name = person.fullName();
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p>Creating and using an object method.</p>
<p>A method is actually a function definition stored as a property value.</p>
<p id="demo"></p>
<script>
const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
fullName: function() {
return this.firstName + " " + this.lastName;
}
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
</body>
</html>
Om du kommer åt fullName egenskapen, utan(), den returnerar funktionsdefinitionen:
name = person.fullName;
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p>An object method is a function definition stored as a property value.</p>
<p>If you access it without (), it will return the function definition:</p>
<p id="demo"></p>
<script>
const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
fullName: function() {
return this.firstName + " " + this.lastName;
}
};
document.getElementById("demo").innerHTML = person.fullName;
</script>
</body>
</html>
Det är enkelt att lägga till en ny metod till ett objekt:
person.name = function () {
return this.firstName + " " + this.lastName;
};
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p id="demo"></p>
<script>
const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
};
person.name = function() {
return this.firstName + " " + this.lastName;
};
document.getElementById("demo").innerHTML =
"My father is " + person.name();
</script>
</body>
</html>
Det här exemplet använder metoden toUpperCase()
för String-objektet för att konvertera en text till versaler:
let message = "Hello world!";
let x = message.toUpperCase();
Värdet på x, efter exekvering av koden ovan kommer att vara:
HELLO WORLD!
person.name = function () {
return (this.firstName + " " + this.lastName).toUpperCase();
};
Prova själv →
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Objects</h2>
<p id="demo"></p>
<script>
const person = {
firstName: "John",
lastName: "Doe",
id: 5566,
};
person.name = function() {
return (this.firstName + " " + this.lastName).toUpperCase();
};
document.getElementById("demo").innerHTML =
"My father is " + person.name();
</script>
</body>
</html>