Context de executie, mediu lexical si inchideri in JavaScript

Concepte avansate JavaScript pe care ar trebui sa le cunoasteti

Fotografie de Javier Sierra pe Unsplash

In aceasta piesa vreau sa vorbesc despre trei concepte JavaScript avansate: contextul de executie, mediul lexical si inchiderea.

Acesta va fi un post lung. Daca doriti sa treceti la rezumat, derulati pana in partea de jos a paginii.

Deci, ce este un context de executie? Ori de cate ori scrieti un cod, codul dvs. se afla intr-un spatiu – acel spatiu se numeste „contextul de executie”. Imaginati-va ca ati scris un calculator simplu:

function cal (type, a, b) {



if (type === ‘add’) {



return a + b;



} else if (tip === ‘scadere’) {



return a – b;



} else if (tip === ‘multiply’) {



return a * b;



} else {



return a / b;



}



}

var patru = 4;



var sapte = 7;



cal („adaugati”, 4, 7);

In JavaScript, ori de cate ori este invocata o functie, se creeaza un nou context de executie pe contextul de executie care ruleaza in prezent. dame de companie favorit Un nou creat este stocat in stiva pentru contexte de executie.

Deci, daca numim cal (), noul context va fi creat si va fi impins in stiva contextuala. Dar, in mod implicit, exista un context deja existent in stiva – un context global de executie.

Conceptul de baza al unui context de executie

Mai intai functia cal este apelata si rulata astfel incat noul context de executie este creat. Apoi este stocat in stiva contextuala. Apoi controlul contextului de executie curent este transferat catre cel nou creat din, in acest caz, contextul global. curve bucuresti dristor

Un context de executie este creat ori de cate ori apelati o functie. Cand va dezvoltati in JavaScript, este posibil sa fi vazut aceasta eroare:

Eroare stiva de apeluri

Functia a continua sa se numeasca recursiv. De fiecare data cand se apeleaza, un nou context de executie despre un va fi creat si stocat in stiva. Deoarece spatiul de stocare al stivei de memorie nu este infinit, acesta se revarsa.

Acum stiti ce este contextul de executie, dar mai sunt multe de invatat. Vom vorbi despre asta in scurt timp. servicii escorte

Ce se intampla atunci cand executati o functie sau cand declarati o variabila sau o functie? Abia am explicat ca un context de executie este creat pe fiecare apel de functie si ca exista un context global de executie in stiva in mod implicit. Un context de executie este impartit in trei zone diferite.

In cadrul unui context de executie

Primele doua sectiuni intr-un context de executie – LexicalEnvironment si VariableEnvironment, sunt foarte asemanatoare, asa ca cred ca le pot numi doar LexicalEnvironment. Ceea ce face LexicalEnvironment este de a urmari variabilele, numele functiilor si valorile asociate. Cu alte cuvinte, daca declarati o functie ca o figura de mai sus, atunci LexicalEnvironment ar arata astfel:

function foo () {



var a = 10;



bara de functii () {

}



}



foo ();

// Cand se apeleaza foo, un nou mediu de executie



// ar putea arata asa mai jos, in



executia_mediu: {



LexicalEnvironment: {



a: 10,



bar: function () {}



},



ThisBinding: .. escorte bu .



}

Acum stiti ce este LexicalEnvironment si ce face.

Asa cum un context de executie este format din trei parti, LexicalEnvironment consta si din cateva parti. Are o inregistrare de mediu – o voi numi o inregistrare de mediu si un mediu lexical exterior pe care s-ar putea sa-l credeti ca este domeniul de aplicare.

Cand declarati o variabila sau o functie, acestea sunt de fapt stocate in inregistrarea mediului sau. Inlantuirea valorii proprietatii inseamna practic inlantuirea valorii unei proprietati care apartine unei inregistrari de mediu. escorte husi

O referinta la mediul lexical exterior este creata si atunci cand este creat LexicalEnvironment. Se conecteaza direct la LexicalEnvironment parinte, iar JavaScript foloseste aceasta valoare atunci cand nu poate gasi o proprietate in LexicalEnvironment curent. Daca tot nu o poate gasi in LexicalEnvironment parinte, atunci, din nou, merge la LexicalEnvironment parinte. Acest proces nu se opreste pana cand nu gaseste ceea ce cauta sau pana cand nimic nu este conectat la LexicalEnvironment . LexicalEnvironment global nu are un LexicalEnvironment al unui parinte. Deci, cand JavaScript incearca sa caute ceva in LexicalEnvironment global, apare o eroare de referinta . porno cu dame de companie

Exemplu cu cifre

Pentru a intelege mai bine acest flux, sa aruncam o privire la acest exemplu:

var x = 1;



function foo () {



var y = 2;



bara de functii () {



var z = 3;



function baz () {



console.log (z);



console.log (y);



console.log (x);



console.log (w);



}



baz ();



}



bar ();



}



foo ();



// 3



// 2



// 1



// Eroare de referinta: w nu este definit

Mediul Lexical global

Cand JavaScript ruleaza codul, variabila x si functia foo sunt declarate in LexicalEnvironment global. Dupa cum am explicat, exteriorul global nu indica nimic. escorte lesbiene Cand JavaScript intalneste foo (), ruleaza functia si se creeaza noul LexicalEnvironment al foo . Link-ul sau extern se leaga de mediul globalLexicalEnvironment al parintilor. Aceasta figura ilustreaza intreaga relatie in exemplul de cod:

Intreaga relatie intre LexicalEnvironments

Puteti vedea exteriorul in fiecare punct LexicalEnvironment catre LexicalEnvironment al parintelui.

Cand se numeste baz (), se cauta z, y, x si w.

Fluxul de lucru cand se cauta z si w

La fel ca acest flux, gasirea variabilei y si x face acelasi lucru – verificarea daca exista sau nu valoarea in LexicalEnvironment curent si trecerea la cea a parintelui daca nu exista nicio variabila. Dar pentru w, nu exista nicaieri in coduri, asa ca ajungem cu o eroare de referinta. curve focsani

Aceasta este ceea ce ati auzit in mod normal, un lant de scopuri. Dar amintiti-va, mediul exterior, conectarea la mediul parintelui, este determinata atunci cand functia este declarata, nu cand este invocata (Faceti clic aici pentru a obtine informatii suplimentare). De exemplu, ghiciti valoarea returnata a barei ().

var x = 1;



function foo () {



var x = 2;



bar();



}

bara de functii () {



console.log (x);



}

foo (); // 1

De ce este rezultatul foo () 1 si nu 2? Asa cum am spus, referinta exterioara este LexicalEnvironment al parintelui, nu functia care il inconjoara.

ThisBinding

Referinta din contextul de executie, ThisBinding, determina cum este numita functia. porno cu curve romance Voi vorbi despre acest subiect mai mult intr-o alta piesa.

Acum, stiti ce se afla intr-un context de executie – LexicalEnvironment si ThisBinding. Exista de fapt doua tipuri de context de executie – contextul de executie globala si contextul de executie a functiei .

Contextul de executie globala este contextul de executie pentru obiectul global din JavaScript, care este radacina tuturor. Ce contine sunt mai multe obiecte. Una dintre ele este fereastra – cand JavaScript analizeaza si interpreteaza scriptul, acesta ruleaza mai intai. bucuresti matrimoniale (Desigur, nu acesta este exact modul in care functioneaza JavaScript).

<script>



window = {



ClipboardCopyElement: class ClipboardCopyElement,



CodeMirror: f Ea,



DetailDialogElement: class DetailDialogElement,



.



  • tiganci curve
  • dame de companie zalau
  • matrimoniale urziceni
  • curve tracer circuit
  • escorte turnu severin
  • matrimoniale 3xforum
  • curve in bihor
  • escorte orade
  • escorte dambovita
  • matrimoniale galati femei cauta barbati
  • curve tg frumos
  • dame de companie din pitesti
  • matrimoniale busteni
  • escorte care accepta cupluri
  • paturi matrimoniale din lemn
  • dame de companie vitan
  • matrimoniale 24 publitim
  • escorte milf bucuresti
  • matrimoniale chat
  • matrimoniale publi 24 suceava





..



};

GlobalExecutionContext: {



LexicalEnvironment: {



window: window , outside:



null



},



ThisBinding: window



}



</script>

De aceea ati putea folosi window.document sau window. curve din arad setTimeout, deoarece toate se afla in LexicalEnvironment al obiectului global.

Dar un context de executie a functiei? Este la fel ca un context global de executie, dar nu exista fereastra sau alte obiecte globale in interior si este creat atunci cand este apelata o functie. Ceea ce au in comun contextul global de executie si contextele de executie a functiei este ca ambele au doua faze in timpul rularii: faze de creare si executie. In faza de creatie, variabilele si functiile sunt declarate:

var x = 1;



function foo () {



var x = 2;



bara de functii () {



var x = 3;



}



}



console.log (y);



var y = 3;

foo ();

Primul pas pentru rularea codului este ca se creeaza contextul global de executie. Controlul actiunii se afla in faza de creatie. publi24 matrimoniale ilfov

Faza de creatie – sursa de imagine este de aici

In faza de creare, variabilele sunt setate in mod implicit nedefinit. functiile, pe de alta parte, sunt atribuite de o functie – cum ar fi foo in exemplul de mai sus. De notat este ca y este, de asemenea, definit ca nedefinit, chiar daca este declarat dupa console.log. Acest simptom se numeste „ridicare” in JavaScript. Ridicarea inseamna ca variabilele si functiile sunt declarate si atribuite cu valoarea implicita, in mod normal nedefinita, inainte de faza de executie. evenimentul de iasi matrimoniale

Cand controlul trece la faza de executie, ruleaza fiecare bucata de cod din partea de sus. Prima declaratie care va fi executata este console.log (y) si tipareste nedefinit. Apoi y este setat la trei. Urmatorul pas este sa rulati foo (). Cand se apeleaza o functie, se creeaza un nou context de executie si este impins in stiva de apeluri. cel mai bun site de matrimoniale

Faza de creare a unei functii – sursa de imagine este de aici

Cand se apeleaza o functie, se creeaza un context de executie a functiei. Apoi, faza sa de creare incepe mai intai. LexicalEnvironment al contextului de executie a functiei defineste toate variabilele de care are nevoie. Obiectul special, argumentele, este o parte a variabilelor care sunt definite in fiecare functie LexicalEnvironment. Puteti vedea ca exista o bara de functii (). Apoi bara este invocata – contextul sau de executie va fi, de asemenea, stocat in stiva dupa ce a fost creat. curve buzau pret

Odata ce toate codurile dintr-o functie sunt executate, contextul sau de executie este eliminat din stiva.

Videoclipul este realizat de Tyler McGinnis

In acest videoclip, difuzorul face o treaba buna explicand fluxul de lucru al comutarii contextului de executie in JavaScript.

Am explicat ca LexicalEnvironment are si un mediu exterior care se refera la LexicalEnvironment al parintelui. Aruncati o privire la acest exemplu:

var x = 1;



function foo (y) {



return function (z) {



return x + y + z;



}



}

var f = foo (2);

Daca rulati aceasta comanda pe consola web, veti vedea acest lucru:

console.dir (f);

Inchiderea arata astfel

In stanga este ceea ce puteti vedea din consola Google si in dreapta este ceea ce puteti vedea din JavaScript Visualizer – pagina web pe care o puteti vedea aici.

Deci ce s-a intamplat? Cand functia foo a fost executata, a returnat o noua functie. curve tineretului f are acum valoarea de returnare a foo. Dar in f, exista un nou obiect de scop, numit Inchidere. Chiar daca contextul de executie al foo a fost eliminat din stiva, lanturile de referinta sunt inca vii prin variabila f. Atunci daca executam f, care este o functie?

f (5);

Un context de executie in sursa de inchidere – imagine este de aici

Apoi, noul context de executie va fi creat ca imaginea de mai sus. Motivul pentru care z nu se afla in domeniul de inchidere este ca este o proprietate a functiei pe care a rulat-o, care este activa in contextul de executie curent.

Odata returneaza x + y + z; este rulat si functia este terminata, contextul de executie pentru f va fi eliminat si inchiderea va disparea. blackberry curve 9380

MDN defineste inchiderea:

O inchidere este combinatia unei functii grupate (inchise) cu referinte la starea sa inconjuratoare ( mediul lexical ). Cu alte cuvinte, o inchidere va ofera acces la scopul unei functii externe dintr-o functie interioara.

Inchiderea este o functie care va permite sa accesati domeniul functiei parinte, chiar daca a fost eliminat din stiva contextuala de executie.

Aceasta a fost o poveste lunga pentru a explica ce context de executie, LexicalEnvironment, inchidere etc. Practic, atunci cand JavaScript ruleaza coduri, creeaza un spatiu pentru stocarea si gestionarea variabilelor si functiilor. Acesta tine evidenta numelor si a modificarilor. curve caciulata Ori de cate ori este creata o functie, JavaScript creeaza acest spatiu si il pune in partea de sus a stivei, unde spatiile existente anterior sunt stivuite de jos. Acest spatiu se numeste contextul de executie.

Exista doua contexte de executie in JavaScript – contextul de executie globala si contextul de executie a functiei. Un context de executie este format din LexicalEnvironment si ThisBinding. LexicalEnvironment este locul in care variabilele si functiile sunt de fapt stocate si gestionate. ThisBinding este referinta pentru acest lucru, dar nu am acoperit asta aici. matrimoniale femei batrane

JavaScript are doua faze atunci cand vine vorba de gestionarea variabilelor si functiilor – faza de creare si faza de executie. In timpul fazei de creare, variabilele sunt declarate, dar setate de valoarea implicita, in mod normal nedefinita, in timp ce functiile sunt declarate si initializate simultan. Dupa faza de creare, controlul actiunii trece la faza de executie, unde toate codurile sunt executate, unul cate unul, din partea de sus a fisierului. Daca o functie este invocata in timpul acestei faze, un nou context de executie pentru acea functie va fi creat si stocat in stiva. Daca exista prea multe contexte in stiva, am confirmat, de asemenea, ca apar erori de referinta.

Chiar daca un context de executie este sters din stiva odata ce a rulat toate codurile din interior, o referinta la functie este activa atunci cand functia originala returneaza o noua functie care foloseste o variabila din sfera sa de aplicare. dame de companie simpatie Apoi, legatura cu functia externa nu va fi stearsa pana cand codurile sale nu sunt executate si complet eliminate din stiva. Aceasta se numeste inchidere. Inchiderea este o functie care va permite sa accesati sfera functiei parintelui, chiar daca faza de executie a acestuia este terminata.

  • ECMAScript in detaliu – mediu lexical
  • Mediu Inregistreaza in stackoverflow
  • Mediul lexical – Specificatii ECMAScript
  • Vizualizator JavaScript
  • Ghidul final al contextelor de executie – YouTube
  • Inchidere in MDN