توابع در JavaScript
یک تابع شامل کدهایی است که بوسیله یک رویداد(مثل onclick) یا صدا زدن، اجرا خواهد شد.
یک تابع از هر جایی در صفحه ممکن است فراخوانی شود (یا حتی از صفحات دیگر، اگر تابع در یک فایل خارجی با پسوند "js." تعریف شده باشد)
توابع در هر دو قسمت "<head>" و یا "<body>" می تواند تعریف شود. اما برای اطمینان از اینکه، قبل از فراخوانی، توسط مرورگر خوانده و بارگذاری شود بهتر است آنرا در قسمت <head> قرار دهید.
نحوه استفاده:
{
some code
}
پارامترهای var2 ,var1 و … متغیرها یا مقادیری هستند که به داخل تابع فرستاده می شوند. "}" و "{" شروع و پایان یک تابع را تعیین می کنند.
توجه: برای تابعی که پارامتر ندارد باید بعد از نام تابع از پرانتز باز و بسته "()" استفاده شود.
توجه: فراموش نکنید که JavaScript به حروف بزرگ وکوچک حساس است! کلمه ی function باید با حروف کوچک نوشته شود وگرنه پیغام خطا صادر می شود. همچنین اسم تابع برای فراخوانی، باید دقیقا به همان شکلی که تعریف شده است نوشته شود.
مثال (توابع در JavaScript)
<head>
<script type="text/javascript">
function displaymessage()
{
alert("Hello World!");
}
</script>
</head>
<body>
<form>
<input type="button" value="Click me!" onclick="displaymessage()" />
</form>
</body>
</html>
اگر خط (alert("Hello World در مثال بالا داخل تابع قرار نگرفته بود، این خط با بارگذاری صفحه اجرا می شد. حالا کاربر باید دکمه "Click me" را فشار دهد تا اسکریپت اجرا شود.
یک رویداد onclick را به دکمه "Click me" برای اجرای تابع ()displaymessage اضافه می کنیم تا با کلیک بر روی آن تابع فراخوانی شود.
در فصل های آینده، در مورد رویدادهای JavaScript بیشتر خواهید آموخت.
دستور return
دستور return برای برگداندن یک مقدار مشخص در توابع، استفاده می شود.
در مثال زیر، حاصلضرب دو عدد a و b برگردانده می شود:
مثال (توابع در JavaScript)
<head>
<script type="text/javascript">
function product(a,b)
{
return a*b;
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(product(4,3));
</script>
</body>
</html>
عمر متغیرهای JavaScript
زمانی که توسط کلمه کلیدی "var" یک متغیر را داخل تابع اعلان می کنید، تنها در محدوده همان تابع به متغیر دسترسی وجود دارد. زمانی که از تابع خارج می شوید متغیر مورد نظر از بین می رود. به این متغیرها، متغیرهای محلی می گویند. می توانید چندین متغیر محلی با یک نام را داخل توابع مختلف استفاده کنید. زیرا هر متغیر محلی تنها از طریق تابعش شناخته می شود.
زمانی که شما یک متغیر را خارج از تابع تعریف می کنید، همه ی توابع داخل آن صفحه به آن دسترسی دارند. عمر این متغیرها از زمانی که تعریف می شوند شروع می شود و زمانی که صفحه بسته می شود پایان می یابد.
تابعی با یک پارامتر
این مثال نشان می دهد که چگونه یک مقدار را به یک تابع بفرستیم و از آن در تابع استفاده کنیم.
تابعی که یک مقدار را برمی گرداند
این مثال نشان می دهد که چگونه یک مقدار را توسط یک تابع برگردانیم.
An embedded page on this page says
میشه بفرمایید از کجا اومده؟
میخواستم بدونم نحوه ایجاد یک فایل جاوا اسکریپت خارجی و ساختار اون فایل به چه صورت میباشد ؟
با تشکر
1- نرم افزار NotePad یا +NotePad را باز کنید و کدهای جاوااسکریپت را داخل آن قرار دهید.
2- فایل را با پسوند js. ذخیره کنید.
3- با استفاده از کد زیر فایل بالا را به صفحه وبتان لینک کنید:
[dir=#555]<script src="/js/yourfile.js" type="text/javascript"></script>[/dir]
ممنون از سایت خوبتون
توابعی که مثل زیر تعریف میشن مال چین؟
[dir=#555]var myFunction = function namedFunction(){
statements
}[/dir]
ممنون
[dir=#555]var functionOne = function() {
// Some code
};[/dir]
[dir=#555]function functionTwo() {
// Some code
}[/dir]
تفاوت بین دو روش بالا در این است که functionOne یک عبارت است و تنها زمانی که به خط اش می رسیم اجرا می شود. اما functionTwo تابعی است که در هر جایی از برنامه می تواند صدا زده شده و اجرا شود.
به دو مثال زیر و خرجی آنها توجه فرمایید:
مثال 1:
[dir=#555]functionOne();
var functionOne = function() {
console.log("Hello!");
};[/dir]
خروجی:
[dir=#555]{
Error: "message": "Uncaught TypeError: functionOne is not a function",
"filename": "https://stacksnippets.net/js",
"lineno": 14,
"colno": 1
}[/dir]
مثال 2:
[dir=#555]functionTwo();
function functionTwo() {
console.log("Hello!");
}[/dir]
خروجی:
[dir=#555]Hello![/dir]
میخواستم بدونم که اگه بخوام ورودی از کاربر بگیرم و اون رو به تابع بفرستم که جمعشون کنه چی باید بنویسم؟
با getelementbyid چطوریه؟
اگه ممکنه یه مثال بنویسین
n2 <input type = "number" id = "n2" value="20" />
<button onclick="sum()">Try it</button>
<p id="demo2">Result...</p>
<script type="text/javascript">
function sum()
{
var fn, ln, result;
fn = parseInt(document.getElementById("n1").value, 10);
ln = parseInt(document.getElementById("n2").value, 10);
result = (fn+ln);
document.getElementById("demo2").innerHTML = result;
}
</script>[/dir]
این parseInt دقیقا چیکار داره میکنه؟
برای اینکه دریافتی از کاربر عدد باشه نه رشته استفاده شده؟
توضیحات مربوط بهش رو خوندم نفهمیدم
اگه بخواهیم بعد از ورود کاربر به سایت، نام کاربر رو بگیریم و با نامش بهش خوش امد بگیم کدش چجوری میشه؟
من فیلم های اموزشی شمارو در مورد طراحی سایت زبان html و css رو خریدم از سایتتون و خوندم خوب بودش و تاحد زیادی درکشون کردم ولی جاوا اسکریپت واقعا گیج کننده است واسه من اصلا نمیتونم روش کار باهاش رو یاد بگیرم.خواهش اگر فیلم آموزش JavaScript رو دارید، لینک خریدش رو اعلام کنید.
ممنونم
فیلم آموزش مقدماتی تا پیشرفته JavaScript:
beyamooz.com/product/javascript/%D9%81%DB%8C%D9%84%D9%85-%D8%A2%D9%85%D9%88%D8%B2%D8%B4-javascript
مثلا من تابعی را نوشتم در جاوا اما به دلیل وجود flexslider عمل نمیکرد !
در هیچ زبان برنامه نویسی نمیشه دو تابع با یک نام تعریف کرد.
خطای conflict به شما میده.
ولی امکان تعریف یک تابع به صورتی که آرگومانهای مختلفی بگیره هست!!! که باید اون رو در حین تعریف تابع انجام بدید.
در مورد خطایی که فرمودید هم اینطوری نمیشه دقیق نظر داد، کد خودتون رو باید بذارید تا بشه خطایابی کرد.
[dir=#555]function m(){
var n=document.getElementById("sett");
n.style.transition="3s all";
n.style.position="absolute";
n.style.left="+20px";
}[/dir]
اگر امکانش هست کد کامل رو قرار بدید.
لطفا یه نمونه کد قرار بدید تا بشه گفت برای چی از این کاراکتر استفاده شده است.
به مثال زیر توجه کنید:
فرض کنید می خواهیم یک تابع بنویسیم به طوری که دو عدد را به آن بدهیم و تابع جمع این دو عدد را محاسبه کند و برای ما این جمع را برگرداند و در یک متغیر قرار دهد:
[dir=#555]function sum(a,b){
return a+b;
}
var c=sum(2,3);[/dir]
همان طور که در بالا مشاهده می کنید، یک تابع به نام sum ایجاد کرده ایم و برای این تابع دو پارامتر a و b را تعریف کرده ایم. این یعنی که این تابع در وقت فراخوانی، باید این دو مقدار را از کاربر دریافت کند و روی آنها عملیاتی انجام دهد. که در مثال بالا این تابع جمع دو پارامتر a و b را محاسبه می کند و آن را برمی گرداند.
در خط شماره 5 یک متغیر به نام c تعریف کرده ایم که مقدار برگشتی در آن قرار می گیرد. و در آخر نتیجه برابر با 5 خواهد بود.
در مورد قسمت دوم سوالتان مثال زیر را مشاهده کنید:
[dir=#555]var a=2;
var b=3;
function sum(){
return a+b;
}
var c=sum();[/dir]
همان طور که در مثال بالا مشاهده می کنید، با استفاده از متغیرهای عمومی aوb می توان تابع sum را بدون پارامترها ها بازسازی کرد.
چون که کد نوشته شده در بالا، امکان اجرا شدن در اینجا را نداشته، ما نمی تونستیم از کاربر مقادیر رو بگیریم. بنابراین مقادیر رو خودمون به متغیرها به صورت دستی دادیم. در مورد قسمت آخر صحبت های شما، بنده اطلاع ندارم.
beyamooz.com/try_it_yourself/tryit.php?filename=tryjs_function2
منظورم این است اگر خطایی به وجود آید چه طور به کاربر اعلام می شود در html,css مدیریت خطایی اصلن وجود نداشت!!
باید اشاره کرد که جاوا اسکریپت از مفسر جاوا اسکریپت استفاده می کند و نه از کامپایلر.
زبان جاوا اسکریپت از زبان EcmaScript گرفته شده است. توضیح در مورد ساختار این زبان از بحث ما خارج است.
توضیح Scope chain:
scope chain مبین داده ها، متغیرها و توابعی است که یک تابع یا متغیر به آن دستری دارد و چگونگی رفتار با آن را مشخص می کند. به طور کلی یک scope chain سراسری داریم که در حقیقت داخل document است و همه ی کد ها در قالب این بستر پیاده سازی می شوند. هر فراخوانی تابع scope chain خودش را دارد و هر بار که تابع فراخوانی می شود (یا جریان داخل تابع به راه می افتد) بستر اجرایی آن تابع داخل پشته مربوط به بستر ها قرار می کیرد و وقتی که اجرای تابع تمام شد از پشته خارج می شود. برخی از توابع در بستر سراسری قرار دارند مثل تابع alert که شما همیشه می تونید اون تابع را در هر تابع دیگه ای صدا بزنید. با این توضیحات دو تا مثال می زنیم تا بهتر روشن بشه:
[dir=#555]
//آغاز بلوک یک
{
function m(i){
......
......
......
return i*i
}
function b(){
.....
var a=m(5)
}
}
// پایان بلوک یک
[/dir]
در مثال بالا چون هر دو تابع داخل یک بلوک قرار دارند یعنی هر دو در یک scope chain هستند پس به راحتی می توانیم هر کدام را در دیگری صدا بزنیم. از این رو ما در تابع b تابع m را صدا می زنیم.
در مثال زیر اما نمی تونیم تابع m را صدا بزنیم چون در دو بلوک متفاوت هستند:
[dir=#555]//آغاز بلوک یک
}
function m(i){
.....
.....
return i*i
}
{
// پایان بلوک یک و آغاز بلوک دو
}
function b(){
......
.......
//نمی تونیم m را صدا بزنیم چون تو یک بلوک دیگه است و در حقیقت در یک scope chain دیگه قرار داره.
}
{
// پایان بلوک دو[/dir]
دقت کنید که سینتکس مربوط به صدا زدن یک تابع در تابع دیگه در مثال اول به کار برده شده است و فقط کافیه نام تابع را به همراه پارامترهاش بنویسید. و اگر تابع مقدار بر می گرداند آن را داخل یک متغیر ذخیره کنید
[dir=#555]var a = m(5);[/dir]
در مثال بالا، ما تابع m را با پارامتر 5 صدا می زنیم که پس از اجرا مقدار a معادل 25 می شود.
لطفا یه قسمت تشکر اضافه کنین اونطوری بهتر میشه تشکر کرد وفقط توی این قسمت پیشنهادا نوشته بشه
یه دنیا ممنون