」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > JavaScript執行上下文詳解

JavaScript執行上下文詳解

發佈於2024-11-04
瀏覽:899

JavaScript Execution Context একটি গুরুত্বপূর্ণ ধারণা যা প্রোগ্রাম চলাকালীন সময়ে কিভাবে কোড ব্যাখ্যা এবং এক্সিকিউট করা হয় তা বোঝায়। প্রতিটি ফাংশন কল বা কোডের একটি ব্লক চালানোর সময় একটি execution context তৈরি হয়, যা কোড চলাকালীন সময়ে সমস্ত ভেরিয়েবল, অবজেক্ট, এবং ফাংশনগুলোর স্কোপকে নিয়ন্ত্রণ করে।

Execution Context কী?

Execution Context হল একটি পরিবেশ যা JavaScript কোডের execution (কার্যকরকরণ) সময় তৈরি হয়। এটি একটি container এর মতো কাজ করে যা specific ফাংশনের ভেরিয়েবল, অবজেক্ট এবং ফাংশনের তথ্যগুলো সংরক্ষণ করে। মূলত, Execution Context জাভাস্ক্রিপ্ট ইঞ্জিনকে বলে দেয় কোন ভেরিয়েবল এবং ফাংশনগুলো কোথায় পাওয়া যাবে এবং সেগুলো কীভাবে কার্যকর করতে হবে।

Execution Context এর প্রকারভেদ

Execution Context প্রধানত তিন প্রকারের হতে পারে:

  1. Global Execution Context (GEC): যখন কোনো স্ক্রিপ্ট প্রথমবার চালু হয়, তখন একটি global execution context তৈরি হয়। এটি শুধুমাত্র একবার তৈরি হয় এবং এতে global object (যেমন ব্রাউজারে window) এবং this binding অন্তর্ভুক্ত থাকে। GEC শেষ হয় না যতক্ষণ না পুরো স্ক্রিপ্ট execute শেষ হয়।
  2. Function Execution Context (FEC): প্রতিবার যখন একটি ফাংশন কল করা হয়, তখন একটি নতুন execution context তৈরি হয়। প্রতিটি ফাংশনের নিজস্ব execution context থাকে, যা তাদের নিজস্ব scope, variables এবং this binding নিয়ে থাকে।
  3. Eval Execution Context: যখন eval() ফাংশনটি ব্যবহৃত হয় তখন একটি নতুন execution context তৈরি হয়। যদিও eval() ব্যবহার করা সাধারণত নিরুৎসাহিত করা হয় কারণ এটি কোড পড়ার এবং নিরাপত্তার জন্য সমস্যা সৃষ্টি করতে পারে।

Execution Context এর Components:

Execution Context সাধারণত তিনটি প্রধান অংশ নিয়ে গঠিত:

  1. Variable Object (VO) / Lexical Environment: সমস্ত ভেরিয়েবল, ফাংশন ডিক্লারেশন এবং ফাংশন আর্গুমেন্টগুলোকে সংরক্ষণ করে।
console.log(a); // Output: undefined
var a = 5;

function myFunction() {
    console.log(b); // Output: undefined
    var b = 10;
}
myFunction();
  1. Scope Chain: Scope Chain হলো একটি চেইন যা বর্তমান execution context থেকে শুরু করে তার পূর্ববর্তী context পর্যন্ত সমস্ত ভেরিয়েবল এবং ফাংশনগুলিকে অ্যাক্সেসযোগ্য করে। এটি নির্ধারণ করে কোন ভেরিয়েবলগুলি কোথায় পাওয়া যাবে।।
var globalVar = "I'm Global";

function outerFunction() {
    var outerVar = "I'm in outer function";

    function innerFunction() {
        var innerVar = "I'm in inner function";
        console.log(globalVar); // "I'm Global"
        console.log(outerVar);  // "I'm in outer function"
    }

    innerFunction();
}

outerFunction();

  1. this Keyword Binding: this হল একটি বিশেষ keyword, যা Execution Context অনুযায়ী পরিবর্তিত হয়। Global Execution Context এ this global অবজেক্টকে নির্দেশ করে, আর Function Execution Context এ এটি নির্ভর করে ফাংশনটি কীভাবে কল করা হয়েছে তার উপর।
console.log(this); // Global context, refers to `window` in browsers.

var myObject = {
    name: "JavaScript",
    sayName: function() {
        console.log(this.name); // `this` refers to `myObject`.
    }
};

myObject.sayName(); // Output: "JavaScript"

function MyConstructor() {
    this.prop = "Property";
}

var obj = new MyConstructor();
console.log(obj.prop); // Output: "Property"

Execution Context Lifecycle:

Execution Context এর lifecycle তিনটি ধাপে বিভক্ত:

  1. Creation Phase: এই ধাপে Execution Context তৈরি হয় এবং Scope Chain, Variable Object এবং this এর মতো সমস্ত গুরুত্বপূর্ণ components তৈরি এবং initialized হয়।
  2. Execution Phase: এই ধাপে কোড execute করা হয়, অর্থাৎ, ভেরিয়েবলগুলোকে মান অ্যাসাইন করা হয় এবং ফাংশনগুলো execute করা হয়।
  3. Garbage Collection: Execution Context এর শেষের দিকে, যদি এটি আর দরকার না হয়, তাহলে এটি মেমরি থেকে অপসারণ করা হয় এবং সংশ্লিষ্ট resources গুলো মুক্তি পায়।

JavaScript Execution Context সম্পর্কে বিস্তারিত আলোচনা

Conclusion

Execution Context জাভাস্ক্রিপ্টের মূল ভিত্তি যা ঠিক করে কোড কীভাবে কার্যকর হবে। এটি ভেরিয়েবল, ফাংশন, এবং স্কোপের সঠিক ব্যবস্থাপনা করে। Execution Context এর সঠিক বোঝাপড়া থাকলে, জাভাস্ক্রিপ্ট কোডের কার্যকারিতা এবং কার্যনির্বাহী ধাপগুলোকে ভালোভাবে বুঝতে এবং পরিচালনা করতে সহায়তা করে।

版本聲明 本文轉載於:https://dev.to/rsmacademybd/javascript-execution-context-smprke-bistaarit-aalocnaa-1756?1如有侵犯,請聯繫[email protected]刪除
最新教學 更多>
  • MySQL中如何高效地根據兩個條件INSERT或UPDATE行?
    MySQL中如何高效地根據兩個條件INSERT或UPDATE行?
    在兩個條件下插入或更新或更新 solution:的答案在於mysql的插入中...在重複鍵更新語法上。如果不存在匹配行或更新現有行,則此功能強大的功能可以通過插入新行來進行有效的數據操作。如果違反了唯一的密鑰約束。 實現所需的行為,該表必須具有唯一的鍵定義(在這種情況下為'名稱'...
    程式設計 發佈於2025-06-09
  • Go語言垃圾回收如何處理切片內存?
    Go語言垃圾回收如何處理切片內存?
    Garbage Collection in Go Slices: A Detailed AnalysisIn Go, a slice is a dynamic array that references an underlying array.使用切片時,了解垃圾收集行為至關重要,以避免潛在的內存洩...
    程式設計 發佈於2025-06-09
  • 如何使用Java.net.urlConnection和Multipart/form-data編碼使用其他參數上傳文件?
    如何使用Java.net.urlConnection和Multipart/form-data編碼使用其他參數上傳文件?
    使用http request 上傳文件上傳到http server,同時也提交其他參數,java.net.net.urlconnection and Multipart/form-data Encoding是普遍的。 Here's a breakdown of the process:Mu...
    程式設計 發佈於2025-06-09
  • 在C#中如何高效重複字符串字符用於縮進?
    在C#中如何高效重複字符串字符用於縮進?
    在基於項目的深度下固定字符串時,重複一個字符串以進行凹痕,很方便有效地有一種有效的方法來返回字符串重複指定的次數的字符串。使用指定的次數。 constructor 這將返回字符串“ -----”。 字符串凹痕= new String(' - ',depth); console.W...
    程式設計 發佈於2025-06-09
  • 如何在鼠標單擊時編程選擇DIV中的所有文本?
    如何在鼠標單擊時編程選擇DIV中的所有文本?
    在鼠標上選擇div文本單擊單擊單個鼠標單擊單擊單擊?這允許用戶輕鬆拖放所選的文本或直接複製它。 在單個鼠標上單擊的div元素中選擇文本,您可以使用以下Javascript函數: function selecttext(canduterid){ if(document.Selection)...
    程式設計 發佈於2025-06-09
  • 為什麼我的CSS背景圖像出現?
    為什麼我的CSS背景圖像出現?
    故障排除:CSS背景圖像未出現 ,您的背景圖像儘管遵循教程說明,但您的背景圖像仍未加載。圖像和样式表位於相同的目錄中,但背景仍然是空白的白色帆布。 而不是不棄用的,您已經使用了CSS樣式: bockent {背景:封閉圖像文件名:背景圖:url(nickcage.jpg); 如果您的html,cs...
    程式設計 發佈於2025-06-09
  • 查找當前執行JavaScript的腳本元素方法
    查找當前執行JavaScript的腳本元素方法
    如何引用當前執行腳本的腳本元素在某些方案中理解問題在某些方案中,開發人員可能需要將其他腳本動態加載其他腳本。但是,如果Head Element尚未完全渲染,則使用document.getElementsbytagname('head')[0] .appendChild(v)的常規方...
    程式設計 發佈於2025-06-09
  • 在細胞編輯後,如何維護自定義的JTable細胞渲染?
    在細胞編輯後,如何維護自定義的JTable細胞渲染?
    在JTable中維護jtable單元格渲染後,在JTable中,在JTable中實現自定義單元格渲染和編輯功能可以增強用戶體驗。但是,至關重要的是要確保即使在編輯操作後也保留所需的格式。 在設置用於格式化“價格”列的“價格”列,用戶遇到的數字格式丟失的“價格”列的“價格”之後,問題在設置自定義單元...
    程式設計 發佈於2025-06-09
  • Python中何時用"try"而非"if"檢測變量值?
    Python中何時用"try"而非"if"檢測變量值?
    使用“ try“ vs.” if”來測試python 在python中的變量值,在某些情況下,您可能需要在處理之前檢查變量是否具有值。在使用“如果”或“ try”構建體之間決定。 “ if” constructs result = function() 如果結果: 對於結果: ...
    程式設計 發佈於2025-06-09
  • HTML格式標籤
    HTML格式標籤
    HTML 格式化元素 **HTML Formatting is a process of formatting text for better look and feel. HTML provides us ability to format text without us...
    程式設計 發佈於2025-06-09
  • Android如何向PHP服務器發送POST數據?
    Android如何向PHP服務器發送POST數據?
    在android apache httpclient(已棄用) httpclient httpclient = new defaulthttpclient(); httppost httppost = new httppost(“ http://www.yoursite.com/script.p...
    程式設計 發佈於2025-06-09
  • Python中嵌套函數與閉包的區別是什麼
    Python中嵌套函數與閉包的區別是什麼
    嵌套函數與python 在python中的嵌套函數不被考慮閉合,因為它們不符合以下要求:不訪問局部範圍scliables to incling scliables在封裝範圍外執行範圍的局部範圍。 make_printer(msg): DEF打印機(): 打印(味精) ...
    程式設計 發佈於2025-06-09
  • 您如何在Laravel Blade模板中定義變量?
    您如何在Laravel Blade模板中定義變量?
    在Laravel Blade模板中使用Elegance 在blade模板中如何分配變量對於存儲以後使用的數據至關重要。在使用“ {{}}”分配變量的同時,它可能並不總是最優雅的解決方案。 幸運的是,Blade通過@php Directive提供了更優雅的方法: $ old_section =...
    程式設計 發佈於2025-06-09
  • 如何正確使用與PDO參數的查詢一樣?
    如何正確使用與PDO參數的查詢一樣?
    在pdo 中使用類似QUERIES在PDO中的Queries時,您可能會遇到類似疑問中描述的問題:此查詢也可能不會返回結果,即使$ var1和$ var2包含有效的搜索詞。錯誤在於不正確包含%符號。 通過將變量包含在$ params數組中的%符號中,您確保將%字符正確替換到查詢中。沒有此修改,PD...
    程式設計 發佈於2025-06-09
  • 如何從PHP中的數組中提取隨機元素?
    如何從PHP中的數組中提取隨機元素?
    從陣列中的隨機選擇,可以輕鬆從數組中獲取隨機項目。考慮以下數組:; 從此數組中檢索一個隨機項目,利用array_rand( array_rand()函數從數組返回一個隨機鍵。通過將$項目數組索引使用此鍵,我們可以從數組中訪問一個隨機元素。這種方法為選擇隨機項目提供了一種直接且可靠的方法。
    程式設計 發佈於2025-06-09

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3