وب

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

برنامه ی “Hello, World!” یک سنت کلاسیک و با سابقه در برنامه نویسی کامپیوتر است. یک برنامه کوتاه و کامل برای مبتدیان است و یک راه خوب نیز هست برای اطمینان از این که محیط به درستی پیکربندی شده است.(توصیه می شود دوره آموزشی طراحی سایت و پکیج آموزش طراحی سایت  را مشاهده کنید)

این مقاله برای ایجاد این برنامه در جاوا اسکریپت به شما کمک می کند. با این حال، برای ایجاد برنامه ای جالب تر، برنامه ی سنتی را تغییر خواهیم داد تا کاربر را به نام خود فرا بخواند. سپس از نام کاربر در متن خوش آمد گویی استفاده خواهیم کرد. در پایان این آموزش، یک برنامه ی “Hello, World!” تعاملی خواهید داشت.

پیش نیازها

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

ایجاد برنامه ی “Hello, World!”

برای نوشتن برنامه ی “Hello, World!”، ابتدا کنسول جاوا اسکریپت مرورگر مورد نظر خود را باز کنید.

دو روش اصلی وجود دارد که می توانیم برنامه ی “Hello, World!” را در جاوا اسکریپت ایجاد کنیم: با روش و با روش console.log.

نوشتن برنامه ی جاوا اسکریپت با استفاده از روش() alert

اولين روشي که مي توانيم اين برنامه را بنويسيم استفاده از روش ()alert است که یک پنجره یا باکس هشدار را بر روي پنجره ی فعلي شما نمایش می دهد که حاوی يک پيام مشخص (در اين مورد، “Hello, World!”) است و یک دکمه ای OK است که کاربر را قادر می سازد با استفاده از آن، پنجره ی هشدار را ببندد.

در این روش، نوع داده ی رشته را به عنوان پارامتر انتقال خواهیم داد. این رشته بر  اساس مقدار Hello, World! تنظیم خواهد شد! به طوری که این مقدار در باکس هشدار چاپ می شود.

برای نوشتن این سبک اول از برنامه ی “Hello, World!” ، رشته ای را درون پرانتز روش alert() قرار می دهیم. و عبارت جاوا اسکریپت خود را با یک نقطه ویرگول یا همان سمیکولون ; پایان می دهیم.

هنگامی که کلید ENTER را در خط بعدی کد جاوا اسکریپت خود فشار می دهید، باید هشدار زیر را در مرورگر خود ببینید:

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

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

هشدار های پاپ آپ که نیاز به کلیک دارند، می توانند خسته کننده باشند، پس بیایید در مورد چگونگی ایجاد همین برنامه با استفاده از console.log() بحث کنیم.

نوشتن برنامه ی جاوا اسکریپت با استفاده از روش() console.log

با استفاده از روش console.log() می توانیم همان رشته را چاپ کنیم. با استفاده از این گزینه شبیه به کار با زبان برنامه نویسی در محیط ترمینال کامپیوتر شما است.

به همان صورتی که با روش alert() کار کردیم، در این روش نیز رشته ی “Hello, World!” را درون پرانتز alert() وارد می کنیم. و سپس عبارت خود را با یک سمیکولون به پایان می رسانیم، که بر اساس دستورالعمل های معمول سینتکس جاوا اسکریپت است.

هنگامی که Enter را فشار دهیم، پیام “Hello, World!” در کنسول چاپ می شود:

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

فراخوانی برای ورودی

هنگامی که برنامه ی “Hello, World!” را اجرا می کنیم، همان خروجی تولید می شود. اما در این مرحله از فردی که برنامه را اجرا می کنند می خواهیم که نام خود را وارد کند. سپس می توانیم از آن نام برای سفارشی سازی خروجی استفاده کنیم.

در هر کدام از روش های جاوا اسکریپت که در بالا استفاده شد، می توانیم با یک خط برای درخواست ورودی شروع کنیم. در این جا از روش prompt() جاوا اسکریپت و رشته ی “What is your name?”  استفاده خواهیم کرد تا از کاربر بخواهیم نام خود را وارد کند. ورودی که توسط کاربر وارد می شود، در نام متغیر / variable name ذخیره می شود.

هنگامی که برای اجرای این خط از کد، ENTER را فشار دهید، یک پاپ آپ به صورت زیر دریافت خواهید کرد:

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

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

باید به این نکته ی مهم توجه کرد که از روش prompt() جاوا اسکریپت تنها زمانی استفاده شود که در چارچوب برنامه، معنا دارد باشد، زیرا استفاده ی بیش از حد از آن می تواند برای کاربر خسته کننده شود.

در این مرحله، نامی را که می خواهید وارد کنید. برای این مثال، از نام Sammy استفاده خواهیم کرد.

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

سپس می توانیم این عبارت را به روش ()alert منتقل کنیم.

هنگام فشردن Enter، کادر محاوره ای زیر را بر روی صفحه دریافت می کنیم:

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

در روش console.log() نیز از همان ترکیب رشته ها برای ترکیب Hello و نام متغیر استفاده می کنیم:

کل این عبارت در داخل پرانتزهای روش console.log() قرار می گیرد:

در این حالت که نام کاربر Sammy در نظر گرفته شده، خروجی در کنسول به صورت زیر خواهد بود:

اکنون شما یک برنامه جاوا اسکریپت دارید که از یک کاربر ورودی را دریافت می کند و آن را بر روی صفحه نمایش می دهد.

نتیجه گیری

حالا شما می دانید که چگونه برنامه ی کلاسیک “Hello, World!” را در جاوا اسکریپت بنویسید. به صورتی که از کاربر اطلاعات ورودی دریافت کنید و آن را به عنوان خروجی نمایش دهید، حتی می توانید برنامه ی خود را گسترش دهید. به عنوان مثال، رنگ مورد علاقه ی کاربر را بپرسید و همان رنگ را در یک جمله بندی ترکیبی از رشته ها، بر روی صفحه نمایش دهید.

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

همچنین ببینید
بستن
دکمه بازگشت به بالا