تماس با ما

موبایل: 2565 038 0912

دفتر تهران: 2565 2842 021

دفتر گرگان: 2565 3233 017


معمولا در هر زبان برنامه نویسی، توابع (Functions) نقشی کلیدی در پیش برد اهداف برنامه نویس و تسهیل کدنویسی دارند، توابع به سان ماشین هایی هستند که هر بار با توجه به مواد اولیه، خروجی متفاوتی تولید می کنند، خوشبختانه این امر در جاوا اسکریپت (javascript) شباهت زیادی به دیگر زبان برنامه نویسی وب یعنی PHP دارد، این موضوع باعث می شود کاربرانی که با PHP آشنایی دارند، به راحتی بخش توابع در جاوا اسکریپت را فرا بگیرند، هر چند بهتر است ابتدا زبان های سمت کاربر را یاد بگیرید و سپس به برنامه نویسی سمت سرور بپردازید، به هر صورت در ادامه آموزش های مقدماتی جاوا اسکریپت، این بار به سراغ توابع رفته ایم.
تابع چیست و چه کاربردی دارد؟
اولین سوالی که ممکن است به ذهنتان برسد این است که اصلا تابع چیست و چه کاربردی دارد؟! پاسخ این است که توابع یا Functions بیشتر شبیه ماشین هایی هستند که با دستورالعملی ثابت، هر بار با توجه به ورودی که دریافت می کنند، خروجی متفاوت می دهند، مثلا در دنیای واقعی، دستگاه چاپی را تصور کنید، مسلما با توجه به رنگ ها، تنظیمات و داده هایی که تعیین می کنید، خروجی منحصر به فردی خواهید داشت! عملکرد توایع هم بی شباهت به این مثال نیست، در برنامه نویسی شرایطی پیش می آید که یک رفتار به تعداد خیلی زیاد ممکن است تکرار شود، مثلا یک فونت در صفحات مختلف تنظیم گردد، اگر بخواهیم هر بار تمام جزئیات را تک به تک برای هر صفحه بنویسیم، علاوه بر اینکه این کار وقت زیادی از ما می گیرد، باعث افزایش ضریب خطا و حجم صفحات می شود، از این رو، روش بهتر و حرفه ای تر آن است که یک بار الگویی را به شکل تابع بنویسیم و هر بار ورودی های متفاوت (یا مشابه) به آن بدهیم و خروجی دریافت کنیم.
شیوه نگارش یا syntax توابع در جاوا اسکریپت

همانطور که گفتیم، توابع در جاوا اسکریپت (javascript)، شباهت زیادی به PHP دارند، به این صورت که با عبارت function تعریف می شوند و مقادیری به عنوان آرگومان (آرگومان به زبان ساده یعنی همان ورودی هایی که به تابع داده می شود) می پذیرند، مثال زیر نحوه تعریف یک تابع ساده را در جاوا اسکریپت نشان می دهد.


<script type="text/javascript">
//<![CDATA[
function username (n,c){
    var name = 'نام شما: '+ n + '<br />';
    var country = 'کشور شما: '+ c + '<br />';
    var output = name + country;
    return output;    
}
document.write(username('admin','Iran'));
//]]>
</script>

توضیح:
- همانطور که ملاحظه می کنید، در این تابع دو آرگومان فرضی (n و c) به عنوان نام کاربر و کشور او دریافت می شود.
- سپس درون تابع، سه متغیر تعریف شده است با نام های name، country و output که در واقع نهایتا خروجی به صورت نام کاربر: مقادیر کشور کاربر: مقادیر ارسال می شود.
- در قسمت return، خروجی تابع تعیین می شود، در اینجا return متغیر output را که خود حاصل جمع دو متغیر name و country است، به عنوان خروجی تابع برمی گرداند.
- دقت کنید که توابع در جاوا اسکریپت باید حتما به صورت رویدادی فراخوانی شوند (مثلا onclick یا onload و...)، در حالت عادی وجود یک تابع در صفحه به خودی خود، کار خاصی انجام نمی دهد، در مثال بالا فراخوانی تابع با دستور document.write انجام شده است.
- پیش تر و در آموزش های قبلی، گفتیم که قسمت مربوطه به CDATA، برای جلوگیری از پردازش کدهای جاوا اسکریپت به شکل html و نامعتبر شدن کدنویسی از لحاظ سیستم اعتبار سنجی سایت w3c.org و سرویس های مشابه است.

نحوه فراخوانی توابع در جاوا اسکریپت

همانطور که در توضیحات بالا اشاره کردیم، توابع در جاوا اسکریپت بدون وجود رویداد ها، کاربردی ندارند، یک رویداد به معنی حالتی است که پس از وقوع آن، موتور تابع به حرکت می افتد، درست شبیه به استارت یک خودرو! در مثال زیر شیوه فراخوانی یک تابع را با دو رویداد پرکاربرد onclick و onload ملاحظه می کنید.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>نحوه فراخوانی توابع در جاوا اسکریپت</title>
<script type="text/javascript">
//<![CDATA[
function add (num1,num2){
    var output = num1 + num2;
    return document.write(output);    
}
//]]>
</script>
</head>
<body>
<a href="#" onclick="add(3,6);">برای دیدن نحوه عملکرد تابع در جاوا اسکریپت، کلیک کنید</a>
</body>
</html>

توضیح:
- تابع بالا با یک رویداد onclick اجرا می شود.
- دقت کنید که نحوه تعیین مقادیر در نوع رفتار تابع اثرگذار است، مثلا اگر کد بالا را به صورت زیر فراخوانی کنید، به جای جمع دو عدد، حاصل ترکیب آنها به صورت یک رشته نشان داده می شود.


//نمایش نتیجه به صورت یک رشته متنی
onclick="add('3','6');"
//نمایش نتیجه به صورت حاصل جمع دو عدد
onclick="add(3,6);"

در کد زیر، از رویداد onload برای فراخوانی یک تابع استفاده کرده ایم که می توانید پیش نمایشی از آن را نیز به صورت آنلاین مشاهده و بررسی کنید.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>وبگو | نحوه فراخوانی توابع در جاوا اسکریپت</title>
<!-- http://webgoo.ir -->
<style type="text/css">
body{
    font-family:Tahoma, Geneva, sans-serif;
    font-size:12px;
    direction:rtl;
}
</style>
<script type="text/javascript">
//<![CDATA[
function welcome (){
    var wel = 'این پیام با فراخوانی تابع در جاوا اسکریپت نشان داده می شود';
    var output = alert(wel);
    return output;    
}
//]]>
</script>
</head>
<body onload="welcome();">
تابع onload در تگ body تنظیم شده است.
<hr />
در این مثال، تابع فرضی welcome با رویداد onload اجرا و با دستور alert یک پیام به خروجی ارسال می شود.
</body>
</html>

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


سفارش طراحی سایت

سفارش طراحی سایت

google
yahoo
alexa
ebook
Baidu.com
Wikipedia
Blogger.com
Windows Live
Amazon.com
eBay
Bing
Ask
استانداری گلستان
f shdj, sefaresh, sefaresh .net, sefaresh.net, sthva, sthva nhj kj, sthva.kj, stthva.kj, xvhpd, آیفون, استفاده, اندروید, اپل, اپلیکیشن, اینترنت, باتری, بازار, خواهد, دستگاه, دوربین, سامسونگ, سفارش, سفارش دات نت, سفارش دات نت sefaresh.net, سفارش.نت, سیستم, طراح وب, طراحي وب سايت, طراحی, طراحی وب سایت, فناوری, مایکروسافت, موبایل, هوشمند, کاربران, کمپانی, گلکسی, گوشی, گوشی هوشمند, گوگل

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