جاوا اسکریپت چیست؟ معرفی، ویژگی‌ها و کاربردهای JavaScript

زبان برنامه نویسی جاوا اسکریپت در سال 1995 و برای اضافه کردن قابلیت تعامل به صفحات وب ایجاد و منتشر شد. این زبان برنامه نویسی سطح بالا، رایگان و چند منظوره، اصلی‌ترین زبان برای توسعه وب و طراحی سایت‌های پویا و تعاملی است که غیر از وب، در زمینه‌های زیادی مورد استفاده قرار می‌گیرد. پرکاربردترین زبان برنامه نویسی به مدت 9 سال (از 2013 تا 2021)، بزرگترین جامعه توسعه دهندگان، بیشترین تعداد کتابخانه و فریمورک‌ها، عناوینی هستند که می‌توان به زبان برنامه نویسی جاوا اسکریپت نسبت داد.

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

زبان برنامه نویسی جاوا اسکریپت چیست؟

زبان برنامه نویسی جاوا اسکریپت که به اختصار JS نیز نامیده می‌شود، یک زبان برنامه نویسی سطح بالا، داینامیک، همه‌منظوره، کراس پلتفرم و شی‌گرا است که در سال 1995 توسط برنامه نویسی به نام برندان آیک (Brendan Eich) توسعه پیدا کرد. جاوا اسکریپت در ابتدا با هدف اضافه کردن ویژگی‌های تعاملی به صفحات وب توسعه پیدا کرد؛ اما به مرور و با افزایش محبوبیت و جامعه کاربری، امکان استفاده از آن در سایر شاخه‌های برنامه نویسی و علوم کامپیوتر نیز فراهم شد. البته که همچنان اصلی‌ترین کاربرد این زبان، در توسعه وب خصوصا بخش فرانت اند (Front End) یا همان ظاهر سایت است؛ اما به لطف فریمورک‌ها و کتابخانه‌های فوق العاده گسترده، می‌توان از جاوا اسکریپت در توسعه بک اند (Back End)، توسعه بازی، نرم افزارهای دسکتاپ و موبایل و تقریبا تمام شاخه‌های برنامه نویسی استفاده کرد!

جاوا اسکریپت، یک زبان برنامه نویسی است یا اسکریپت نویسی؟

قبل از همه، بیایید یک موضوع مهم که در اکثر آموزش‌ها و صحبت‌ها درباره JS به آن اشاره‌ای نمی‌شود را بررسی کنیم.

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

از سوی دیگر، زبان‌های دیگری به نام “زبان‌های اسکریپت نویسی” وجود دارند که تا حد زیادی، مشابه زبان‌های برنامه نویسی هستند؛ اما از نظر هدف و نوع اجرا، تفاوت‌هایی دارند. زبان‌های اسکریپت نویسی برای خودکارسازی وظایف، کنترل برنامه‌های موجود و یا ایجاد سریع تغییرات در برنامه‌ها مورد استفاده قرار می‌گیرند. همچنین برخلاف زبان‌های برنامه نویسی که نیاز به کامپایل دارند، اسکریپت‌ها نیاز به مفسر دارند و بدون نیاز به کامپایل اجرا می‌شوند.

زبان برنامه نویسی JavaScript در ابتدا تنها برای نوشتن اسکریپت‌ها در سمت فرانت اند سایت مورد استفاده قرار می‌گرفت؛ اما به مرور زمان، فریمورک‌ها و امکانات جدیدی برای آن توسعه داده شد که آن را تبدیل به یک زبان برنامه نویسی کرد. این یعنی امروزه با استفاده از جاوا اسکریپت، می‌توانید یک برنامه را به صورت صفر تا صد و بدون استفاده از سایر زبان‌های برنامه نویسی، توسعه دهید!

اما جاوا اسکریپت اصلا به چه دلیل توسعه یافت و به وجود آمد؟

داستان تولد جاوا اسکریپت و تحول دنیای وب!

در سال 1995 میلادی در شرکت نت اسکیپ، نیاز به ایجاد یک زبان اسکریپت نویسی برای تعاملی‌تر شدن صفحات وب احساس شد. وظیفه انجام این کار به برندان آیک سپرده شد؛ شخصی که طبق برخی اظهارات غیررسمی، توانست نسخه اولیه این زبان را در کمتر از 10 روز توسعه دهد. این زبان در ابتدا با نام موکا (Mocha) و تنها در مرورگر Netscape مورد استفاده قرار گرفت؛ اما در ادامه با تغییر نام به Livescript و سپس JavaScript توانست توجهات بیشتری را به سمت خود جلب کند.

اما یک مشکل وجود داشت؛ مرورگرهایی که متعلق به شرکت‌های دیگر بودند، تمایل چندانی برای استفاده از جاوا اسکریپت از خود نشان نمی‌دادند. شاید بزرگترین دلیل این مشکل، عدم تمایل به استفاده از خدمات شرکت رقیب یعنی NetScape بود. به همین دلیل، مایکروسافت یک زبان اسکریپت نویسی مشابه با نام جِی اسکریپت (JScript) برای مرورگر اینترنت اکسپلورر (IE) توسعه داد. شرکت نت اسکیپ، تصمیم گرفت جاوا اسکریپت را برای استانداردسازی، به موسسه اکما اینترنشنال (ECMA International) ارسال کند. این موسسه با ایجاد یک نسخه استاندارد از این زبان، آن را اکما اسکریپت نامید. از سال 2016 به بعد، هرساله نسخه جدیدی از اکما اسکریپت منتشر می‌شود که بهبودهایی در بخش‌های مختلف دارد.

جاوا اسکریپت، جی اسکریپت و اکشن اسکریپت (که توسط شرکت ادوبی برای فلش پلیر ساخته شده بود)، همگی زبان‌های پیاده‌سازی شده براساس اکما اسکریپت محسوب می‌شوند و مسلما زبان برنامه نویسی JavaScript، مشهورترین آنها است!

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

در بالا اشاره کردیم که در ابتدا، نام Mocha و LiveScript برای این زبان انتخاب شد؛ اما چه اتفاقاتی باعث شد امروزه آن را به نام جاوا اسکریپت بشناسیم؟

گفتیم که جاوا اسکریپت در سال 1995 توسعه پیدا کرد و چند ماه بعد، نام JavaScript برای آن برگزیده شد. در واقع، این نامگذاری یک حرکت تجاری حساب‌شده و هدفمند برای استفاده از مقبولیت و شهرت زبان جاوا (Java) بود. زبان جاوا در سال 1991 در شرکت سان میکروسیستمز ساخته و در اصل با هدف ایجاد یک زبان برنامه نویسی قدرتمند برای جایگزینی با زبان برنامه نویسی C توسعه پیدا کرده بود. طی یک همکاری تجاری با شرکت سان میکروسیستمز، شرکت NetScape اجازه استفاده از نام جاوا در زبان اسکریپت نویسی خود را کسب کرد و در دسامبر سال 1995 (آذر 1374) در مطبوعات، آن را اعلام کرد.

غیر از این، جاوا و JS ارتباط فنی خاصی به یکدیگر ندارند. البته که امکان استفاده از هر دوی آنها در دو سمت از یک سایت یا نرم افزار تحت وب وجود دارد؛ اما غیر از آن، این دو زبان ارتباط فنی خاصی با یکدیگر ندارند.

ویژگی‌های زبان JavaScript چیست؟

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

سطح بالا – چند منظوره – چند الگویی – وابستگی به محیط میزبان – چندسکویی – داینامیک تایپ – تعامل‌پذیری با کاربر – پشتیبانی گسترده از کتابخانه و فریمورک

سطح بالا

زبان جاوا اسکریپت یک زبان سطح بالا است؛ یعنی ساختار و دستورهای آن به گونه‌ای طراحی شده‌اند که بیشتر شبیه زبان انسان باشند تا زبان ماشین. در زبان‌های سطح پایین، برنامه نویس باید جزئیات فنی و پیچیده‌ای مانند نحوه عملکرد پردازنده یا مدیریت مستقیم حافظه را بداند؛ اما در زبان‌های سطح بالا مانند جاوا اسکریپت، نیازی به مدیریت این ویژگی‌ها نیست و کاربر می‌تواند با استفاده از دستورهایی ساده‌تر از نظر نوشتاری، منطق و هدف برنامه را توسعه دهد.

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

چند منظوره

جاوا اسکریپت زبانی است که می‌تواند در حوزه‌های مختلف مورد استفاده قرار گیرد. از توسعه ظاهر سایت (فرانت اند) گرفته تا توسعه هسته سایت در سرور (بک اند)، از ساخت اپلیکیشن‌های موبایل گرفته تا نرم افزارهای دسکتاپ و حتی برنامه‌های اینترنت اشیا. امکان استفاده از جاوا اسکریپت در گستره زیادی از شاخه‌های برنامه نویسی و IT وجود دارد و این قابلیت را مدیون تنوع بالایی از فریمورک‌ها و ابزارهایی است که عمدتا توسط جامعه کاربری توسعه و منتشر شده‌اند. برای مثال، شما می‌توانید با React یک وب‌سایت پویا بسازید، با Node.js بخش سرور را مدیریت کنید یا با استفاده از فریمورک Electron یک نرم افزار دسکتاپ چندسکویی توسعه دهید. همین انعطاف‌پذیری باعث شده جاوا اسکریپت به یک گزینه محبوب در بسیاری از انواع پروژه‌ها خصوصا پروژه‌های مبتنی بر وب تبدیل شود.

چند الگویی بودن (Multi-paradigm)

زبان جاوا اسکریپت از چندین سبک برنامه نویسی پشتیبانی می‌کند که به توسعه‌دهنده آزادی عمل کافی برای توسعه انواع پروژه‌های کوچک تا بزرگ را می‌دهد. می‌توانید از برنامه نویسی شی‌گرا برای سازمان‌دهی کد و مدل‌سازی اجزای برنامه استفاده کنید یا برنامه نویسی تابعی (Functional Programming) را برای ساده‌سازی عملیات‌ها و جلوگیری از تغییرات ناخواسته داده‌ها به کار بگیرید.

علاوه بر این موارد، برنامه نویسی مبتنی بر Eventها در جاوا اسکریپت به شما اجازه می‌دهد کدهایی بنویسید که به رویدادها و تعاملات کاربر واکنش نشان دهند. برای مثال، یکی از انواع رایج برنامه نویسی مبتنی بر Event، زمانیست که کاربر روی یک لینک، دکمه یا عنصر در صفحه کلیک کرده و یک پنجره یا پاپ‌آپ باز می‌شود!

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

قابلیت‌های وابسته به محیط میزبان

جاوا اسکریپت به صورت پیش‌فرض ابزار داخلی خاصی برای کار با فایل‌ها، شبکه یا سخت افزار ندارد. این قابلیت‌ها را محیط میزبان فراهم کرده و در اختیار زبان JavaScript قرار می‌دهد. مثلاً در مرورگرها، رابط‌های برنامه نویسی (API) خاصی مثل document یا fetch برای تغییر در محتوای صفحه و ارتباط با سرور وجود دارد؛ یا در محیط Node.js، امکاناتی مثل fs برای کار با سیستم فایل و http برای ساخت سرور در اختیار شما قرار می‌گیرند تا بتوانید برنامه خود را به خوبی توسعه دهید. این وابستگی باعث می‌شود جاوا اسکریپت با توجه به محیط اجرا، قابلیت‌های متفاوتی ارائه دهد.

چندسکویی (Cross-platform)

یکی از نقاط قوت جاوا اسکریپت، قابلیت اجرا روی انواع سیستم‌عامل‌ها و دستگاه‌ها است. اگر کد شما به صورت استاندارد نوشته شده باشد، می‌تواند روی مرورگرها و محیط‌های گوناگون بدون نیاز به هرگونه تغییر اجرا شود. برای مثال می‌توانید برنامه‌ای که برای مرورگر دسکتاپ توسعه داده‌اید را در مرورگر موبایل یا حتی ساعت‌های هوشمند اجرا کنید. این ویژگی باعث شده بسیاری از شرکت‌ها و تیم‌های توسعه نرم افزار، جاوا اسکریپت را به عنوان پایه اصلی پروژه‌های خود انتخاب کنند؛ زیرا یک کد را می‌توان در وب، موبایل و دسکتاپ استفاده کرد. البته که بسته به نیاز هر پروژه، باید زبان برنامه نویسی مناسب انتخاب شود!

داینامیک تایپ

یکی از ویژگی‌هایی که شخصا آن را می‌پسندم، داینامیک تایپ بودن زبان‌های برنامه نویسی است. در جاوا اسکریپت لازم نیست هنگام تعریف متغیر نوع آن را مشخص کنید. نوع داده به صورت خودکار در زمان اجرا تعیین می‌شود. برای مثال در صورتی که یک متغیر به نام x داشته باشیم و بخواهیم مقدار عددی 10 را به آن اختصاص دهیم، کافیست مانند عبارات جبری ریاضی بنویسیم:

X = 10

همچنین اگر نیاز به نوشتن یک مقدار از نوع کاراکتر در یک متغیر داریم، کافیست آن را درون دو علامت دابل کوتِیشن “” قرار دهیم. مثال:

X = “ali”

این ویژگی نوشتن کد را سریع‌تر و انعطاف‌پذیرتر می‌کند، اما نیاز به دقت بالاتری دارد؛ زیرا عدم توجه به نوع داده‌ها می‌تواند باعث بروز پیچیدگی‌های زیادی در توسعه برنامه شود.

تعامل‌پذیری با کاربر

جاوا اسکریپت امکان واکنش به انواع تعاملات کاربر مانند کلیک، تایپ یا حرکت ماوس را فراهم می‌کند. این ویژگی باعث شده وب‌سایت‌ها و اپلیکیشن‌ها پویا و زنده به نظر برسند. از فرم‌های بررسی آنی تا منوهای بازشونده، همه این امکانات با کمک جاوا اسکریپت ایجاد می‌شوند. این موارد با استفاده از متد کدنویسی مبتنی بر رویداد یا همان Eventها امکان پذیر است!

پشتیبانی گسترده از کتابخانه‌ها و فریمورک‌ها

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

کاربردهای جاوا اسکریپت چیست؟

در ابتدا، استفاده از جاوا اسکریپت تنها محدود به صفحات وب بود. جایی که این زبان می‌توانست براساس حرکات و واکنش‌های کاربر، کارها یا انیمیشن‌های خاصی را اعمال کند. امروز تقریبا شاخه‌ای از برنامه نویسی نیست که امکان استفاده از JavaScript در آن وجود نداشته باشد! در ادامه، اشاره کوتاهی به مهمترین کاربردهای زبان جاوا اسکریپت خواهیم داشت. اگر زمان کافی برای مطالعه این قسمت را ندارید، می‌توانید خلاصه‌ای از آن را در تصویر زیر ببینید!

1. توسعه وب (فرانت اند و بک اند)
2. توسعه نرم افزارهای دسکتاپ
3. توسعه نرم افزارهای موبایل
4. توسعه نرم افزارهای چندسکویی
5. توسعه برنامه‌های PWA
6. توسعه برنامه‌های SPA
7. اینترنت اشیا و رباتیک
8. یادگیری ماشین و هوش مصنوعی
9. توسعه پلاگین برای مرورگر
10. اتوماسیون و خودکارسازی کارها
11. توسعه چت‌بات و ربات‌های تعاملی
12. مصورسازی داده‌ها

توسعه وب (فرانت اند و بک اند)

در کنار زبان‌های HTML و CSS که پایه و اساس توسعه وب هستند، جاوا اسکریپت نیز نقش مهمی را ایفا می‌کند. در بخش فرانت اند، استفاده از برنامه نویسی JavaScript به شما کمک می‌کند تا ظاهر سایت را پویا و تعاملی کنید. مثلا وقتی روی دکمه‌ای کلیک می‌کنید و بدون بارگذاری مجدد صفحه، اطلاعاتی نمایش داده می‌شود، پشت صحنه این کار جاوا اسکریپت است. اصلا همه منوهای بازشونده در سایت‌ها، با استفاده از جاوا اسکریپت ساخته شده‌اند!

در توسعه سمت سرور یا همان بک اند نیز می‌توانید با استفاده از محیط‌هایی مثل Node.js، منطق اصلی سایت و ارتباط با پایگاه داده را پیاده سازی کنید. این یعنی با یادگیری جاوا اسکریپت می‌توانید هم ظاهر سایت و هم بخش‌های داخلی آن را توسعه دهید، بدون نیاز به یادگیری یک زبان سمت سرور مثل PHP یا جاوا! به سایت‌هایی که فرانت اند و بک اند آن با استفاده از جاوا اسکریپت توسعه پیدا کرده باشد، سایت‌های جاوا اسکریپتی یا Full-Stack JS گفته می‌شود!

توسعه نرم افزارهای دسکتاپ

با کمک فریمورک‌هایی مانند Electron، می‌توانید نرم افزارهایی بسازید که روی سیستم عامل‌های مختلف مثل ویندوز، مک و لینوکس اجرا شوند. این نرم افزارها با جاوا اسکریپت نوشته می‌شوند اما ظاهر و عملکردی مشابه برنامه‌های دسکتاپی سنتی دارند. مزیت این روش این است که نیازی نیست برای هر سیستم عامل یک نسخه جدا بنویسید. بسیاری از برنامه‌های مشهور مثل Visual Studio Code و Slack با همین روش ساخته شده‌اند، پس جاوا اسکریپت فقط مخصوص وب نیست و می‌تواند وارد دنیای دسکتاپ هم شود.

توسعه نرم افزارهای موبایل

امروزه با ابزار‌هایی مانند React Native یا Ionic می‌توان نرم افزارهایی برای موبایل ساخت که روی سیستم عامل‌های اندروید و iOS کار کنند. این یعنی به جای یادگیری زبان‌های مخصوص هر پلتفرم (مثل جاوا برای اندروید یا سوئیفت برای iOS)، می‌توانید با جاوا اسکریپت یک بار کدنویسی کنید و آن را روی هر دو اجرا کنید. این روش باعث صرفه جویی در زمان و هزینه می‌شود و همچنین نگهداری و بروزرسانی نرم افزار را آسان‌تر می‌کند.

توسعه نرم افزارهای چندسکویی

نرم افزارهای چندسکویی یا Cross-Platform برنامه‌هایی هستند که روی چند نوع دستگاه یا سیستم عامل به خوبی اجرا می‌شوند. جاوا اسکریپت با ابزارهایی مثل Electron، React Native و حتی PWAها، این امکان را می‌دهد که تنها یک کد بنویسید اما خروجی را روی موبایل، دسکتاپ یا وب اجرا کنید. این موضوع به خصوص برای تیم‌های کوچک یا پروژه‌هایی با بودجه محدود بسیار ارزشمند است.

توسعه برنامه‌های PWA و SPA

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

اینترنت اشیا و رباتیک

جاوا اسکریپت حتی در دنیای سخت افزار هم حضور دارد. با استفاده از کتابخانه‌هایی مانند Johnny-Five می‌توانید سنسورها، موتورها و بردهای الکترونیکی را کنترل کنید. این موضوع در پروژه‌های اینترنت اشیا (IoT) و رباتیک کاربرد دارد؛ مثلا می‌توانید با جاوا اسکریپت یک ربات کوچک بسازید یا دمای یک محیط را اندازه بگیرید و داده‌ها را به اینترنت بفرستید.

یادگیری ماشین و هوش مصنوعی

جاوا اسکریپت با کتابخانه‌هایی مثل TensorFlow.js و Brain.js امکان اجرای مدل‌های یادگیری ماشین را در مرورگر و محیط سرور فراهم کرده است. این ویژگی به توسعه‌دهندگان وب اجازه می‌دهد بدون یادگیری زبان‌های جدید، وارد دنیای هوش مصنوعی شوند و مدل‌های مورد نیاز خود را با استفاده از زبان برنامه نویسی JavaScript توسعه دهند.

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

توسعه پلاگین برای مرورگر

جاوا اسکریپت یکی از اصلی‌ترین زبان‌ها برای توسعه افزونه‌های مرورگرهایی نظیر کروم و فایرفاکس  است. این پلاگین‌ها می‌توانند باعث بهبود رابط کاربری مرورگر شوند (مثل افزونه دستیار) یا اینکه یا حتی قابلیت‌ها و ابزارهای جدیدی به مرورگر اضافه کنند. از افزونه‌های ساده مانند مسدودکننده تبلیغات گرفته تا ابزارهای پیچیده برای توسعه‌دهندگان، همگی با استفاده از زبان‌های HTML و CSS در کنار جاوا اسکریپت ساخته می‌شوند.

کدهای زبان برنامه نویسی JavaScript چطور اجرا می‌شوند؟

اجرای کدهای جاوا اسکریپت در هر محیط اجرایی (مثل مرورگر یا یک محیط سمت سرور مانند Node.js) یک فرآیند چند مرحله‌ای دارد که همه موتورهای جاوا اسکریپت، با وجود تفاوت‌های داخلی، به طور کلی از این روند پیروی می‌کنند.

در آغاز، محیط اجرایی کد شما را به عنوان یک متن خام دریافت می‌کند. سپس وارد مرحله Parsing یا تجزیه می‌شود. در این مرحله، کل کد به‌طور کامل اسکن و به یک ساختار درختی به نام AST یا درخت نحو انتزاعی (Abstract Syntax Tree) تبدیل می‌شود. AST یا Abstract Syntax Tree یک ساختار درختی است که کد شما را به شکلی سازمان‌یافته و قابل فهم برای کامپیوتر نمایش می‌دهد. این ساختار نشان می‌دهد هر بخش از کد چه معنایی دارد و چطور به بخش‌های دیگر مرتبط است؛ در نتیجه معنای منطقی هر بخش از کد را برای موتور اجرای جاوا اسکریپت مشخص می‌کند.

بعد از Parsing، کدها وارد مرحله کامپایل می‌شوند. در اینجا، AST به یک قالب میانی (Intermediate Representation) یا بایت‌کد ترجمه می‌شود که بسیار سریع‌تر از متن خام جاوا اسکریپت قابل اجرا است. در واقع، سیستم یک نسخه کوچکتر و فشرده‌تر از برنامه شما را به کامپیوتر می‌دهد تا کامپیوتر بتواند آن را سریعتر و راحت‌تر آن را اجرا کند.

سپس وارد مرحله اجرا یا Execution می‌شویم. موتور جاوا اسکریپت، بایت‌کد را در یک چرخه پردازش (Execution Context) اجرا کرده و دستورات را خط به خط و بر اساس منطق برنامه انجام می‌دهد. متغیرها مقداردهی می‌شوند، توابع فراخوانی و نتیجه‌ها تولید می‌شوند.

در نهایت، برای مدیریت عملیات غیرهمزمان مانند رویدادها، درخواست‌های شبکه یا تایمرها، محیط اجرایی از مکانیزمی به نام Event Loop استفاده می‌کند. این مکانیزم اطمینان می‌دهد که پس از پایان دستورات همزمان، کدهای در صف، یکی پس از دیگری و بدون مسدود کردن روند اصلی، اجرا شوند.

به این ترتیب، هر بار که شما کدی در جاوا اسکریپت می‌نویسید، در پشت صحنه یک فرآیند دقیق و بهینه‌سازی شده از دریافت و Parsing تا Execution و اجرای دستورات غیرهمزمان، در محیط اجرایی اجرا می‌شود تا تعاملات و عناصر صفحه، تغییرات مورد نیاز را بدست آورند.

چطور از جاوا اسکریپت در طراحی سایت استفاده کنیم؟

برای استفاده از کدهای جاوا اسکریپت در یک صفحه وب، سه روش اصلی وجود دارد. در ادامه هر سه روش را به صورت کامل به همراه مثال بررسی می‌کنیم؛ اما قبل از آن، نگاهی به جدول زیر بیندازید که مقایسه‌ای بین روش‌های مختلف استفاده از جاوا اسکریپت در سایت دارد.

روش استفاده	توضیح کوتاه	مزایا	معایب
درون خطی (Inline JS)	کد جاوا اسکریپت مستقیماً در ویژگی عنصر HTML (مثل onclick) نوشته می‌شود.	ساده و سریع برای تست یا کدهای خیلی کوچک	نگهداری سخت، گیج کننده و زمان‌بر
داخلی با تگ <script>	کد جاوا اسکریپت داخل یک تگ <script> در همان صفحه HTML نوشته می‌شود.	ساختار منظم‌تر، مدیریت راحت‌تر نسبت به روش درون خطی	اگر کد زیاد باشد، فایل HTML شلوغ می‌شود
خارجی با فایل JS جدا	کدها در یک فایل .js ذخیره و به صفحه متصل می‌شوند.	جداسازی کامل کد و محتوا، قابلیت استفاده مجدد، نگهداری آسان	نیاز به درخواست HTTP اضافی (قابل جبران با فشرده‌سازی و کش)

استفاده از JS به صورت درون خطی

در این روش کد جاوا اسکریپت مستقیما درون یک عنصر HTML و معمولاً به شکل یک ویژگی (attribute) نوشته می‌شود. این روش برای کارهای بسیار ساده یا تست سریع کدها مناسب است؛ اما به دلیل نگهداری سخت، بهتر است از آن در پروژه‌های واقعی استفاده نشود!

برای استفاده از این روش، به شکل زیر عمل می‌کنیم:

1. انتخاب عنصر HTML که می‌خواهیم رویداد خاصی روی آن اجرا شود.
2. اضافه کردن یک رویداد (مثل onclick) در همان عنصر. به این ترتیب زمانی که روی عنصر مربوطه کلیک شود، کد جاوا اسکریپت اجرا خواهد شد.
3. نوشتن کد جاوا اسکریپت به‌صورت مستقیم داخل همان عنصر

برای درک بهتر، کد زیر را مشاهده کنید:

<button onclick="alert ('Hello!')"> Click me </button>

در کد بالا، ابتدا یک عنصر دکمه با متن Click me ایجاد کردیم. سپس ویژگی onclick را به آن اضافه کردیم و با استفاده از دستور Alert که برای نمایش پیام در کادری بالای صفحه مورداستفاده قرار می‌گیرد، متن Hello! را نمایش دادیم. به این صورت زمانی که کاربر روی دکمه کلیک کند، یک پنجره کوچک در بالای صفحه ظاهر شده و عبارت Hello! را نمایش می‌دهد.

استفاده داخلی با عنصر Script

اما اگر نخواهیم کدهای جاوا اسکریپت را در همان عنصر بنویسیم چه؟ در این حالت، می‌توانیم یک عنصر از نوع script در صفحه بنویسیم و کدهای جاوا اسکریپت خود را در آن قرار دهیم. البته در این حالت، باید مقدار onclick در عنصر HTML یک نام مشخص داشته باشد. برای این کار، مشابه زیر عمل می‌کنیم:

<button onclick="showMessage()"> Click me </button>
<script>
  function showMessage() {
    alert (‘Hello!’);
  }
</script>

در این کد، ابتدا یک دکمه با متن Click me ایجاد کردیم. در ادامه، از ویژگی onclick استفاده کردیم و این بار، دستور showMessage() را درون آن قرار دادیم. مقدار showMessage() اشاره به یک تابع به همین نام دارد که آن را در عنصر script تعریف کرده‌ایم.

از نظر کاربران سایت، این دو تفاوت خاصی ندارند و هر دو یک کار را انجام می‌دهند؛ اما اگر بخواهید از دید یک برنامه نویس به قضیه نگاه کنید، روش دوم گزینه بهتری برای توسعه و بهبود کد در آینده است!

فراخوانی فایل اسکریپت خارجی در صفحه

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

در این روش، کدهای جاوا اسکریپت در یک فایل جداگانه با پسوند .js قرار می‌گیرند و از طریق عنصر <script> و ویژگی src به صفحه HTML متصل می‌شوند. این شیوه برای پروژه‌های واقعی و صفحات بزرگ بسیار مناسب است؛ زیرا باعث مرتب‌سازی کدها، نگهداری و ویرایش راحت، امکان استفاده مجدد از کد و کاهش زمان بارگیری صفحه در مرورگر کاربر می‌شود! علاوه بر این، امکان ایجاد تاخیر در بارگیری صفحاتی که کاربر در ابتدای ورود به صفحه، نیاز به آنها ندارد نیز فراهم می‌شود؛ بدون تداخل با سایر دستوراتی که لازم هستند!

برای استفاده از روش فراخوانی فایل اسکریپت خارجی، مراحل زیر را انجام می‌دهیم:

1. ایجاد یک فایل جداگانه با پسوند .js (مثل script.js)
2. نوشتن کدهای جاوا اسکریپت در این فایل
3. اضافه کردن عنصر <script> با ویژگی src در فایل HTML برای اتصال فایل جاوا اسکریپت

نمونه عملی این روش چیزی مشابه زیر خواهد بود:

کدهای HTML:

<button onclick="showMessage()"> Click me </button>
<script src="script.js"> </script>

کدهای درون فایل خارجی جاوا اسکریپت:

function showMessage() {
  alert ('Hello!');
}

همان کار، همان عملکرد و همان چیزی که کاربر در ابتدا می‌بیند؛ با این تفاوت که در پشت صحنه، فقط توسعه دهنده و مرورگر می‌دانند چه اتفاقی در حال رخ دادن است!

البته در مواردی ممکن است در مرورگر شما پیغامی مبنی بر “عدم فعالسازی جاوا اسکریپت در مرورگر” نمایش داده شود. این پیغام دو دلیل اصلی دارد:

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

در صورت مشاهده این مشکل می‌توانید به صفحه چگونه جاوا اسکریپت را فعال کنیم؟ مراجعه کنید.

مسیر یادگیری JS از صفر مطلق تا متخصص

اما برای تبدیل شدن به یک متخصص برنامه نویسی جاوا اسکریپت، باید چه مهارت‌هایی کسب کنیم؟ تصویر زیر، یک راهنمای قدم به قدم برای تبدیل شدن به یک برنامه نویس حرفه‌ای JS را نشان می‌دهد.

1. آشنایی با مفاهیم برنامه نویسی و توسعه وب
2. یادگیری زبان‌های HTML و CSS به همراه مباحثی مثل Flexbox و CSS Grid
3. یادگیری زبان برنامه نویسی جاوا اسکریپت
4. یادگیری فریمورک‌های CSS نظیر Tailwind و Bootstrap
5. یادگیری تکنولوژی‌های توسعه فرانت اند (مثل React، Vue یا Angular)
6. پیشرفته‌تر شدن در مسیر جاوااسکریپت با تکنولوژی‌هایی مانند:

• TypeScript
• Redux یا سایر State Management ها
• Next.js یا Nuxt.js (برای توسعه پیشرفته‌تر اپلیکیشن‌ها) و…

این مسیر یادگیری، چیزی است که شما را به یک توسعه دهنده حرفه‌ای و کاربلد فرانت اند تبدیل می‌کند؛ اما بدون تمرین و پشتکار کافی، بهتر است کلا این روند را شروع نکنید! برنامه نویسی بدون علاقه و بدون پشتکار، چیزی جز تلف کردن زمان نیست؛ اما اگر این دو را در کنار تمرین مداوم داشته باشید، می‌توانید خود را به عنوان یک توسعه دهنده حرفه‌ای جاوا اسکریپت ببینید که فرصت‌های شغلی عالی را تصاحب می‌کند!

آنچه در این مطلب خواندیم و یاد گرفتیم…

زبان برنامه نویسی جاوا اسکریپت یا به اختصار JS، یک زبان برنامه نویسی سطح بالا، داینامیک، چندمنظوره و کراس پلتفرم است که در ابتدا برای توسعه وب به وجود آمد. با بزرگ شدن جامعه کاربری جاوا اسکریپت، ابزارها و فریمورک‌های متعددی برای آن ایجاد شد که آن را از یک زبان اسکریپت نویسی، به یک زبان برنامه نویسی کامل و قدرتمند تبدیل کرد. جاوا اسکریپت در سال‌های 2013 تا 2021 به عنوان پراستفاده‌ترین زبان برنامه نویسی (طبق نظرسنجی‌های سالیانه سایت Stack Overflow) شناخته شد و به طور گسترده در توسعه وب، بازی‌سازی، امنیت و توسعه نرم افزارهای دسکتاپ و موبایل کاربرد دارد.

در صورت تمایل به یادگیری این مهارت ارزشمند و آینده‌دار، می‌توانید در دوره جامع آموزش جاوا اسکریپت در سایت سبزلرن شرکت کنید!