JavaScript: leer ’this’ -finding CALL-SITE van een functie

Dit is het eerste artikel van een serie die ik aan het doen ben dat zich richt op het leren wat this echt in JS zit. Om correct te bepalen waaraan this bindt, moeten we eerst een paar basisconcepten begrijpen die we nodig hebben bij het bepalen van this binding in JS en weten wat de aanroeplocatie van een functie is, is een van die cruciale Concepten.

voordat we ingaan op wat de call-site van een functie is, proberen we eerst te begrijpen waarom we de call-site in de eerste plaats moeten kennen. De redenen zijn als volgt:

  1. het is waarschijnlijk iets heel gemakkelijk om ‘site’ in een stuk code. Echter, soms, bepaalde codering patronen kunnen verbergen de echte call-site. Dus, om alle ambiguïteit met betrekking tot dit onderwerp te verwijderen, moet u call-site begrijpen (zeer duidelijk).
  2. het is het enige dat telt als je wilt begrijpen hoe this binding werkt.

Dit gezegd zijnde, laten we nu de aanroep-site van een functie begrijpen.

in het algemeen is de aanroep-site van een functie ‘de plaats waar de specifieke functie in een gegeven stukje code wordt aangeroepen’. Ga dus naar die locatie en je weet waar de call-site van die functie is!

laten we nu, via het volgende codefragment, uitzoeken waar de aanroepsites van functies zijn:

dat was makkelijk! Maar er is een klein probleem met deze manier van het vinden van de call-site: soms kan het moeilijk zijn om het handmatig te herkennen (bijvoorbeeld: stel je 1000s van regels code en je moet de call-site handmatig vinden!).

Dit is waar de call-stack in het spel komt. Wat is een call-stack? Het is een stapel (zoals de naam al doet vermoeden). Waarvan? Van functies. Welke functies? Van alle functies die werden aangeroepen. Waarvoor? Om je te krijgen waar je nu bent in je executie (dat wil zeggen het huidige moment van uitvoering).

Als u naar uw call-stack kijkt, dan bevindt de echte call-site zich binnen de functie aanroep voorafgaand aan de functie die momenteel wordt uitgevoerd.

laten we nu de call-stack gebruiken om de call-sites van functies in dezelfde code te vinden die hierboven is gebruikt:

div>

snelle tip: In plaats van het handmatig uitzoeken van de volgorde waarin functies werden aangeroepen (het is foutgevoelig en vermoeiend), moet u debugger tool gebruiken in uw browser om call-stack te zien. De debugger stopt op de regel die u uw breekpunt hebt ingesteld en zal u de call stack laten zien, dat wil zeggen het zal u alle functies laten zien die werden aangeroepen om u op die locatie in code te krijgen. Vandaar dat de echte call-site de tweede functie van bovenaf is in deze call-stack (dat wil zeggen binnen de functie aanroep voorafgaand aan de functie die momenteel wordt uitgevoerd).

zo kunt u de aanroep-site van een functie op 2 manieren vinden:

  1. door handmatig de locatie te spotten waar de functie werd aangeroepen in een bepaald stuk code, of
  2. door naar de call-stack te kijken (bij voorkeur met behulp van debugger-gereedschappen).

bij twijfel (en in het algemeen ook), gebruik altijd de call-stack om de call-site van een functie correct te identificeren.

dat is het! Dit is alles wat je moet weten om de call-site van een functie te vinden!

volgende stappen:

het volgende artikel van deze serie, JavaScript: leer ‘dit’ – dus wat is een CONSTRUCTOR eigenlijk?, richt zich op het begrijpen van constructeurs in JS.

Bedankt voor het lezen. 🙂

Geef een antwoord

Het e-mailadres wordt niet gepubliceerd.