جاوا اسکریپت چگونه کار می‌کند؟ | بررسی کامل

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

برای مقایسه بین single thread با Multi Thread، می‌توان گفت که در ویندوز شما می‌توانید به‌طور همزمان هم مرورگر خود را باز کنید و هم در فتوشاپ مشغول به‌کار شوید؛ اما در برنامه‌های سینگل تردز رفتار برنامه متفاوت است و فقط یک کار انجام می‌شود؛ یعنی اگر در حال حاضر وظیفه برنامه جمع چند عدد است، این برنامه فقط به‌همین کار مشغول می‌شود.

نحوه اجرای جاوا اسکریپت در مرورگر

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

Javascript در مرورگر به‌همین شکل عمل می‌کند. وقتی در قسمت هدر بخشی برای ورود و عضویت و در فوتر صفحه بخشی به‌نام خبرخوان قرار می‌دهیم، کدهای html این دو بخش، تقریبا مشابه است؛ ولی کدهای اسکریپت javascript متفاوت است.

فرض کنیم کاربر قرار است در خبرخوان ثبت‌نام کند. ما اول به‌کمک زبان نشانه‌گذاری html یک input برای وارد کردن ایمیل و یک submit برای ارسال پیام کاربر به سمت سرور قرار می‌دهیم. وقتی کاربر روی دکمه submit کلیک می‌کند، فقط کدهای java script مربوط به قسمت خبرخوان فراخوانی می‌شود. در این مرحله کدهای مربوط به ورود یا عضویت کاربر در حالت غیرفعال باقی می‌مانند تا ایمیل کاربر به بخش مدنظر منتقل شود.

کاربرد جاوا اسکریپت

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

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

آشنایی با موتور جاوا اسکریپت و انواع آن

قبل از شروع و کار روی آموزش جاوا اسکریپت بهتر است با موتور این زبان آشنا شوید. وظیفه موتور java script تفسیر و اجرای کدها است. در هر مرورگر، یک موتور وجود دارد. انواع موتورها عبارتند از:

• 8 در گوگل کروم
• در موزیلا فایرفاکس
• چاکرا در اینترنت اکسپلورر
• در سافاری

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

راه‌های بهینه‌سازی کدهای جاوا اسکریپت

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

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

آموزش ساخت یک فایل جاوا اسکریپت

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

• html
• css
• js
• php
• و غیره

هر کدی که در زبان برنامهنویسی جاوا اسکریپت نوشته می‌شود، یک رشته یا string است. اگر می‌خواهید یک رشته یا حتی متد برپایۀ js در پروژه جاوا اسکریپت بنویسید، دو راه وجود دارد. در پروژه‌هایی که تعداد کدهای html، css و js بسیار زیاد است، از راه اول استفاده نمی‌شود و حتی توصیه می‌شود که استفاده نکنید. با این وجود ما هر دو راه را آموزش می‌دهیم.

راه اول: استفاده از کدهای جاوا اسکریپت در فایل html

در css، ما مقدار و پراپرتی سلکتورها را درون پرانتز قرار می‌دهیم.

selector   {

Property: value;

{

اما شکل کدها در html نسبت به css متفاوت است. در html از علامت‌های بزرگتر و کوچکتر استفاده می‌شود. به عنوان نمونه می‌توان گفت:

<html>

کدهای شما

</html>

اگر شما قبل از یادگیری JS، اچ‌تی‌ام‌ال و css یاد گرفته باشید، می‌توانید به‌کمک نرم‌افزارهایی چون Visual Studio Code یک فایل html ایجاد کنید. برای اضافه کردن کد جاوا اسکریپت در فایل html، در قسمت body، یک دستور به‌نام script ایجاد می‌کنیم:

<html>

<body>

<script>

//کدهای اسکریپت در این قسمت قرار می‌گیرد.//

</script>

</body>

</html>

راه دوم: لینک دادن به یک فایل دیگر

راه دوم نسبت به راه اول متداول‌تر است. دلایل آن هم می‌توان به تمیز بودن کد بعد از اتمام پروژه، سبک بودن فایل html و سرعت لود بهتر سایت بعد از نصب قالب باشد؛ اما چگونه در فایل html، به فایل js لینک بدهیم؟ لینک‌دهی در html، از 3 راه rel، href و src رقم می‌خورد.  اگر می‌خواهید به فایل اسکریپتی لینک دهید، باید از دستور src استفاده کنید. در ادامه شما را با نحوه کار جاوا اسکریپت آشنا می‌کنیم.

 کد زیر را در نظر بگیرید:

<html>

<body>

<script src=”project-name.js”>

</script>

</body>

</html>

از src برای لینک دادن به فایل دیگر استفاده می‌شود. اگر شما یک پوشه js ایجاد کرده‌اید و درون آن فایلی با نام header.js ساخته‌اید، در قسمت src برای لینک‌دهی، باید js/ هم اضافه کنید.

<script src=”js/header.js”></script>

ممکن است شکل پوشه‌های پروژه شما، html، css و js باشد و اگر می‌خواهید از پوشه html برگردید و به پوشه js بروید، برای لینک دادن، باید قبل از نام فایل، .../js اضافه کنید.

<script src=”…/js/header.js”> </script>

از کجا آموزش جاوا اسکریپت ببینیم؟

برای تهیه‌ دوره‌های آموزشی جاوا اسکریپت اول باید به‌دنبال یک مدرس مسلط به js پیدا کنید تا بتواند آموزش کامل کار با جاوا اسکریپت را در اختیار هنرجو قرار دهد.

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

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