JavaScript-Methoden


Inhaltsverzeichnis

    Inhaltsverzeichnis anzeigen


Beispiel

const person = {
    firstName: "John",
  lastName: "Doe",
  id: 5566,
  fullName: function() {
    return this.firstName + " " + 
this.lastName;
  }
};

Probieren Sie es selbst aus →

<!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>

Was ist das?

In JavaScript bezieht sich das Schlüsselwort this auf ein Objekt.

Welches Objekt hängt davon ab, wie dies aufgerufen (verwendet oder aufgerufen) wird?

Das Schlüsselwort this bezieht sich je nach Verwendung auf unterschiedliche Objekte:

  • In einer Objektmethode bezieht sich this auf das Objekt.

  • Allein dies bezieht sich auf das globale Objekt.

  • In einer Funktion bezieht sich this auf das globale Objekt.

  • In einer Funktion ist im strikten Modus dies undefiniert.

  • In einem Ereignis bezieht sich this auf das Element, das das Ereignis empfangen hat.

  • Methoden wie call(), apply() und bind() kann dies auf jedes Objekt verweisen.

Notiz

dies ist keine Variable. Es ist ein Schlüsselwort. Sie können den Wert von this nicht ändern

Siehe auch:

Das JavaScript dieses Tutorial


JavaScript-Methoden

JavaScript-Methoden sind Aktionen, die auf Objekten ausgeführt werden können.

Eine JavaScript-Methode ist eine Eigenschaft, die eine Funktion enthält Definition.

firstName

John

lastName

Damhirschkuh

age

50

eyeColor

Blau

fullName

function() {return this.firstName + " " + this.lastName;}

Methoden sind Funktionen, die als Objekteigenschaften gespeichert sind.


Auf Objektmethoden zugreifen

Sie greifen auf eine Objektmethode mit der folgenden Syntax zu:

objectName.methodName()

Normalerweise beschreiben Sie fullName() als Methode des Personenobjekts und fullName als Eigenschaft.

Die fullName-Eigenschaft wird (als Funktion) ausgeführt, wenn sie mit() aufgerufen wird.

In diesem Beispiel wird auf die Methode fullName() eines Personenobjekts zugegriffen:

Beispiel

name = person.fullName();

Probieren Sie es selbst aus →

<!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>

Wenn Sie ohne() auf die Eigenschaft fullName zugreifen, wird sie gibt die Funktionsdefinition zurück:

Beispiel

name = person.fullName;

Probieren Sie es selbst aus →

<!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>


Eine Methode zu einem Objekt hinzufügen

Das Hinzufügen einer neuen Methode zu einem Objekt ist einfach:

Beispiel

 person.name = function () {
  return this.firstName + " " + this.lastName;
};

Probieren Sie es selbst aus →

<!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>

Verwenden integrierter Methoden

In diesem Beispiel wird die Methode toUpperCase() des String-Objekts verwendet, um einen Text zu konvertieren in Großbuchstaben:

let message = "Hello world!";
let x = message.toUpperCase();

Der Wert von x ist nach der Ausführung des obigen Codes:

HELLO WORLD!

Beispiel

person.name = function () {
  return (this.firstName + " " + this.lastName).toUpperCase();
};

Probieren Sie es selbst aus →

<!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>