Function
Function
ก็คือคำสั่งต่างๆใน JavaScript นั่นเอง ซึ่ง Function อาจจะเป็นคำสั่งหลายๆคำสั่งที่เราเรียบเรียงขึ้นเอง
แล้วกำหนดให้มันเป็น Function ก็ได้ Function ใน JavaScript ก็มีอยู่
2 แบบคือ สามารถคืนค่ากลับมาในรูปของ ตัวแปรได้ เช่น factorial() (ผมสมมุติเองนะ
ถ้าจะใช้ต้องเขียนเอง)ที่ใช้ในการคูณเลขจาก 1ถึง n และ Function ที่ไม่คืนค่ากลับเช่น
Function showdata() (เหมือนกันครับ function สมมุติ) ที่ใช้ในการแสดงข้อมูลบนหน้าจอ
- การเรียกใช้ Function
- การประกาศ Function
- การประกาศ Function ที่มีจำนวนพารามิเตอร์ไม่คงที่
- Return Statement
- ตัวแปรแบบ Global and Local
การเรียกใช้
Function
ถ้าเป็น
Function ที่คืนค่าได้ เราก็มองว่ามันเป็นตัวแปรตัวหนึ่ง ที่เก็บค่าๆหนึ่งอยู่ได้เลย
เช่น
n = factorial(5) ;
จากตัวอย่าง เราเรียกใช้ Function factorial โดยใส่
Input 1 ตัวคือ 5 แล้วเอาค่าไปเก็บในตัวแปร n ส่วน factorial() นั้นเป็น
Function ที่ไม่มีอยู่ใน JavaScript นะครับ ดังนั้นเราก็จะต้องเขียน
Function ขึ้นมาใช้เองครับ ส่วน Function ที่ไม่คืนค่าเราก็เรียกใช้ได้ตรงๆเลยเช่น
display("Hello");
<< Back
:: ^ top ^
การประกาศ
Function
ที่ผ่านมาหลายคนคงสงสัยว่า การเขียน Function ทำอย่างไร ใน Section
นี้จะสอนให้คุณสามารถเขียน Function ขึ้นมาใช้เองได้ครับ
การเขียน Function ขึ้นมาใช้เองเราควรเขียนไว้ที่ส่วน Head ของ HTML
และเรียกใช้ ในส่วนของ Body นะครับ เพื่อป้องกันการเกิด error ที่เกิดจากการเรียกใช้
Function ก่อน ที่จะประกาศ Function ซึ่งขณะนั้น Browser ยังไม่รู้จัก
การประกาศ Function มีรูปแบบดังนี้ครับ
functionname
ก็คือชื่อ function ที่คุณตั้งเอง p1,p2,..pn ก็คือ Parameter หรือ
Input ที่ใส่ลงไปใน Function ซึ่งจะมีกี่ตัวก็ได้ หรือไม่มีก็ได้ ตัวอย่างการเรียกใช้
Function ครับ
 |
Pyayam.com :: พ ย า ย า ม ดอทคอม :: |
|
 FileEditFormatViewHelp |
<html>
<head>
<title>A function definition</title>
<script language="javascript">
<!--
function displaytagtext(tag,text)
{
document.write("<"+tag+">");
document.write(text);
document.write("</"+tag+">");
}
// -->
</script>
</head>
<body>
<script language="javascript">
<!--
displaytagtext("h1","This is a level
one heading");
displaytagtext("p","This is a first paragraph
of the document");
// -->
</script>
</body>
</html> |
|
ดูตัวอย่าง
จากตัวอย่าง
Function ที่ผมประกาศขึ้นก็คือ function displaytagtext() ซึ่งมี Input
2 ตัว คือ tag และ text Function จะรับ Input 2 ค่านี้ไปใช้กับ document.write()
ดังที่ได้ประกาศไว้ คือเขียน tag ลงไป เขียน text แล้วก็ปิดด้วย /tag
ผลที่ได้ก็จะเป็นการเขียนข้อความแล้ว คร่อมด้วย tag ที่กำหนด
<< Back
:: ^ top ^
การประกาศ
Function ที่มีจำนวนพารามิเตอร์ไม่คงที่
ทีนี้ถ้าคุณต้องการประกาศ Function แบบไม่จำกัดตัวแปรว่าต้องมีกี่ตัว
JavaScript ก็สามารถทำให้คุณได้ครับ โดย function นั้นจะมี Property
ที่ชื่อว่า argument เป็น Array ครับ Array ตัวนี้จะเป็นตัวเก็บข้อมูลของ
Parameter หรือ Input ที่ถูกใส่ให้กับตัวแปร เช่นถ้าผมเรียกใช้ function
f() ดังนี้
f("test",true,77);
เราก็จะมีข้อมูลใน
f.argument ดังนี้
Function
ต่อไปนี้จะเป็นการใช้ Parameter โดยอ่านค่าจาก Property argument ครับ
จากตัวอย่าง
ผมได้ค่าจำนวนตัวแปรจาก sum.argument.length ผมก็เลยนำมาวน loop ด้วย
statement for อ่านค่าตัวแปรทีละตัว แล้วเอามารวมกันในตัวแปร total
จากนั้นก็ ส่งค่ากลับด้วย statement return ที่จะสอนในหัวข้อต่อไปครับ
<< Back
:: ^ top ^
Return
Statement
ก็ได้ใช้ไปครั้งหนึ่งแล้วนะครับ Return เป็น Statement ครับแต่ผมสอนใน
บท Statement ไม่ได้ เนื่องจาก Return เป็น Statement ที่ใช้กับ Function
สำหรับ รูปแบบการใช้ Return ก็ใช้คำว่า return แล้วก็ตามด้วย ตัวแปรหรือค่าที่จะส่ง
กลับจาก Function
return variable;
หลังจาก
return ทำงาน Function นั้นจะถือว่าจบการทำงานโดยไม่สนใจ ชุดคำสั่งถัดไปใน
Function นั้น
<< Back
:: ^ top ^
ตัวแปรแบบ
Global and Local
 ในการประกาศตัวแปรตัวหนึ่งขึ้นมาใช้เนี่ย
มันจะเปลืองหน่วยความจำไปส่วนหนึ่ง สำหรับเก็บค่าตัวแปร ดังนั้นถ้าเราประกาศตัวแปรแบบธรรมดา
แล้วเอาไปใช้แค่ใน function ตัวหนึ่ง มันจะเป็นการสิ้นเปลื่องโดยใช่เหตุ
ดังนั้นคุณควรประกาศตัวแปรใช้เฉพาะ ภายใน function เมื่อ function
จบการทำงานตัวแปรพวกนี้จะถูกลบออกไปจากหน่วยความจำทันที ประโยชน์อีกอย่างหนึ่งของ
Local Variable ก็คือ ส่วนอื่นๆของ โปรแกรมจะไม่รู้จัก Local Variable
ที่อยู่ใน Function เลย ดังนั้นคุณก็สามารถใช้ตัวแปรชื่อเดียวกันได้พร้อมกันในคนละส่วนของโปรแกรม
โดยไม่เกิด error ส่วน ใน main Program เราก็ต้องใช้ตัวแปร Global
อยู่แล้วครับ Global Variable เนี่ยจะเป็นที่รู้จักไปทั้งโปรแกรมดังนั้น
function ต่างๆก็สามารถเรียกใช้ได้ด้วยครับ
ตัวอย่างการใช้
Global and Local Variable ครับ
|
Pyayam.com :: พ ย า ย า ม ดอทคอม :: |
|
| FileEditFormatViewHelp |
<html>
<head>
<title>Global and Local Variables
</title>
<script language="javascript">
<!--
function displaySquared(y)
{
var x = y*y
document.write(x+"<br>")
}
// -->
</script>
</head>
<body>
<script language="javascript">
<!--
for (x=0;x<10;++x)
displaySquared(x)
// -->
</script>
</body>
</html>
|
|
ดูตัวอย่าง
<< Back
:: ^ top ^
|
: HOT
Free : มุขตลก
: บทกลอน : ดูดวง
: บริการออกแบบเว็บครบวงจร
: การสร้างเว็บ : เกร็ดความรู้
: เว็บบอร์ด : เกี่ยวกับเว็บ
: 
BASIC