thisin perusteet; call/apply/bind (johdanto)
Ymmärtäkää, mihin this viittaa funktioissa ja metodeissa. Tutustukaa nuolifunktioiden this-käyttäytymiseen sekä call-, apply- ja bind-metodeihin.
thisin perusteet; call/apply/bind (johdanto) on ilmainen JavaScript Academy-oppitunti CoddyKitissä. Tämä on oppitunti 3/3. Voit lukea tästä oppimispolusta kokonaan mitkä tahansa 3 oppituntia ilmaiseksi — sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä käytännön harjoittelun sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. Oppitunti kuuluu JavaScript Academy-oppimispolkuun, ja edistymisesi synkronoituu verkon ja CoddyKit-sovelluksen välillä. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Johdanto this-arvoon
Tavoite: Selvittäkää, mihin eri kutsuissa this viittaa, opetelkaa nuolifunktioiden this-toiminta ja kokeilkaa call/apply/bind-kutsuja pienin askelin.
- Metodikutsu ja tavallinen kutsu
- Nuolifunktioiden this
- call/apply/bind
this metodikutsussa
Metodikutsussa this viittaa pisteen edellä olevaan olioon.
// Method call: this is the object before the dot
const user = {
name: "Ayla",
say() {
console.log("I am", this.name);
}
};
user.say();
this tavallisessa kutsussa
Tavallisessa kutsussa this on strict-tilassa undefined. Selaimissa, joissa strict-tila ei ole käytössä, se voi olla window.
// Plain function call: this is undefined in strict mode
function show() {
console.log("this is", this);
}
show();
Nuolifunktioiden this (leksikaalinen)
Nuolifunktio käyttää ympäröivää this-arvoa (leksikaalisesti). Se sopii erinomaisesti metodien sisäisiin takaisinkutsuihin.
// Arrow functions do not have their own this
// They capture this from the surrounding scope
const team = {
title: "Blue",
start() {
const report = () => {
console.log("Team:", this.title);
};
report();
}
};
team.start();
call ja apply
call ja apply suorittavat funktion heti annetulla this-arvolla.
// call/apply invoke the function with a chosen this
function intro(lang1, lang2) {
console.log("User:", this.name, "knows", lang1, "and", lang2);
}
const person = { name: "Mina" };
// call passes arguments normally
intro.call(person, "JS", "TS");
// apply passes arguments as an array
intro.apply(person, ["JS", "TS"]);
bindin perusteet
bind palauttaa uuden funktion, joka muistaa valitun this-arvon tulevia kutsuja varten.
// bind creates a new function with this fixed
function sayHi() {
console.log("Hi from", this.name);
}
const dev = { name: "Lena" };
const sayHiFromLena = sayHi.bind(dev);
sayHiFromLena();
sayHiFromLena();
bind vai call/apply -tietovisa
Pikatarkistus: this-arvon korjaaminen.
Kertaus
Kertaus: Metodikutsut asettavat this-arvoksi olion, tavallisissa kutsuissa this on strict-tilassa undefined, nuolifunktiot ottavat käyttöön ympäröivän this-arvon, call/apply asettavat sen yhtä kutsua varten ja bind kiinnittää sen myöhempiä kutsuja varten.
Opi JavaScript tekoälytuutorin avulla — ilmaiseksi
Kirjoita ja suorita oikeaa koodia selaimessa, saa välitöntä apua tekoälytuutorilta ympäri vuorokauden ja jatka siitä, mihin jäit, verkossa tai sovelluksessa.
- Kurssit
- 59
- Oppitunnit
- 200
Usein kysytyt kysymykset
Onko oppitunti ”thisin perusteet; call/apply/bind (johdanto)” ilmainen?
Kyllä — voit lukea täällä verkossa kokonaan ilmaiseksi mitkä tahansa JavaScript Academy-oppimispolun 3 oppituntia, myös oppitunnin “thisin perusteet; call/apply/bind (johdanto)”. Sen jälkeen CoddyKit PRO avaa kaikki oppitunnit sekä interaktiiviset harjoitukset sisäänrakennetulla koodieditorilla ja ympäri vuorokauden toimivalla tekoälytuutorilla. JavaScript Academy-kurssilla on yhteensä 3 oppituntia.
Mitä opin oppitunnilla ”thisin perusteet; call/apply/bind (johdanto)”?
Ymmärtäkää, mihin this viittaa funktioissa ja metodeissa. Tutustukaa nuolifunktioiden this-käyttäytymiseen sekä call-, apply- ja bind-metodeihin. Harjoittelet JavaScript Academy-aihetta koodilla, jonka suoritat suoraan selaimessa. Ympäri vuorokauden käytettävissä oleva tekoälytuutori vastaa kysymyksiisi oppitunnin aikana.
Tarvitsenko kokemusta aloittaakseni JavaScript Academy-opiskelun?
Aiempi kokemus ei ole tarpeen. CoddyKitin JavaScript Academy-oppimispolku sopii vasta-alkajista edistyneisiin, joten voit aloittaa tästä tai alusta ja edetä omaan tahtiisi. Tämä on oppitunti 3/3.
Kuinka kauan ”thisin perusteet; call/apply/bind (johdanto)”-oppitunnin suorittaminen kestää?
Useimmat CoddyKitin oppitunnit kestävät noin 5–10 minuuttia. Jokainen oppitunti on lyhyt ja interaktiivinen, joten edistyt tasaisesti ja voit jatkaa siitä, mihin jäit – sekä verkossa että sovelluksessa.
Voinko kirjoittaa ja suorittaa koodia tällä JavaScript Academy-oppitunnilla?
Kyllä. Jokainen JavaScript Academy-oppitunti sisältää sisäänrakennetun koodieditorin, joten voit kirjoittaa ja suorittaa oikeaa koodia suoraan selaimessa ja saada välitöntä palautetta tekoälyltä – paikallista asennusta ei tarvita.
Kaikki tämän kurssin oppitunnit
- Deklaraatiot ja lausekkeet sekä nuolifunktioiden perusteet
- Parametrit, oletukset, rest ja palautukset
- thisin perusteet; call/apply/bind (johdanto)