JSON .stringify()
การใช้งานทั่วไปของ JSON คือการแลกเปลี่ยนข้อมูลไปยัง/จากเว็บเซิร์ฟเวอร์
เมื่อส่งข้อมูลไปยังเว็บเซิร์ฟเวอร์ ข้อมูลจะต้องเป็นสตริง
แปลงวัตถุ JavaScript เป็นสตริงด้วยJSON.stringify()
.
สตริงออบเจกต์ JavaScript
ลองนึกภาพว่าเรามีวัตถุนี้ใน JavaScript:
const obj = {name: "John", age: 30, city: "New York"};
ใช้ฟังก์ชัน JavaScript JSON.stringify()
เพื่อแปลงเป็นสตริง
const myJSON = JSON.stringify(obj);
ผลลัพธ์จะเป็นสตริงตามสัญกรณ์ JSON
myJSON
เป็นสตริงและพร้อมที่จะส่งไปยังเซิร์ฟเวอร์:
ตัวอย่าง
const obj = {name: "John", age: 30, city: "New York"};
const myJSON =
JSON.stringify(obj);
คุณจะได้เรียนรู้วิธีส่ง JSON ไปยังเซิร์ฟเวอร์ในบทต่อไป
สตริง JavaScript Array
มันยังเป็นไปได้ที่จะทำให้อาร์เรย์ JavaScript เป็นสตริง:
ลองนึกภาพว่าเรามีอาร์เรย์นี้ใน JavaScript:
const arr = ["John", "Peter", "Sally", "Jane"];
ใช้ฟังก์ชัน JavaScript JSON.stringify()
เพื่อแปลงเป็นสตริง
const myJSON = JSON.stringify(arr);
ผลลัพธ์จะเป็นสตริงตามสัญกรณ์ JSON
myJSON
เป็นสตริงและพร้อมที่จะส่งไปยังเซิร์ฟเวอร์:
ตัวอย่าง
const arr = ["John", "Peter", "Sally", "Jane"];
const myJSON =
JSON.stringify(arr);
คุณจะได้เรียนรู้วิธีส่งสตริง JSON ไปยังเซิร์ฟเวอร์ในบทต่อไป
การจัดเก็บข้อมูล
เมื่อจัดเก็บข้อมูล ข้อมูลจะต้องมีรูปแบบที่แน่นอน และไม่ว่าคุณจะเลือกจัดเก็บข้อมูลไว้ที่ใด ข้อความก็ถือเป็นรูปแบบทางกฎหมายรูปแบบหนึ่งเสมอ
JSON ทำให้สามารถจัดเก็บวัตถุ JavaScript เป็นข้อความได้
ตัวอย่าง
การจัดเก็บข้อมูลในที่จัดเก็บในตัวเครื่อง
// Storing data:
const myObj = {name: "John",
age: 31, city: "New York"};
const myJSON =
JSON.stringify(myObj);
localStorage.setItem("testJSON", myJSON);
// Retrieving data:
let text = localStorage.getItem("testJSON");
let obj =
JSON.parse(text);
document.getElementById("demo").innerHTML = obj.name;
ข้อยกเว้น
สตริงวันที่
ใน JSON ไม่อนุญาตให้ใช้วัตถุวันที่ ฟังก์ชันJSON.stringify()
นี้จะแปลงวันที่เป็นสตริง
ตัวอย่าง
const obj = {name: "John", today: new Date(), city : "New York"};
const myJSON = JSON.stringify(obj);
คุณสามารถแปลงสตริงกลับเป็นวัตถุวันที่ที่เครื่องรับ
ฟังก์ชันสตริง
ใน JSON ไม่อนุญาตให้ใช้ฟังก์ชันเป็นค่าออบเจ็กต์
ฟังก์ชันJSON.stringify()
นี้จะลบฟังก์ชันใดๆ ออกจากออบเจ็กต์ JavaScript ทั้งคีย์และค่า:
ตัวอย่าง
const obj = {name: "John", age: function () {return 30;}, city: "New York"};
const myJSON = JSON.stringify(obj);
สิ่งนี้สามารถละเว้นได้หากคุณแปลงฟังก์ชันของคุณเป็นสตริงก่อนเรียกใช้JSON.stringify()
ฟังก์ชัน
ตัวอย่าง
const obj = {name: "John", age: function () {return 30;}, city: "New York"};
obj.age = obj.age.toString();
const myJSON = JSON.stringify(obj);
หากคุณส่งฟังก์ชันโดยใช้ JSON ฟังก์ชันจะสูญเสียขอบเขต และผู้รับจะต้องใช้ eval() เพื่อแปลงกลับเป็นฟังก์ชัน