JavaScript-menetelmät

Sisällysluettelo

    Näytä sisällysluettelo

Esimerkki

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

Kokeile itse →

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

Mikä tämä on?

JavaScriptissä tämä-avainsana viittaa objektiin.

Mikä objekti riippuu siitä, miten tätä kutsutaan (käytetään tai kutsutaan).

Avainsana tämä viittaa erilaisiin objekteihin sen käyttötavan mukaan:

  • Objektimenetelmässä tämä viittaa objektiin.

  • Yksin tämä viittaa globaaliin objektiin.

  • Funktiossa tämä viittaa globaaliin objektiin.

  • Funktion tiukassa tilassa tämä on määrittämätön.

  • Tapahtumassa tämä viittaa elementtiin, joka vastaanotti tapahtuman.

  • Menetelmät, kuten call(), apply() ja bind() voi viitata tähän mihin tahansa objektiin.

Huomautus

tämä ei ole muuttuja. Se on avainsana. Et voi muuttaa tämän arvoa

Katso myös:

JavaScript tämä opetusohjelma

JavaScript-menetelmät

JavaScript-menetelmät ovat toimintoja, jotka voidaan suorittaa objekteille.

JavaScriptin menetelmä on ominaisuus, joka sisältää funktion määritelmä.

firstName

John

lastName

Doe

age

50

eyeColor

sininen

fullName

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

Metodit ovat objektin ominaisuuksiksi tallennettuja toimintoja.

Objektimenetelmien käyttäminen

Voit käyttää objektimetodia seuraavalla syntaksilla:

objectName.methodName()

Tyypillisesti kuvailet fullName()-metodia henkilö-objektille ja fullName omaisuutena.

FullName-ominaisuus suoritetaan (funktiona), kun sitä kutsutaan komennolla().

Tämä esimerkki käyttää henkilöobjektin fullName() menetelmää:

Esimerkki

name = person.fullName();

Kokeile itse →

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

Jos käytät fullName omaisuutta ilman(), se palauttaa funktion määritelmän:

Esimerkki

name = person.fullName;

Kokeile itse →

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

Menetelmän lisääminen objektiin

Uuden menetelmän lisääminen objektiin on helppoa:

Esimerkki

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

Kokeile itse →

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

Sisäänrakennettujen menetelmien käyttö

Tässä esimerkissä käytetään String-objektin toUpperCase()-menetelmää tekstin muuntamiseen isoilla kirjaimilla:

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

X:n arvo yllä olevan koodin suorittamisen jälkeen on:

HELLO WORLD!

Esimerkki

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

Kokeile itse →

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