Scope - Txai-HvA/BlokTech GitHub Wiki

De scope is een belangrijk concept dat de beschikbaarheid van variabelen beheert (Pavlutin, 2020). Javascript heeft 2 type scopes: Local scope & global scope. JavaScript heeft een functie scope: Elke functie creeert een nieuwe scope. Variabelen gedefineerd in de functie zijn niet zichtbaar buiten de functie (W3schools, 2021).

Local Scope

Variabelen die binnen een JavaScript-functie zijn gedeclareerd, worden local voor de functie en ze zijn alleen zichtbaar binnen de functie. Doordat local variabelen alleen binnen hun functies worden herkend, kunnen variabelen met dezelfde naam in andere functies worden gebruikt (W3schools, 2021).

function myFunction() {
  var dogName = "Rex";
}

if (true) {
  const message = 'Hello';
}
console.log(message); // ReferenceError: message is not defined

Wanneer je de message variabel probeert te loggen, geeft JavaScript een ReferenceError: message is not defined. Dit komt doordat de if code block een scope creeert voor de message variabel en deze is alleen toegankelijk binnen de scope (Pavlutin, 2020).

Local Scope in mijn app

Local Variabel

Global Scope

Een global variabele is een variabele die buiten een functie wordt gedeclareerd en heeft een globaal bereik: alle scripts en functies op de webpagina hebben er toegang toe (W3schools, 2021).

var dogName = "Rex";
function myFunction() {
 
}

Global Scope in mijn app

Global Variabel

Global Variabel in functie

Nesting

Scopes kunnen genest worden. De functie run () maakt een scope aan en binnen de if condition codeblok creëert het een andere scope.

function run() {
  // "run" function scope
  const message = 'Run, Forrest, Run!';
  if (true) {
    // "if" code block scope
    const friend = 'Bubba';
    console.log(message); // 'Run, Forrest, Run!'
  }
  console.log(friend); // throws ReferenceError
}

run();

De scope in een andere scope is de inner scope. In het voorbeeld hierboven is de if code block scope is een inner scope van de run() functie scope. De scope dat om de andere scope heen zit is de outer scope. In het voorbeeld hierboven is de run() function scope is een outer scope van if code block scope (Pavlutin, 2020).

Nesting in mijn app

Nesting in mijn app

Bronnen