รูปแบบข้อมูล JSON เป็นมาตรฐานในการแลกเปลี่ยนข้อมูลระหว่างเซิฟเวอร์และไคลเอนต์ที่ได้รับความนิยมในปัจจุบันซึ่งได้ถูกนำไปใช้งานอย่างแพร่หลายเช่นการเขียนโปรแกรมโดยใช้เทคนิค AJAX, RESTFul, เขียนคอนฟิกไฟล์ หรือการพัฒนา API เป็นต้น
ด้วยคุณสมบัติของ JSON ที่เป็นไฟล์ประเภทข้อความ (Text based) ขนาดเล็กน้ำหนักเบา เป็นมาตรฐานกลางทุกภาษาสามารถใช้งานได้ง่ายทั้งการอ่านและเขียนที่มนุษย์สามารถอ่านเข้าใจได้ง่าย
อักขระมาตารฐานของ JSON
- เครื่องหมาย “:” ใช้สำหรับแยกค่า name และ value
- เครื่องหมาย “,” ใช้สำหรับแยกข้อมุล name-value ในแต่ละคู่
- เครื่องหมาย “{” และ “}” ระบุว่าข้อมูลเป็นออบเจ็ค
- เครื่องหมาย “[” และ “]” ระบุว่าข้อมูลเป็นอาเรย์
- เครื่องหมาย “” (double quotes) ใช้เขียนค่า name-value ใน JSON
ตัวอย่างการเขียนค่า Json
– จำนวน 1 คู่
"name" : "value"– หากมีมากกว่า 1 คู่ ให้ใช้เครื่องหมายคอมมา , (comma) ในการแยกเป็นคู่
"name" : "value", "name" : "value", "name": "value"– ต้วอย่าง JSON object
{
"name" : "mama papa",
"email" : "mama@email.com",
};
ชนิดข้อมูลของ JSON มี 6 ชนิด คือ
- strings
- numbers
- objects
- arrays
- booleans
- null or empty
– ตัวอย่างการใช้งานชนิดข้อมูล
{
"text" : "This is Sting",
"number" : 210,
"object" : {
"name" : "abc",
"popularity" : "immense"
},
"arary" : ["1","2","3"],
"empty" : ,
"booleans" : true
}
การใช้งาน JSON ร่วมกับภาษา JavaScript
– ตัวอย่างการแสดงค่า JSON objects
var user = {
"name" : "mama papa",
"email" : "mama@email.com",
};
console.log("The name is: " +user.name);
console.log("email is: " +user.email);
//output
The name is: mama papa
email is: mama@email.com– ตัวอย่างการแสดงค่า JSON objects ใน array
var students = [{
"name" : "สมชาย",
"age" : "29",
"gender" : "ผู้ชาย"
},
{
"name" : "สมหญิง",
"age" : "27",
"gender" : "ผู้หญิง"
}];
console.log(students[0].age); //output: 29
console.log(students[1].name); //output: สมหญิง– ตัวอย่างการแสดงค่า JSON objects ใน objects
var cars = {
"toyota" : {
"type" : "vios",
"year" : "2018"
},
"honda" : {
"type" : "city",
"year" : "2015"
}
}
console.log(cars.toyota.type); //output: vios
console.log(cars.honda.year); //output: 2015ทริปเล็กๆน้อยๆ
ในการใช้งาน JSON ในภาษา JavaScript มีฟังก์ชั่นที่เราใช้งานบ่อยๆ อยู่ 2 ฟังก์ชัน คือ
- JSON parser สำหรับแปลง JSON object เป็น javascript object ตัวอย่างเช่น
var myJSObject = JSON.parse(students);2. JSON stringify สำหรับแปลง JavaScript object เป็น JSON text
var jsonText= JSON.stringify(myJSObject);(*ข้อควรระวังอย่าสับสนระหว่าง JSON object กับ javascript object เพราะมันเป็นคนละอย่างกันนะครับ [3])
ทริปเพิ่มเติมสำหรับการใช้งานร่วมกับภาษา PHP จะมีฟังก์ชั่น json_encode เพื่อส่งข้อมูล json ไปให้ฝั่ง javascript ไปใช้งานต่ออีกที หากเราต้องการที่จะแปลงข้อมูลให้เป็น javascript object เพื่อจะให้เรานำข้อมูล json ไปทำงานต่อไปได้ง่ายขึ้นสามารถทำดังนี้
var jsonText= JSON.stringify(myJsonFormPHP);
var myJSObject = JSON.parse(jsonText);Reference:
https://beginnersbook.com/2015/04/json-tutorial/
https://restfulapi.net/json-data-types/
Javascript Object VS JSON(JavaScript Object Notation) มันคนละเรื่องกัน ? [3]
(ร้องหายแปป)
ง่ายๆ ไปดูเลยค่ะที่เว็บ
