💡 جاوا اسکریپت چگونه در زیر سرپوش کار می کند: شیرجه ای سرگرم کننده در جادو ✨

Summarize this content to 400 words in Persian Lang
تا به حال به این فکر کرده اید که وقتی کد جاوا اسکریپت را می نویسید و ضربه می زنید چه اتفاقی می افتد اجرا کنید? جادو کجا اتفاق می افتد؟ کد شما واقعا چگونه است صحبت کنید به کامپیوتر شما؟ نگران نباشید، من اینجا هستم تا شما را در این سفر راهنمایی کنم – از ضربه زدن انگشتانتان به صفحه کلید گرفته تا کامپیوترتان که کدتان را اجرا می کند. و من قول می دهم که آن را سرگرم کننده نگه دارم! 😉

1. جاوا اسکریپت جادو نیست (اما به اندازه کافی نزدیک است!) 🪄

اول از همه: جاوا اسکریپت یک است زبان تفسیری سطح بالا. این به چه معناست؟ به بیان ساده، مانند این است که شما (توسعه‌دهنده) یک لیست کارها را به زبان انگلیسی می‌نویسید، و مرورگر شما به اندازه کافی هوشمند است که بتواند آن را بخواند، بفهمد، و بر اساس آن عمل کند—بدون نیاز به دانستن جزئیات دقیق دستگاه.

اما نکته اینجاست: جاوا اسکریپت برای رسیدن به مغز کامپیوتر شما (CPU) به کمک نیاز دارد. شما مرورگر (مثل کروم، فایرفاکس و…) قهرمان این داستان است و از چیزی به نام a استفاده می کند موتور جاوا اسکریپت تا همه چیز اتفاق بیفتد

2. وارد موتور جاوا اسکریپت شوید: سوپر مغز 🧠

در قلب همه چیز این است موتور جاوا اسکریپت. این قطعه نرم افزاری است که کد جاوا اسکریپت انسان پسند شما را می گیرد و آن را به زبان ماشین پسند تبدیل می کند.

موتور JS کروم: V8 🚗

هر مرورگر موتور مخصوص به خود را دارد. به عنوان مثال، کروم استفاده می کند V8، که یکی از سریع ترین موتورهای موجود است (از آن نیز استفاده می شود Node.js!). V8 را مانند یک ماشین فوق‌العاده سریع در نظر بگیرید که از طریق کد شما سرعت می‌گیرد و آن را به چیزی تبدیل می‌کند که کامپیوتر بتواند آن را بفهمد.

این روند به این صورت است:

تجزیه (شکستن کد) 🔍
موتور کد JS شما را می گیرد و آن را به قطعات کوچکتر و قابل فهم تقسیم می کند. این مرحله نامیده می شود تجزیه. چیزی به نام an را ایجاد می کند درخت نحوی چکیده (AST). نگران نباشید، این فقط یک روش فانتزی برای گفتن است: “بیایید این کد را به چیزی ساختارمندتر تبدیل کنیم.”

مثال:

let num = 5;
console.log(num);

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

موتور می خواند let num = 5; و می داند: “بسیار خوب، یک متغیر به نام وجود دارد num با مقدار 5. متوجه شدم!”

کامپایل (تبدیل کد به زبان ماشین) ⚙️بعد، موتور JS شما این درخت را کامپایل (ترجمه) می کند بایت کد. بایت کد مانند یک زبان میانی است که درک آن برای رایانه آسان تر است.
اعدام (بیایید این کار را انجام دهیم! 💥)اکنون بایت کد به چیزی به نام an وارد می شود مترجم. مفسر خط به خط کد را اجرا می کند و آن را روی CPU شما (که سخت افزار واقعی داخل دستگاه شما است) اجرا می کند.

بنابراین وقتی کد را اجرا می کنید:

let num = 5;
console.log(num);

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

موتور جاوا اسکریپت تمام کارهای سنگین را انجام می دهد و آن را به چیزی تبدیل می کند که CPU شما می تواند پردازش کند و بیرون بیاورد: 5.

3. در مورد بهینه سازی چطور؟ 🚀

اما صبر کنید، جاوا اسکریپت به همین جا ختم نمی شود! موتورهای مدرن مانند V8 فوق العاده هوشمند هستند. آنها فقط کد شما را تفسیر نمی کنند – آنها بهینه سازی آن را در حالی که کد در حال اجرا است، موتور دائماً به دنبال راه هایی برای سریعتر کردن آن است. از چیزی به نام a استفاده می کند JIT (در زمان مقرر) کامپایلر

اینطور فکر کنید: اگر در یک مسابقه می دوید، JIT مانند کسی است که کفش های بهتری را در نیمه راه به شما می دهد. متوجه نحوه اجرای کد شما می شود و سرعت آن را افزایش می دهد در پرواز.

مثال:

اگر یک حلقه دارید که میلیون ها بار اجرا می شود:

for (let i = 0; i < 1000000; i++) {
console.log(i);
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

JIT متوجه الگو می شود و شروع به بهینه سازی نحوه اجرای حلقه می کند و هر بار که از طریق آن می گذرد آن را سریعتر می کند.

4. حلقه رویداد: سلاح مخفی جاوا اسکریپت 🔄

حالا قسمت جالب اینجاست: جاوا اسکریپت تک رشته ای است. این بدان معناست که تنها می تواند یک کار را در یک زمان انجام دهد (بدون چند وظیفه). اما صبر کنید، چگونه با مواردی از این قبیل برخورد می کند تایمرها، واکشی درخواست ها، یا روی رویدادها کلیک کنید?

را وارد کنید حلقه رویداد. 🎡

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

مثال:

console.log(“Start”);

setTimeout(() => {
console.log(“This runs later”);
}, 2000);

console.log(“End”);

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در کد بالا:

“شروع” ثبت می شود
این setTimeout به کناری فشار داده می شود (که توسط Event Loop اداره می شود).

“پایان” ثبت می شود
بعد از 2 ثانیه، Event Loop را باز می گرداند setTimeout عملکرد، و “این بعدا اجرا می شود” ثبت می شود

حتی اگر جاوا اسکریپت فقط یک کار را در یک زمان انجام دهد، حلقه رویداد اطمینان می دهد که همه چیز به آرامی انجام می شود. 🎢

5. از جاوا اسکریپت تا مرورگر: تصویر بزرگ 🌐

خوب، بیایید کمی بزرگنمایی کنیم و به کل جریان نگاه کنیم:

شما جاوا اسکریپت می نویسید در ویرایشگر کد شما (یا کنسول مرورگر).

موتور جاوا اسکریپت (V8) کد شما را می خواند و کامپایل می کند.

کد کامپایل شده توسط مرورگر (یا Node.js) روی CPU شما اجرا می شود.
این حلقه رویداد کارهای ناهمزمان (مانند تایمرها یا درخواست های API) را انجام می دهد.

بوم! وب‌سایت یا برنامه شما به کلیک‌ها پاسخ می‌دهد، داده‌ها را واکشی می‌کند و همه کارهای جالبی را که برای انجام آن کدگذاری کرده‌اید، انجام می‌دهد.

جمع بندی: جاوا اسکریپت – هوشمندتر از آن چیزی است که فکر می کنید 🧠

جاوا اسکریپت ممکن است مانند خطوط کد ساده به نظر برسد، اما در پشت صحنه، چیزهای زیادی در جریان است. موتور جاوا اسکریپت (مانند V8) آن را تجزیه می کند، آن را کامپایل می کند، بهینه می کند و روی CPU شما اجرا می کند. حلقه رویداد تمام جادوهای ناهمزمان را مدیریت می کند تا همه چیز به آرامی اجرا شود.

بنابراین، دفعه بعد که شما در حال نوشتن یک for حلقه یا تماس fetch()، تمام کارهایی را که موتور جاوا اسکریپت مرورگر شما برای زنده کردن کد شما انجام می دهد را به خاطر بسپارید! 💡

لطفا اگر امروز چیز جدیدی یاد گرفتید لایک/کامنت بگذارید 😉

   let num = 5;
   console.log(num);

let num = 5;
console.log(num);

for (let i = 0; i < 1000000; i++) {
  console.log(i);
}

console.log("Start");

setTimeout(() => {
  console.log("This runs later");
}, 2000);

console.log("End");