Execution Context and Scope

Execution Context and Scope – JavaScript Codes के Execution Context व Scope को समझना सबसे जरूरी है, नहीं तो हम JavaScript को ठीक से नहीं समझ सकते। किसी Variable या Function का Context इस बात को Define करता है कि वह किस Data को Access कर सकता है और किस प्रकार से व्यवहार कर सकता है।

हर Execution Context के साथ एक Variable Object Associated होता है जिस पर इसके सभी Define किए गए Functions व Variables Exist होते हैं। इस Object को हम JavaScript Code द्वारा Directly Access नहीं कर सकते लेकिन Data को Handle करने के लिए ये Object JavaScript के Background में काम करता है।

Global Execution Context सबसे बाहर का यानी Outermost Context होता है। किसी Host Environment में ECMAScript को किस तरह से Implement किया गया है, इस तथ्‍य के आधार पर Variable Object अलग-अलग तरीके से इस Context को Represent कर सकता है।

उदाहरण के लिए Web Browser में Global Context को window Object कहा जाता है यानी Web Browser का window Object, Web Browser का Global Context होता है, इसलिए सभी Global Variables व Functions, window Object की Properties व Methods के रूप में Create होते हैं और window Object के साथ Associated रहते हैं।

जब एक Execution Context अपने सभी Codes को Execute कर देता है, वह Destroy हो जाता है और Context के Destroy होने के साथ ही उससे Associated सभी Properties व Methods भी Destroy हो जाते हैं, जो कि Execution Context में Define किए गए थे। लेकिन Global Context तब तक Destroy नहीं होता, जब तक कि हम Web Browser, Web Page या Host Environment वाले Application से Exit नहीं हो जाते।

हर Function का अपना स्वयं का Execution Context होता है। जब भी किसी Function में कोई Code Execution Flow में होता है, Function का Context Stack पर Push होता है और Function का Execution Finish होने के बाद Stack फिर से Popped होता है तथा Program Control फिर से पिछले Execution Context में Return हो जाता है। ये तरीका किसी भी ECMAScript Program के Execution Flow को Control करता है।

जब कोई Code किसी Context में Execute हो रहा होता है, तब Variable Objects की एक Scope Chain Create होती है। इस Scope Chain के Create होने का मूल उद्दे”; Execution Context में के उन सभी Variables व Functions को एक क्रम में Access करने की सुविधा प्रदान करना होता है, जिन्हें Execution Context Access कर सकता है।

Scope Chain का Front हमेंशा उस Context का Variable Object होता है, जिसका Code Execute हो रहा होता है। यदि वह Context कोई Function हो, तो Activation Object,Variable Object की तरह Use होता है। एक Activation Object arguments नाम के Single Variable से Start होता है, जबकि ये arguments Object Global Context में नहीं होता।

Scope Chain का अगला Variable Object,Container Context से होता है और इसके बाद का अगला Variable Object अगले Container Context से होता है। ये Pattern तब तक Continue रहता है, जब तक कि Global Context नहीं आ जाता। यानी Global Context का Variable Object,Scope Chain का आिखरी Variable Object होता है।

जब किसी Context में किसी Variable को Access करने के लिए JavaScript उसके नाम की Searching करता है, तब Searching हमेंशा Scope Chain के Front से शुरू होता है और Searching तब तक चलती रहती है, जब तक कि वह Identifier प्राप्त नहीं हो जाता। यदि Specify किया गया Identifier प्राप्त नहीं होता, तो एक Error Generate होता है। इस पूरे System को समझने के लिए हम एक उदाहरण देखते हैं:

[code]
var color = "blue";
function changeColor(){
  if (color === "blue"){
    color = "red";
  } else {
    color = "blue";
  }
}

changeColor();
[/code]

इस उदाहरण में Function changeColor() की एक Scope Chain है, जिसमें दो Objects हैं। पहला इस Function का स्वयं का Variable Object है, जिस पर arguments Object Defined है जबकि दूसरा Global Context का Variable Object है। इसलिए color नाम का Variable Function के अन्दर ही Accessible है, क्योंकि Searching के दौरान ये Variable Scope Chain में ही मिल जाएगा।

यानी जब Function Run होगा और if Statement की Condition Check करने के लिए जब JavaScript द्वारा color Variable को Search किया जाएगा ताकि उसकी Value को इस बात के लिए Check किया जा सके कि उसमें Value के रूप में मान “blue”Stored है या नहीं, तो ये Variable,Global Context में Defined होने की वजह से Scope Chain के दूसरे Variable Object के रूप में मिल जाएगा और Function में Use या Access होने के लिए Available रहेगा।

JavaScript के Context Concept को इस तरह से Design किया गया है कि हम किसी Variable को किसी Function के अन्दर Local Context में Define करें या Function के बाहर Global Context में, दोनों ही स्थितियों में Local Context का Local Variable, Function के बाहर Global Context में Accessible नहीं रहता है जबकि Global Context का Global Variable, Function के अन्दर Local Context में Available रहता है। इसे समझने के लिए हम एक और उदाहरण देखते हैं:

[code]
var color = "blue";
function changeColor(){
  var anotherColor = "red";
  function swapColors(){
    var tempColor = anotherColor;
    anotherColor = color;
    color = tempColor;
    //color, anotherColor, and tempColor are all accessible here
  }
  //color and anotherColor are accessible here, but not tempColor
  swapColors();
}

//only color is accessible here
changeColor();
[/code]

इस Code Segment में Global Context, changeColor() Function का Local Context व swapColors() Function का Local Context यानी कुल तीन Execution Contexts हैं।

Global Context में color नाम का एक Variable व changeColor() नाम का एक Function है जबकि changeColor() Function के Local Context में anotherColor नाम का एक Variable व swapColors() नाम का एक Nested Function है। लेकिन ये Function Global Context के color नाम के Variable को भी Access कर सकता है।

swapColors() Function के Local Context में tempColor नाम का केवल एक Variable है और ये Variable केवल इसी Function के अन्दर Accessible है। यानी Global Context या changeColor() Function के Local Context में इस Variable को Access नहीं किया जा सकता।

जबकि swapColors() Function अपने Container changeColor() Function व Global Context दोनों के Variables को Access करने में सक्षम है और ये Function इन दोनों Contexts के Variables को इसलिए Access करने में सक्षम है, क्योंकि ये दोनों Contexts इस swapColors() Function के Parent Contexts हैं। यदि हम उपरोक्त Program के Scope Chain को Represent करें, तो निम्न चित्रानुसार Represent कर सकते हैं:

Inner Context अपने Outer Context के किसी भी Variable को Scope Chain के माध्‍यम से Access कर सकता है लेकिन Outer Context, Inner Context के Variable व Functions को Access नहीं कर सकता। क्योंकि Contexts के बीच का Connection Linear व Ordered तथा Innermost से Outermost की तरफ होता है। इसलिए कोई भी Context किसी Variable या Function को Access करने के लिए उसे Scope Chain को Upside में Search कर सकता है लेकिन Down Side में Search नहीं कर सकता।

इस चित्र द्वारा हम समझ सकते हैं कि tempColor Variable केवल swapColors() Function में Accessible है, जबकि swapColors() Function anotherColor व color नाम के Variables को भी Access कर सकता है, क्योंकि ये दोनों Variables swapColors() Function के Parent Contexts हैं।

जबकि changeColor() Function, Global Context के color Variable को तो Access कर सकता है, लेकिन swapColors() Function के tempColor को Access नहीं कर सकता, क्योंकि ये Scope Chain में Down Side में नहीं जा सकता। जबकि Global Context सिर्फ और सिर्फ color को ही Access कर सकता है, anotherColor या tempColor को नहीं। नियम फिर से यही है कि Control Scope Chain में Down Side में नहीं जा सकता।