بسته شدن جاوا اسکریپت: راهنمای مبتدیان

بسته شدن یک ویژگی مهم مهم در جاوا اسکریپت است که بسیاری از مبتدیان با آن دست و پنجه نرم می کنند. آنها مسئول چندین مورد از مفیدترین ویژگی های جاوا اسکریپت هستند، مانند ذخیره وضعیت در فراخوانی تابع و ایجاد متغیرهای خصوصی. این وبلاگ سعی می‌کند با تجزیه و تحلیل آن‌ها به زبان ساده و بحث درباره اهمیت آن‌ها همراه با مثال‌های کاربردی، موارد بسته را توضیح دهد.

💡 بسته شدن چیست؟

هنگامی که یک تابع از تابع دیگری در جاوا اسکریپت برگردانده می شود، دامنه تابع والد را به ارث می برد. این بدان معنی است که تابع برگشتی می تواند به متغیرهای تعریف شده در محدوده تابع خارجی حتی پس از اتمام اجرای تابع خارجی دسترسی داشته باشد. الف بسته شدن ترکیبی از یک تابع و محدوده آن است.
در اینجا یک تعریف ساده تر وجود دارد:

• بسته شدن تابعی است که “به یاد می آورد” متغیرهایی از محدوده تابع بیرونی (محصور کننده).
• این تابع داخلی را قادر می سازد تا به این متغیرها دسترسی داشته باشد، حتی زمانی که تابع خارجی دیگر اجرا نمی شود.

💡 نحوه کار بستن: یک مثال

📌 مثال بدون بسته شدن

function outer(){
    let counter = 0
    function inner(){
        counter++
        console.log("counter = " + counter)
    }
    inner()
}
outer()
outer() 
/* Output:
counter = 1
counter = 1 */

📌 مثال با بستن

function outer(){
    let counter = 0
    function inner(){
        counter++
        console.log("counter = " + counter)
    }
    return inner
}
const fn = outer()
fn()
fn()
/* Output:
counter = 1
counter = 2 */

🔑 ویژگی های کلیدی بسته شدن

1. حافظه پایدار: متغیرهای موجود در محدوده تابع خارجی مدتها پس از خروج تابع خارجی “به خاطر سپرده می شوند”.
2. محدوده واژگانی: بسته شدن بر اساس جایی است که تابع تعریف شده است، نه محل اجرای آن.
3. نمونه های متعدد: هر نمونه بسته شدن کپی خودش از متغیرهای بیرونی را ذخیره می کند.

📌 مثالی با چند نمونه:

function counterFunction() {
    let count = 0;

    return function increment() {
        count++;
        return count;
    };
}

const counter1 = counterFunction();
const counter2 = counterFunction();

console.log("counter1 = " + counter1()); // Output: 1
console.log("counter1 = " + counter1()); // Output: 2
console.log("counter2 = " + counter2()); // Output: 1
console.log("counter1 = " + counter1()); // Output: 3
console.log("counter2 = " + counter2()); // Output: 2

اینجا، counter1 و counter2 هر کدام جداگانه خود را دارند count متغیر

💻 کاربردهای عملی درب ها

1️⃣ حریم خصوصی داده ها: بسته شدن می تواند متغیرها را از دامنه جهانی پنهان کند، بنابراین آنها فقط در یک تابع خاص در دسترس هستند.
📌 مثال:

function secretInfo() {
    let secret = "I love JavaScript";
    return {
        getSecret: function() {
            return secret;
        },
        setSecret: function(newSecret) {
            secret = newSecret;
        }
    };
}

const secretObject = secretInfo();
console.log(secretObject.getSecret()); // Output: I love JavaScript
secretObject.setSecret("I love Python too!");
console.log(secretObject.getSecret()); // Output: I love Python too!
secretObject.setSecret("I love PHP too!");
console.log(secretObject.getSecret()); // Output: I love PHP too!
// Attempting to Access secret Directly will not work
console.log(secretObject.secret); // Output: undefined

✍️ چگونه این کد حریم خصوصی داده ها را نشان می دهد:

1. حفاظت از دامنه جهانی: متغیر secret نمی توان مستقیماً از دامنه جهانی یا هر بخش دیگری از کد به آن دسترسی داشت. برای مثال، اگر console.log (secretObject.secret) را امتحان کنید، باز خواهد گشت undefined.
2. Private State Maintenance: متغیر بسته شدن secret خصوصی است و فقط با استفاده از آن می توان آن را خواند یا تغییر داد getSecret و setSecret روش ها
3. دسترسی کنترل شده: برنامه دسترسی محدود به آن را تضمین می کند secret متغیر با تعریف توابع getSecret و setSecret.

2️⃣ کارخانجات عملکردی: الف کارخانه عملکرد تابعی است که توابع جدید را تولید و برمی گرداند. این ما را قادر می سازد تا به صورت پویا عملکردهای سفارشی شده را بر اساس پارامترهای ورودی بسازیم.
📌 مثال:

function calculate(factor) {
    return function multiplier(number) {
        return number * factor;
    };
}

const double = calculate(2);
const triple = calculate(3);
console.log(double(5)); // Output: 10
console.log(triple(5)); // Output: 15

✍️ این کد چگونه کارخانجات عملکردی را نشان می دهد:

1. را calculate تابع مانند یک کارخانه کار می کند و توابع ضریب تخصصی تولید می کند (double، triple) بر اساس ورودی (factor).
2. هر تابع منحصر به فرد و مستقل است در حالی که منطق اصلی یکسانی را به اشتراک می گذارد.

3️⃣ شنوندگان رویداد: بستن معمولاً در callbacks و شنوندگان رویداد برای حفظ وضعیت استفاده می شود.
📌 مثال:

function setupListener(buttonId) {
    let clickCount = 0;

    document.getElementById(buttonId).addEventListener("click", function() {
        clickCount++;
        console.log(`Button clicked ${clickCount} times`);
    });
}

setupListener("myButton");

✍️ چگونه این کد نحوه عملکرد بسته شدن را در شنوندگان رویداد نشان می دهد:

1. را setupListener تابع یک بسته ایجاد می کند و آن را تعریف می کند clickCount متغیر درون آن
2. تابع شنونده رویداد، که یک تماس برگشتی است، به آن دسترسی پیدا می کند clickCount حتی بعد از setupListener روش اجرا به پایان رسیده است.
3. هر بار دکمه با ID "myButton" کلیک می شود، پاسخ تماس شنونده رویداد افزایش می یابد clickCount و مقدار به روز شده را ثبت می کند.

🏁 نتیجه گیری

بستن یک ایده اساسی در جاوا اسکریپت است که به توسعه دهندگان اجازه می دهد کدهای ماژولار، کارآمد و خصوصی بیشتری بسازند. درک بسته شدن به شما توانایی نوشتن توابع پویا، حفظ حالت پایدار و دستیابی به کپسوله سازی داده ها را می دهد.

به عنوان یک مبتدی، زمانی را صرف تمرین و آزمایش در مورد بسته شدن کنید. ممکن است در ابتدا دشوار به نظر برسند، اما با استفاده از مثال های عملی و استفاده، به زودی به قدرت و تطبیق باور نکردنی آنها در برنامه نویسی جاوا اسکریپت پی خواهید برد.

آیا قیاس یا مثالی از زندگی واقعی وجود دارد که به شما در یادگیری بسته شدن کمک کند؟ آنها را در بخش نظرات زیر به اشتراک بگذارید!
کد نویسی مبارک! ✨