جاوا اسکریپت چیست؟

بازدید: 1976 بازدید

جاوا اسکریپت چیست؟

 

برنامه نویسی وب

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

 

برنامه نویسی طرف Server و برنامه نویسی طرف Client

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

 

بیشتر بخوانید :     آموزش کامل جاوا اسکریپت صفر تا صد

 

جاوا اسکریپت

جاوا اسکریپت یکی از محبوبترین زبانهای مورد استفاده در برنامه نویسی وب است. از این زبان میتوان هم در برنامه نویسی طرف Server و هم در برنامه نویسی طرف Client استفاده کرد ولی معمولاً از آن در برنامه نویسی طرف Client استفاده میشود. دلیل این امر آن است که کدهای طرف Client بایستی توسط مرورگر وب اجرا شوند. در واقع، مرورگر وب باید قابلیت فهم دستورات زبان مورد استفاده را داشته باشد و از آنجا که هم Internet Explorer و هم Navigator Netscape که معروفترین مرورگرهای وب محسوب میشوند قابلیت درک دستورات این زبان را دارند، جاوا اسکریپت به راحتی توانسته است جای خود را به عنوان پرکاربردترین زبان برنامه نویسی طرفClient باز کند. در قسمتهای بعد با نحوه استفاده آن آشنا خواهیم شد.

 

قرار دادن کدهای جاوا اسکریپت در صفحات وب:

کدهای جاوااسکریپت همواره بین برچسبهای <script> و </script> قرار میگیرند. این کدها را میتوان در قسمت Head یا Body صفحه وب قرار داد. توابع جاوا اسکریپت معمولاً در قسمت Head تعریف میشوند. قطعه کد زیر تابعی به نام message را نشان میدهد که در قسمت Head تعریف شده است و به محض باز شدن صفحه فراخوانی شده و یک پیغام خوش آمدگویی را نمایش میدهد:

<html>
<head>
<script>
function message()
{
alert(” (“خوش آمدید
}
</script>
</head>
<body onLoad=”message()”>
</body>
</html>

 

قطعه کد زیر، همین کار را بدون استفاده از تابع انجام میدهد:

<html>
<body>
<script >
document.write(” (” خوش آمدید
</script>
</body>
</html>

 

تعریف متغیر:

در قطعه کد زیر، یک متغیر بنام name تعریف شده و چاپ شده است:

<html>
<body>
<p align=”right”> مثالی از تعریف متغیر </p>
<script>
var name = ” “جاوااسکریپت
document.write(name)
document.write(“<h1>”+name+”</h1>”)
</script>
</p>

</body>
</html>

توابع:

کد زیر یک تابع بدون پارامتر را نشان میدهد. این صفحه شامل یک دکمه است که به محض کلیک کاربر روی آن یک تابع بدون پارامتر بنام myFunction را که قرار است یک پیغام خوشآمدگویی چاپ کند، فراخوانی میکند:

<html>
<head>
<script>
function myfunction(txt)
{
alert(txt)
}
</script>
</head>
<body>
<form>
<input type=”button” onclick=”myfunction(‘ صبح بخیر !’)” value=” <“صبح
<input type=”button” onclick=”myfunction(‘ شب بخیر !’)” value=” <“شب
</form>
</body>
</html>

 

تابع با مقدار برگشتی:

قطعه کد زیر تابعی را نشان میدهد که یک رشته را باز میگرداند:

<html>
<head>
<script>
function myFunction()
{
return (” (“سلام
}
</script>
</head>
<body>
<script>
document.write(myFunction())
</script>
</body>
</html>

 

جاوا اسکریپت چیست؟
جاوا اسکریپت چیست؟

 

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

<html>
<head>
<script>
function total(numberA,numberB)
{
return numberA + numberB
}
</script>
</head>
<body>
<script>
document.write(total(2,3))
</script>
</body>
</html>

 

جملات شرطی:

دستور if :

قطعه کد زیر ساعت فعلی سیستم را بررسی کرده و در صورتیکه پیش از ساعت ۱۰ صبح باشد یک پیغام صبح بخیر چاپ میکند:

<html>
<body>
<script>
var d = new Date()
var time = d.getHours()
if (time < 10)
{
document.write(“<b> صبح بخیر !</b>”)
}
</script>
</body>
</html>

 

دستور if-else

در قطعه کد زیر زمان فعلی سیستم تست شده، اگر قبل از ساعت ۱۰ صبح باشد، یک پیغام صبح بخیر و در غیر اینصورت پیغام روز بخیر چاپ میشود:

<html>
<body>
<script>
var d = new Date()
var time = d.getHours()
if (time < 10)
{
document.write(“<b> صبح بخیر </b>”)
}
else
{
document.write(“<b> روز بخیر </b>”)
}
</script>
<p>

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

</p>
</body>
</html>

 

دستور switch :

در مثال زیر قسمت روز تاریخ فعلی سیستم که عددی بین ۰ تا ۶ است محاسبه شده و متناسب با روز هفته پیغامی چاپ شده است:

<html>
<body>
<script>
var d = new Date()
theDay=d.getDay()
switch (theDay)
{
case 5:
document.write(” (“بالاخره جمعه
break
case 6:
document.write(” (“آماده برای کار
break
case 4:
document.write(” (“فردا تعطیله
break
default:
document.write(” (“در انتظار پایان هفته
}
</script>
<p>

توجه کنید که عدد متناظر با روز یکشنبه ۰، عدد متناظر با دوشنبه ۱ و … است

</p>
</body>
</html>

 

دستور for :

در قطعه کد زیر با استفاده از یک دستور for اعداد ۰ تا ۵ چاپ شده است:

<html>
<body>
<script>
for (i = 0; i <= 5; i++)
{
document.write( i )
document.write(“<br>”)
}
</script>
</body>
</html>

 

دستور while

در قطعه کد زیر با استفاده از یک دستور while اعداد بین ۰ تا ۱۰ چاپ شده است:

<html>
<body>
<script>
i = 0
while (i <= 5)
{
document.write(“The number is ” + i)
document.write(“<br>”)
i++
}
</script>
</body>
</html>

 

 

در ادامه با ما همراه باشید…