detta är den första artikeln i en serie som jag gör som fokuserar på att lära mig vad this verkligen är i JS. För att korrekt bestämma vad this binder till, bör vi först förstå några grundläggande begrepp som vi behöver när vi bestämmer this bindning i JS och att veta vad som är call-site för en funktion är ett av de avgörande begreppen.

innan vi dyker in i vad Call-site för en funktion är, låt oss först försöka förstå varför vi behöver veta call-site i första hand. Skälen är följande:

1. Det är förmodligen något mycket lätt att ’plats’ i en bit kod. Men ibland kan vissa kodningsmönster dölja den verkliga samtalssidan. För att ta bort all tvetydighet i samband med detta ämne måste du förstå call-site (mycket tydligt).
2. Det är det enda som betyder något om du vill förstå hur this bindning fungerar.

med det sagt, låt oss nu förstå samtalsplatsen för en funktion.

i allmänhet är anropsplatsen för en funktion ’den plats från vilken den specifika funktionen anropas i en viss kodbit’. Således, gå till den platsen och du vet var samtalsplatsen för den funktionen är!

Låt oss nu, genom följande kodavsnitt, upptäcka var funktionerna är:

det var enkelt! Men det finns ett litet problem med det här sättet att hitta call-site: ibland kan det vara svårt att upptäcka det manuellt (till exempel: föreställ dig 1000-tals kodrader och du måste hitta call-site manuellt!).

det är här call-stacken spelar in. Vad är en call-stack? Det är en stapel (som namnet antyder). Av vad? Av funktioner. Vilka funktioner? Av alla funktioner som åberopades. För vad? För att få dig dit du är just nu i ditt utförande (dvs. det aktuella ögonblicket för utförandet).

om du tittar på din call-stack, är den verkliga call-site inom funktionen anrop före den funktion som för närvarande körs.

Låt oss nu använda call-stack för att hitta samtalsplatserna för funktioner i samma kod som används ovan:

Snabbtips: I stället för att manuellt räkna ut i vilken ordning funktioner åberopas (det är felbenägen och tröttsamt), bör du använda debugger verktyg i din webbläsare för att se call-stack. Felsökaren stannar vid den linje du ställer in din brytpunkt och visar dig samtalsstacken, dvs den visar dig alla funktioner som åberopades för att få dig på den platsen i kod. Därför är den verkliga call-site den andra funktionen uppifrån i denna call-stack (dvs. inom funktionen anrop före den funktion som för närvarande körs).

Således kan du hitta samtalsplatsen för en funktion på 2 sätt:

1. genom att manuellt upptäcka platsen där funktionen anropades i en viss kod, eller
2. genom att titta på samtalsstacken (helst med hjälp av felsökningsverktyg).

När du är osäker (och i allmänhet också), Använd alltid call-stacken för att korrekt identifiera call-site för en funktion.

det är det! Det här är allt du behöver veta för att hitta samtalsplatsen för en funktion!

nästa steg:

nästa artikel i denna serie, JavaScript: lär dig ’detta’ – så vad är en konstruktör ändå?, fokuserar på att förstå konstruktörer i JS.

Tack för att du läste. 🙂