ชนิดของข้อมูล
ในบทที่แล้วจะเห็นว่ามีการใช้ทั้งข้อความและตัวเลขในการเขียนโค้ด
ข้อมูลประกอบด้วยชนิดต่างๆมากมาย
เช่นข้อมูลที่เป็นตัวเลขก็ถือเป็นข้อมูลชนิด
ตัวเลข (number) ส่วนที่เห็นเป็นข้อความจะเรียกว่าเป็นข้อมูลชนิด
สายอักขระ (string)
การจะรู้ชนิดของข้อมูลทำได้โดยใช้คำสั่ง typeof
alert(typeof 1) // ได้ number
ชนิดของข้อมูลในจาวาสคริปต์โดยพื้นฐานแล้วมีดังนี้
| ชนิดข้อมูล |
ตัวอย่าง |
| number |
ตัวเลข |
1, 129.3 |
| string |
สายอักขระ |
"สวัสดี" |
| boolean |
บูล (จริง เท็จ) |
true, false |
| object |
ออบเจ็กต์ (แถวลำดับแบบจับคู่) |
{"a": 1, "b": 2}, console |
| function |
ฟังก์ชัน |
function(x){return x+1}, alert |
| undefined |
ไม่ได้นิยาม |
undefined |
นอกจากนี้ยังมีออบเจ็กต์ชนิดใหม่ที่เพิ่มเข้ามาใน ES6 ได้แก่ symbol กับ bigint ซึ่งจะเขียนถึงอีกทีในเนื้อหาส่วนของ ES6
ที่จริงแล้วจาวาสคริปต์เป็นภาษาที่ใช้แนวคิด
การเขียนโปรแกรมเชิงวัตถุ (object-oriented programming, ย่อว่า OOP)
หมายความว่าทุกสิ่งทุกอย่างในโปรแกรมเป็น
ออบเจ็กต์ (object)
หมายความว่า "วัตถุ" วัตถุจะประกอบไปด้วยส่วนประกอบต่างๆ
ซึ่งมีหน้าที่ต่างกันออกไป
ในหลายภาษาที่เป็นเชิงวัตถุนั้น ข้อมูลทุกชนิดจะถือว่าเป็นออบเจ็กต์ทั้งหมด
นั่นหมายความว่าทั้งจำนวนตัวเลขและสายอักขระหรือค่าความจริงเท็จเองก็จัดเป็นออบเจ็กต์ชนิดหนึ่งทั้งนั้น
แต่ในจาวาสคริปต์นั้นคำว่าออบเจ็กต์จะหมายถึงข้อมูลชนิด
ออบเจ็กต์ (object) เป็นข้อมูลชนิดหนึ่ง
ออบเจ็กต์ในจาวาสคริปต์นั้นจริงๆแล้วอาจเรียกได้อีกแบบว่าเป็นข้อมูลชนิด
"แถวลำดับแบบจับคู่" (associative array)
รายละเอียดเพิ่มเติมเรื่องออบเจ็กต์จะเขียนถึงใน
บทที่ ๙
ตอนนี้ขอแค่ให้เข้าใจคร่าวก่อนๆว่าในจาวาสคริปต์นั้นโดยหลักแบ่งชนิดข้อมูลออกเป็นแบบต่างๆดังนี้
ในบทนี้จะอธิบายข้อมูลแต่ละชนิดแบบคร่าวๆ แต่จะอธิบายลึกลงไปในบทถัดๆไป
การประกาศตัวแปร
ปกติแล้วในการเขียนโปรแกรม
ค่าของข้อมูลต่างๆจะถูกเก็บอยู่ในรูปของสิ่งที่เรียกว่า
"ตัวแปร" (variable)
คือการกำหนดชื่อขึ้นมาเพื่อแทนตัวเก็บค่าข้อมูล
การสร้างตัวแปรขึ้นมาเก็บข้อมูลทำได้โดยเขียนดังนี้
var ชื่อตัวแปร = ค่าตัวแปร;
เช่น สร้างตัวแปรชื่อ a ขึ้นมา ให้มีค่าเท่ากับ 1 ก็เขียนได้โดย
var a = 1;
ในจาวาสคริปต์เวลาประกาศตัวแปรจะใช้คำสั่ง var แบบนี้
ไม่ว่าจะเป็นข้อมูลชนิดไหนก็ใช้วิธีการประกาศโดยใช้ var
อย่างเดียวเหมือนกันหมด
เพียงแต่ว่า ที่จริงแล้วต่อให้ไม่ใช้ var
จะประกาศตัวแปรขึ้นมาลอยๆเลยก็ได้เหมือนกัน แต่จะมีผลกระทบบางอย่าง
เช่นเรื่องของขอบเขตของตัวแปร
เกี่ยวกับเรื่องนี้จะขอไปอธิบายเสริมอีกทีในหัวข้อเรื่องการสร้างฟังก์ชัน
สำหรับตอนนี้ขอให้เข้าใจไปก่อนว่าเวลาประกาศตัวแปร ทางที่ดีให้ใส่ var
ไว้เสมอดีกว่า
การประกาศตัวแปรนั้นจะประกาศด้วย var เอาไว้ก่อนแล้วค่อยป้อนค่าให้ทีหลังก็ได้
var a;
a = 1;
ตัวแปรที่เคยถูกประกาศไปแล้ว จะประกาศซ้ำก็ได้ หรือจะป้อนค่าทับลงไปโดยไม่ใช้ var
ใหม่ก็ได้ ถ้ามีการเขียนข้อมูลใหม่ใส่ตัวแปรที่เคยประกาศไว้
ข้อมูลเดิมจะถูกลบหายไป
var x = 1; // ประกาศตัวแปรและป้อนค่าให้ครั้งแรก
alert(x); // ได้ 1
x = "ไก่"; // ใส่ค่าใหม่ทับลงไป
alert(x); // ได้ ไก่
var x = "ไข่"; // ประกาศตัวแปรใหม่อีกรอบ ทับตัวแปรเดิม
alert(x); // ได้ ไข่
ข้อมูลใหม่ที่ใส่ลงไปก็ไม่จำเป็นต้องเป็นชนิดเดียวกับข้อมูลเดิมในตัวแปรด้วย
ไม่มีความจำเป็นต้องมีความเกี่ยวพันอะไรกัน
ถ้าเปรียบตัวแปรเป็นเหมือนเหมือนกล่องเก็บข้อมูล
การเอาตัวแปรเก่าไปใช้ใหม่ก็คือการโยนของเดิมออกจากกล่องแล้วใส่ของใหม่เข้าไปร่องรอยของเก่าก็ไม่เหลืออยู่
นอกจาก var แล้ว ใน ES6 ยังมีวิธีประกาศตัวแปรอีก ๒ แบบเพิ่มเข้ามา คือ const กับ
let ซึ่งจะไปกล่าวถึงอีกทีในส่วนเนื้อหา ES6
ข้อกำหนดเรื่องชื่อตัวแปร
ชื่อตัวแปรจะใช้เป็นคำอะไรก็ได้ โดยมีหลักทั่วไปดังนี้
- ไม่ขึ้นต้นด้วยตัวเลข แต่ใช้ตัวเลขในตำแหน่งอื่นที่ไม่ใช่ตัวแรกได้
-
ไม่ใช้สัญลักษณ์พิเศษ เช่น , & ^ % # @ ! ? ~ ` " ' / \ ( ) [ ] { }
- + * = ; :
- แต่ $ และ _ สามารถใช้ได้
- ตัวอักษรพิมพ์เล็กพิมพ์ใหญ่ถือเป็นคนละตัว
- ไม่ตรงกับคำสงวน
สัญลักษณ์เครื่องหมายต่างๆมักมีความหมายเดิมในตัวซึ่งทำหน้าที่บทบาทสำคัญในไวยากรณ์ภาษาอยู่แล้ว
จึงไม่สามารถนำมาตั้งชื่อตัวแปรได้
เพียงแต่พวกเครื่องหมายในภาษาไทยบางอย่างใช้ได้ เช่น ฯ และ ๆ แต่อย่าง ๛
(โคมูตร), ┼ (ตีนครุ), ๏ (ฟองมัน), ๚ (อังคั่นคู่) ก็จะใช้ไม่ได้
ส่วนพวกคำสงวนเองก็มักจะมีหน้าที่เฉพาะทางไวยากรณ์ในภาษา
จึงไม่สามารถนำมาใช้เป็นชื่อตัวแปรได้เช่นกัน
คำสงวนในจาวาสคริปต์มีดังนี้
asyncawaitbreakcasecatchclassconstcontinuedebuggerdefaultdeletedoelseexportextendsfinallyforfunctionifimportimplementsininstanceofinterfacenewpackageprivateprotectedpublicreturnsuperswitchthisthrowtrytypeofvarvoidwhilewithyield
พวกอักษรไทยก็สามารถใช้ได้เช่นกัน มีข้อดีคือมั่นใจได้ว่าไม่ตรงกับคำสงวนแน่นอน
แต่ข้อเสียคือหากอยู่ในสิ่งแวดล้อมที่ไม่รองรับยูนิโค้ดอาจทำให้ไม่ทำงานได้
เพียงแต่ข้อเสียนี้ไม่ค่อยมีปัญหาในปัจจุบันแล้ว อีกทั้งหากในหน้า html ได้ประกาศ
<meta charset="UTF-8" />
แล้วโดยทั่วไปจะเป็นการระบุชัดว่าต้องอ่านตัวหนังสือแบบยูนิโค้ด จึงไม่มีปัญหา
แต่หากไม่ใส่อาจมีปัญหาได้
อย่างไรก็ตาม
โดยธรรมเนียมปฏิบัติแล้วการตั้งชื่อตัวแปรเป็นอักษรอื่นนอกจากอักษรโรมันนั้นไม่เป็นที่นิยม
ดังนั้นในที่นี้ก็จะใช้อักษรโรมันล้วนในการตั้งชื่อตัวแปรเช่นกัน
ตัวอย่างการประกาศตัวแปรที่ถูกต้อง
var a1; // ประกอบด้วยอักษรกับตัวเลข โดยตัวเลขไม่ใช่ตัวแรก
var A1; // ถือเป็นคนละตัวกับ a1
var h_1; // ใช้ _ ได้
var $g; // $ ปนอยู่ได้
var คะแนน; // ใช้อักษรไทยได้
var 宝箱; // ใช้อักษรจีนได้
ตัวอย่างที่ไม่ถูกต้อง
var for; // ตรงกับคำสงวนไม่ได้
var b+; // มีเครื่องหมาย + ปนไม่ได้
var 1f; // ขึ้นต้นด้วยตัวเลขไม่ได้
ลักษณะของชื่อตัวแปรที่ตั้งได้ แต่ไม่แนะนำ
- ยาวเกินไป ทำให้โค้ดเยิ่นเย้อโดยไม่จำเป็น
- ซ้ำกับชื่อตัวแปรที่มีความหมายเดิมเป็นสากล
- นำหน้าด้วย _ โดยไม่มีความหมายอะไรเป็นพิเศษ
ตัวอย่าง
var ค่าอัตราเร็วของคลื่นแม่เหล็กไฟฟ้าในสูญญากาศ = 299792458; // ดูจะยาวไป
var alert = 1; // ตรงกับชื่อฟังก์ชันที่มีอยู่เดิม
var _a; // ขึ้นต้นด้วย _
alert นั้นเป็นฟังก์ชันที่มีอยู่เดิมในจาวาสคริปต์ แต่ไม่ใช่คำสงวน
ถ้าหากเขียนค่าทับลงไปก็จะทำได้ แต่พอทำแบบนั้นแล้วก็จะเสียความสามารถเดิมไป
ถูกเขียนทับด้วยค่าใหม่ที่ป้อนเข้าไป
var alert = "เตือนภัย";
alert(1+1); // จะขึ้นในคอนโซลว่า TypeError: alert is not a function
ในจาวาสคริปต์นั้นฟังก์ชันก็ถือว่าเป็นข้อมูลชนิดหนึ่ง ดังนั้น alert
นั้นจริงๆแล้วก็คือ "ข้อมูลชนิดฟังก์ชัน" ที่เก็บอยู่ในตัวแปรที่ชื่อ
alert
และเมื่อเป็นแค่ตัวแปรตัวนึงจึงสามารถถูกเขียนทับเมื่อไหร่ก็ได้
ข้อแตกต่างระหว่างฟังก์ชันกับลิเทอรัล
alert เป็นฟังก์ชัน (function) คือเป็นชุดคำสั่งที่เอาไว้ทำหน้าที่ต่างๆ
ส่วน var และ typeof นั้นถือเป็นลิเทอรัล (literal) แบบหนึ่ง
คือเป็นรูปแบบการเขียนตายตัวตามไวยากรณ์ภาษา
ลิเทอรัลยังรวมไปถึงพวกตัวดำเนินการต่างๆเช่น + - * / และ =
ที่ผ่านมาตั้งแต่บทแรก เราใช้คำว่า "คำสั่ง"
เพื่อเรียกรวมๆระหว่างฟังก์ชันกับลิเทอรัลโดยไม่ได้แยกแยะ
แต่ว่าถ้าพูดให้ถูกจริงๆแล้วทั้ง ๒ อย่างนี้ต่างกันมาก
ฟังก์ชันนั้นเมื่อเรียกใช้จะต้องมีวงเล็บต่อท้ายคร่อมค่าที่ต้องการนำมาใช้ในฟังก์ชันเสมอ
เช่น alert(1+1) แบบนี้ จะเขียนเป็น alert 1+1 ไม่ได้
และฟังก์ชันนั้นสามารถถูกเขียนทับได้ ดังที่ได้กล่าวไปแล้ว
แต่ลิเทอรัลนั้นมีวิธีการใช้ยืนหยุ่นกว่านั้น
บางชนิดอาจโผล่มาเดี่ยวๆเพื่อทำหน้าที่ต่างๆบางอย่าง เช่น break continue
(จะกล่าวถึงใน
บทที่ ๘)
หรืออาจวางไว้หน้าค่าที่เอาไว้ทำอะไรบางอย่าง เช่น var หรือ typeof
หรืออาจวางไว้ระหว่างค่าอะไร ๒ ตัว เช่น = + - * /
หรืออาจมีรูปแบบการใช้ที่ซับซ้อนกว่านั้น เช่น for if do while
ซึ่งจะกล่าวถึงต่อไป
คำที่เป็นลิเทอรัลนั้นจะเป็นคำสงวน ดังนั้นจึงไม่สามารถใช้เป็นชื่อตัวแปรได้
ไม่มีทางถูกเขียนทับได้
ฟังก์ชันนั้นยังเป็นสิ่งที่ผู้เขียนโปรแกรมสามารถสร้างขึ้นใหม่เอง
กำหนดขึ้นมาเองได้
แต่ลิเทอรัลนั้นถูกกำหนดไว้ตายตัวตามไวยากรณ์ภาษา ไม่สามารถเปลี่ยนแปลงอะไรได้
เหมือนเป็นผู้คุมกฎที่อยู่เหนือทุกสิ่งในภาษานั้น
ข้อมูลชนิดตัวเลข
ตัวเลข (number) คือจำนวนตัวเลข ซึ่งอาจเป็นเลขจำนวนเต็ม
หรือจำนวนที่มีทศนิยม หรือจำนวนที่เขียนในรูป e (รูปจำนวนคูณสิบยกกำลัง)
var i = 2;
var k = 1.1;
var c = 2.9979e8 // เท่ากับ 299790000
ในจาวาสคริปต์ทั้งจำนวนเต็มและจำนวนทศนิยมต่างถือว่าจัดอยู่ในกลุ่มข้อมูลตัวเลขทั้งสิ้น
ไม่มีการแยกแยะชนิดเหมือนในภาษาอื่นๆส่วนใหญ่ ที่มักจะแยกเป็นเรียกจำนวนเต็มเป็น
int หรือ integer และจำนวนทศนิยมว่า float
นอกจากนี้ยังมีจำนวนที่ค่อนข้างพิเศษ คือ NaN (ค่าที่ไม่เป็นตัวเลขปกติ) กับ
Infinity (ค่าอนันต์) จัดเป็นข้อมูลชนิดตัวเลขเหมือนกัน
ข้อมูลตัวเลขสามารถเอามาบวกลบกันได้
var a = 1;
var b = 7;
var n = a+b;
alert(n); // ได้ 8
ข้อมูลตัวเลขนั้นเวลาใช้จะไม่มีการคร่อมด้วยเครื่องหมายคำพูด
ถ้าหากคร่อมด้วยเครื่องหมายคำพูด
แม้ว่าจะเป็นตัวเลขก็ตามก็จะถือเป็นข้อมูลชนิดสายอักขระ
เช่น
var n = "1";
ข้อมูลชนิดสายอักขระ
สายอักขระ (string) คือข้อความตัวหนังสือ
ปกติเวลาสร้างข้อความตัวหนังสือจะต้องล้อมรอบด้วยเครื่องหมายคำพูดเสมอ
เพราะหากไม่มีเครื่องหมายคำพูดจะถูกตีความเป็นลิเทอรัล หรือชื่อตัวแปร
หรือถ้าเป็นตัวเลขก็จะเป็นข้อมูลชนิดตัวเลข
เครื่องหมายคำพูดนั้นอาจใช้ได้ทั้งแบบเดี่ยวแบบนี้ ' ' และแบบคู่แบบนี้ " "
จะใช้แบบไหนก็ได้ แต่ถ้าทางซ้ายเปิดด้วยแบบไหนทางขวาก็จะต้องปิดด้วยแบบนั้น
var s1 = "ขอบฟ้า เหนืออาณาใดกั้น"
var s2 = 'ใช่รักจะดั้น ยากกว่านกโบยบิน'
ข้อแตกต่างระหว่างแบบคู่กับแบบเดี่ยวก็คือ
ถ้าใช้แบบคู่จะสามารถใส่แบบเดี่ยวลงในสายอักขระได้
และถ้าใช้แบบคู่จะใส่แบบเดี่ยวได้
ตัวอย่าง
"d'accordo!"
'อยากบอกว่า "ฉันรักเธอ" จังเลย'
แต่ว่าถ้าอยากจะใส่แบบเดี่ยวลงในแบบเดี่ยว หรือแบบคู่ลงในแบบคู่ ก็ทำได้โดยการ
ใส่ \ ไว้หน้า ' หรือ "
'd\'accordo!';
"อยากบอกว่า \"ฉันรักเธอ\" จังเลย"
นอกจากนี้ใน ES6 สามารถใช้ `` ได้ด้วย ซึ่งมีความหมายต่างออกไป
รายละเอียดจะยกไปเขียนในเนื้อหาส่วน ES6
ภายในสายอักขระจะขึ้นบรรทัดใหม่ไม่ได้ ปกติจะเขียนว่า \n แทนการขึ้นบรรทัดใหม่
ข้อมูลสายอักขระนั้นต่างจากตัวเลขมาก ความแตกต่างอย่างหนึ่งคือ
เวลาเอามาบวกกันจะเป็นการนำสายอักขระมาต่อกัน
var s3 = "ถึงม้วยดินสิ้นฟ้ามหาสมุทร";
var s4 = "ไม่สิ้นสุดความรักสมัครสมาน";
alert(s3 + " " + s4);// ได้ ถึงม้วยดินสิ้นฟ้ามหาสมุทร ไม่สิ้นสุดความรักสมัครสมาน
ข้อมูลชนิดบูล
บูล (bool หรือ boolean) คือข้อมูลที่ใช้บอกถึงความจริงหรือเท็จ
มีอยู่แค่ ๒ ตัว คือ true (จริง) และ false (เท็จ)
ปกติเราจะได้ค่า true หรือ false
ออกมาเมื่อมีการใช้ตัวดำเนินการบางอย่างเพื่อหาค่าความเป็นจริงเท็จ เช่น
เทียบค่าระหว่างตัวแปร ๒ ตัวโดยใช้เครื่องหมายมากกว่า > หรือน้อยกว่า <
var a = 10
var b = 9
var c = 8
alert(a>b) // ได้ true
alert(b<c) // ได้ false
ในที่นี้ a มากกว่า b จริงเลยได้ true และ b น้อยกว่า c ไม่จริง เลยได้ false
หรือเราสามารถสร้างค่า true หรือ false ขึ้นมาเองได้ง่ายๆโดยการพิมพ์ true หรือ
false ไปตรงๆเลย
var t = true
alert(typeof t) // ได้ boolean
alert(typeof false) // ได้ boolean
รายละเอียดเกี่ยวกับข้อมูลชนิดบูลจะอธิบายใน
บทที่ ๗
ข้อมูลชนิดออบเจ็กต์
ออบเจ็กต์ (object)
เป็นข้อมูลโครงสร้างที่รวบรวมกลุ่มข้อมูลหลายๆอย่างเข้าด้วยกัน
โดยข้อมูลที่เป็นส่วนประกอบอยู่ในออบเจ็กต์จะเรียกว่า
"พรอเพอร์ตี" (property)
การสร้างออบเจ็กต์นั้นทำได้ง่ายโดยการสร้างวงเล็บปีกกาเปิดปิด
จากนั้นก็ป้อนค่าพรอเพอร์ตีต่างๆ โดยใส่ชื่อตามด้วยโคลอน : แล้วตามด้วยค่า
หากจะใส่หลายตัวให้คั่นแต่ละตัวด้วยจุลภาค , เช่น
var monster = {
chue: "poring",
lv: 14,
atk: 20
};
เมื่อจะเข้าถึงค่าข้างในก็เติมจุด ตามด้วยชื่อพรอเพอร์ตี
alert(monster.chue); // ได้ poring
alert(monster.atk); // ได้ 20
สามารถแก้ค่าพรอเพอร์ตีที่มีอยู่
หรือเพิ่มพรอเพอร์ตีใหม่ที่ต้องการเข้าไปเมื่อไหร่ก็ได้
monster.atk = 100;
alert(monster.atk); // ได้ 100
monster.def = 80;
alert(monster.def); // ได้ 80
รายละเอียดเรื่องของออบเจ็กต์จะอธิบายใน
บทที่ ๙
ข้อมูลชนิดฟังก์ชัน
ดังที่ได้กล่าวไปตอนต้นแล้ว ในจาวาสคริปต์ฟังก์ชันถือเป็นข้อมูลชนิดหนึ่ง
เช่นเดียวกับพวกตัวเลข สายอักขระ
ฟังก์ชัน alert
ที่ใช้มาตั้งแต่ต้นก็เป็นแค่ฟังก์ชันนึงที่โปรแกรมมีอยู่ให้ตั้งแต่ต้น
และในจาวาสคริปต์ สามารถอยู่ดีๆสร้างฟังก์ชันขึ้นได้ง่ายๆเลย เช่น
var f = function(x){return x+1};
alert(f); // ได้ function(x) {return x + 1}
alert(typeof f); // ได้ function
ฟังก์ชันที่สร้างสามารถนำมาใช้ได้ทันทีโดยตามหลังด้วยวงเล็บแล้วใส่ค่าที่ต้องการใช้กับฟังก์ชันไว้ด้านใน
var k = f(1);
alert(k); // ได้ 2
var h = f(12);
alert(h); // ได้ 13
รายละเอียดเรื่องการเขียนฟังก์ชันจะยังไม่เขียนถึงตอนนี้ จะไปกล่าวถึงใน
บทที่ ๑๐
ตอนนี้แค่ให้เข้าใจในเบื้องต้นว่าฟังก์ชันก็เป็นแค่ข้อมูลชนิดนึง
ซึ่งมีลักษณะพิเศษคือจะมีการทำงานเมื่อเติม () ต่อท้าย
และเราสามารถสร้างฟังก์ชันขึ้นใหม่เองตามที่ต้องการเมื่อใดก็ได้
null และ undefined
ในจาวาสคริปต์นั้นมีสิ่งที่แทนความว่างเปล่าหรือความไม่มีอะไรอยู่ ๒ ตัว คือ null
และ undefined
๒ ตัวนี้จริงๆแล้วคล้ายกันมาก บางทีก็ใช้แทนกันได้ แต่ก็ถือเป็นคนละสิ่งกัน
null หมายถึงค่าที่มีความหมายว่าว่างเปล่า ไม่มีอะไรอยู่
ในขณะที่ undefined หมายถึงไม่ได้นิยาม คือไม่ได้มีใครมากำหนดค่าให้มัน
ไม่มีตัวตนอยู่
หรืออาจอธิบายสั้นๆว่า null คือ "กำหนดว่าไม่มี" ส่วน undefined คือ
"ไม่ได้กำหนดว่ามี"
อาจฟังดูคล้ายกัน แต่ null คือเพราะกำหนดว่าไม่มีจึงไม่มี ส่วน undefined
คือเพราะไม่ได้กำหนดว่ามีก็เลยไม่มี
เช่นประกาศตัวแปรไว้ แต่ไม่ได้ใส่ค่าให้ แบบนี้ตัวแปรนั้นจะมีค่าเป็น undefined
จนกว่าจะมีการป้อนค่าให้มัน
var a;
alert(a); // ได้ undefined
หรือถ้าดูค่าพรอเพอร์ตีภายในออบเจ็กต์ หากไม่มีพรอเพอร์ตีนั้นอยู่ก็จะได้
undefined หรือถ้าป้อนค่าไว้ให้เป็น undefined ก็ได้ undefined อยู่ดี
obj = {
c: null
};
alert(abj.c); // ได้ null
alert(abj.a); // ได้ undefined
obj.b = undefined;
alert(obj.b); // ได้ undefined
หากใช้ typeof จะได้ว่า undefined เป็นชนิด undefined เอง ส่วน null
เป็นออบเจ็กต์
alert(typeof undefined); // ได้ undefined
typeof null; // ได้ object
นั่นหมายความว่า null ก็คือออบเจ็กต์ชนิดหนึ่ง เป็นออบเจ็กต์แห่งความว่างเปล่า
ส่วน undefined คือการที่ไม่มีออบเจ็กต์อะไรอยู่
ข้อแตกต่างอื่นๆเรื่องคุณสมบัติต่างๆไม่จำเป็นต้องเข้าใจทันทีก็ได้
ในเนื้อหาบทต่อๆไปทั้ง null และ undefined จะปรากฏมาอีกเรื่อยๆ
ถึงตอนนั้นก็จะเข้าใจได้เองว่าใช้ในกรณีไหน
ออบเจ็กต์ภายในตัว
ในจาวาสคริปต์มีออบเจ็กต์ส่วนหนึ่งที่ถูกเตรียมเอาไว้เพื่อทำหน้าที่เฉพาะ
ออบเจ็กต์พวกนี้มีอยู่ตั้งแต่เริ่มโปรแกรม สามารถเรียกใช้ได้เลย
ออบเจ็กต์เหล่านี้ทั้งหมดชื่อขึ้นต้นด้วยตัวพิมพ์ใหญ่
ตัวอย่างออบเจ็กต์ในตัวส่วนหนึ่ง รวมไปถึงในส่วนของ ES6
| ออบเจ็กต์ |
ความหมาย |
| Object |
รวมฟังก์ชันสำหรับจัดการกับออบเจ็กต์ |
| String |
แปลงเป็นข้อมูลชนิดสายอักขระ, รวมฟังก์ชันสำหรับจัดการกับสายอักขระ (ดูบทที่ ๕,
บทที่ ๑๓)
|
| Number |
แปลงเป็นข้อมูลชนิดตัวเลข, รวมฟังก์ชันสำหรับจัดการกับตัวเลข (ดูบทที่ ๕)
|
| Boolean |
แปลงข้อมูลเป็นชนิดบูล (ดูบทที่ ๗)
|
| Function |
ตัวสร้างฟังก์ชัน (ดูบทที่ ๑๐)
|
| Math |
รวมฟังก์ชันเกี่ยวกับคณิตศาสตร์ (ดูบทที่ ๑๖)
|
| Date |
ตัวสร้างออบเจ็กต์วันเวลา, รวมฟังก์ชันจัดการเกี่ยวกับเวลา (ดูบทที่ ๑๕)
|
| RegExp |
ตัวสร้างออบเจ็กต์เรกูลาร์เอ็กซ์เพรชชัน (ดูบทที่ ๑๔)
|
| Error |
ออบเจ็กต์ที่อธิบายข้อผิดพลาดที่เกิดขึ้นกับโปรแกรม (ดูบทที่ ๑๘)
|
| Array |
ใช้สร้างและจัดการข้อมูลชนิดแถวลำดับ (ดูบทที่ ๑๑)
|
| JSON |
ใช้จัดการกับ json (เพิ่มมาใน ES5 ดูบทที่ ๒๘) |
| Symbol |
สร้างหรือจัดการข้อมูลชนิดซิมโบล (เพิ่มมาใน ES6 ดูบทที่ ๓๕) |
| Proxy |
ควบคุมพฤติกรรมต่างๆของออบเจ็กต์ (เพิ่มมาใน ES6 ดูบทที่ ๔๐) |
| Promise |
ใช้จัดการกับการทำงานแบบไม่ประสานเวลา (เพิ่มมาใน ES6 ดูบทที่ ๔๓) |
| BigInt |
สร้างเลขจำนวนเต็มขนาดใหญ่มาก (เพิ่มมาใน ES2020 ดูบทที่ ๔๕) |
มีหลายตัวที่ชื่อเหมือนกับข้อมูลพื้นฐานในจาวาสคริปต์ ได้แก่ String, Number,
Boolean เป็นต้น
พวกนี้สามารถใช้เป็นฟังก์ชันเพื่อแปลงข้อมูลชนิดอื่นเป็นข้อมูลชนิดนั้นได้
Number และ String เองนอกจากตัวเองจะใช้เป็นฟังก์ชันสำหรับแปลงข้อมูลแล้ว
ภายในยังรวบรวมฟังก์ชันที่ใช้จัดการกับข้อมูชนิดนั้นๆด้วย
บางตัวแค่มีหน้าที่รวบรวมฟังก์ชันบางอย่างสำหรับใช้งานเฉพาะด้าน
แต่ไม่ได้ใช้เป็นตัวสร้างออบเจ็กต์ เช่นออบเจ็กต์ Math
รวมฟังก์ชันเกี่ยวกับคณิตศาสตร์ และออบเจ็กต์ JSON
รวมฟังก์ชันสำหรับจัดการกับข้อมูล json
บางตัวสามารถใช้เป็นคอนสตรักเตอร์เพื่อสร้างออบเจ็กต์ชนิดต่างๆตามชื่อนั้น เช่น
Date, RegExp, Array เป็นต้น
คอนสตรักเตอร์ (constructor) หรือ
ตัวสร้าง
หมายถึงตัวสร้างออบเจ็กต์ที่จะสร้างออบเจ็กต์ขึ้นเมื่อใช้กับคำสั่ง new เช่น
var wanWela = new Date("2019-10-14");
alert(wanWela); // ได้ Mon Oct 14 2019 07:00:00 GMT+0700
var thaeoLamdap = new Array(14);
alert(thaeoLamdap); // ได้ ,,,,,,,,,,,,,
var regex = new RegExp("ก+");
alert(regex); // ได้ /ก+/
รายละเอียดไว้กล่าวถึงอีกทีในแต่ละบทที่เจาะจงเรื่องของออบเจ็กต์ชนิดนั้นๆ
จะเห็นว่าออบเจ็กต์ในตัวมีอยู่หลากหลายและทำหน้าที่แตกต่างกันออกไป
นอกจากนี้หากรันจาวาสคริปต์ในเบราว์เซอร์จะมีออบเจ็กต์ในตัวเฉพาะสำหรับในเบราว์เซอร์
ได้แก่ console, window, navigator, history, location, ฯลฯ
console.log
ซึ่งกล่าวถึงไปเล็กน้อยในบทที่แล้วก็เป็นคำสั่งหนึ่งที่เตรียมโดยออบเจ็กต์
console
พวกนี้ไม่ใช่ออบเจ็กต์ในตัวของจาวาสคริปต์
ดังนั้นหากรันที่อื่นที่ไม่ใช่ในเบราว์เซอร์ก็จะไม่มี
console.log นั้นเป็น
เมธอด (method) คือเป็นพรอเพอร์ตีของออบเจ็กต์
แต่เป็นพรอเพอร์ตีที่เป็นฟังก์ชัน เกี่ยวกับเมธอดจะอธิบายเพิ่มเติมใน
บทที่ ๑๙
สรุปท้ายบท
บทนี้ได้แนะนำให้รู้จักกับข้อมูลชนิดต่างๆและวิธีการสร้างตัวแปรเพื่อใช้เก็บข้อมูล
แต่รายละเอียดของข้อมูลแต่ละชนิดนั้นยังมีอีกมาก
ในนี้แค่แนะนำภาพรวมคร่าวๆเท่านั้น
จะไปเขียนรายละเอียดอีกทีในบทที่แนะนำข้อมูลชนิดนั้นๆเป็นหลัก