JSON là viết tắt của Ký hiệu đối tượng JavaScript. Nó được sử dụng để mô tả các đối tượng JavaScript. Đây là định dạng chia sẻ dữ liệu chỉ định giá trị dữ liệu bằng các cặp khóa-giá trị. Đối tượng JSON được hỗ trợ trên tất cả các trình duyệt chính. Hướng dẫn này yêu cầu bạn phải quen thuộc với JavaScript và làm việc với đối tượng JSON. Để làm quen với JSON, bạn có thể xem tổng quan của chúng tôi về định dạng chia sẻ dữ liệu JSON. Bạn cũng có thể xem cách làm việc với JSON trong JavaScript
Định dạng JSON cũng được sử dụng để truyền dữ liệu qua mạng. Với mục đích này, dữ liệu cần được tuần tự hóa và giải tuần tự hóa. Khi dữ liệu ở định dạng JSON, nó được chuyển đổi thành một chuỗi bằng cách sử dụng phương thức stringify . Để chuyển đổi dữ liệu trở lại định dạng đối tượng để thao tác, phương thức parse được sử dụng. Hướng dẫn này sẽ giới thiệu các bước sử dụng JSON. phân tích cú pháp[] và JSON . .xâu chuỗi[] . Hãy bắt đầu nào.
JSON. phân tích cú pháp []
Phương thức này được sử dụng để chuyển đổi một chuỗi JSON thành một đối tượng JSON để nó có thể được thao tác theo chương trình. Chuỗi được chuyển cần phải là một chuỗi JSON hợp lệ nếu không một ngoại lệ sẽ được đưa ra. Chuỗi này có thể được nhận từ bất kỳ dịch vụ web hoặc ứng dụng từ xa nào
Phương thức này chấp nhận hai tham số. một chuỗi và một hàm gọi lại có thể được sử dụng để thao tác với chuỗi . Giả sử chúng tôi đang nhận được một thông báo từ một dịch vụ web cho biết trạng thái của hành động, thông báo và mã trạng thái. Dưới đây là một ví dụ đơn giản về cách một chuỗi có thể được chuyển đổi thành một đối tượng.
Mã số
XHTML1
2
3
let json_string = '{"message". "Hoàn thành thành công", "trạng thái". 200, "mã". 200}'
let server _ obj = JSON. phân tích cú pháp [ json _ chuỗi ];
bảng điều khiển . log [ máy chủ _ obj ]
đầu ra
1
{thông báo. 'Hoàn tất thành công', trạng thái. 200, mã. 200}
Một vấn đề phổ biến là khi các dấu phẩy ở cuối được thêm vào chuỗi, vì vậy JSON. phân tích cú pháp[] đưa ra lỗi nếu chuỗi được truyền cho nó có dấu sau . Nếu cần thao tác với các giá trị, bạn có thể chuyển hàm gọi lại làm đối số thứ hai.
Mã số
1
2
3
4
5
6
7
8
9
let string = '{"name". "XYZ","email". "[email được bảo vệ]"}';
let obj = JSON. phân tích cú pháp[chuỗi, [key, value] => {
nếu [loại giá trị === 'string'] {
trả về giá trị. đến UpperCase[];
}
trả về giá trị;
}];
bảng điều khiển. log[obj]
đầu ra
1
{tên. 'XYZ', email. '[email được bảo vệ]'}
JSON. xâu chuỗi []
Phương thức stringify hoàn toàn ngược lại với parse method. Here, the JSON object is passed, and the return value is a string. This string can be passed to some other remote web service, for example, and then parsed again into a JSON object for manipulation.
Mã số
1
2
3
let obj = {thông báo:"Hoàn thành thành công", trạng thái. 200, mã. 200}
let str = JSON. xâu chuỗi[obj];
bảng điều khiển. log[str];
đầu ra
1
{"thông báo". "Hoàn thành thành công","trạng thái". 200,"mã". 200}
Phương thức xâu chuỗi có thể nhận hai đối số. Phương thức replacer and spacer . Phương thức replacer có thể được sử dụng để thay thế hoặc loại trừ bất kỳ giá trị nào trong chuỗi.
Mã số
1
2
3
4
5
6
7
8
9
let obj = {thông báo:"Hoàn thành thành công", trạng thái. 200, mã. 200}
let str = JSON. xâu chuỗi[obj, [key, value] => {
nếu [trạng thái === 200] {
trả về không xác định;
}
trả về giá trị;
}];
bảng điều khiển. log[str]
đầu ra
1
{"thông báo". "Hoàn thành thành công","trạng thái". 200,"mã". 200}
Khi đối số dấu cách được cung cấp, mỗi phần tử của một mảng hoặc đối tượng được đặt trên dòng của nó và được thụt vào để biểu thị độ sâu của nó trong . Dưới đây là một đoạn mã đơn giản minh họa điều này.
Mã số
1
2
3
let obj = {thông báo:"Hoàn thành thành công", trạng thái. 200, mã. 200}
let str = JSON. xâu chuỗi[obj, null, "---"];
bảng điều khiển. log[str]
đầu ra
1
2
3
4
5
{
--- "thông báo". "Hoàn tất thành công",
--- "trạng thái". 200,
--- "mã". 200
}
Phần kết luận
Trong hướng dẫn này, chúng tôi đã xem xét hai phương pháp hữu ích để làm việc với nội dung có định dạng JSON. Các đối tượng JSON ở khắp mọi nơi và khi xây dựng các ứng dụng hiện đại bằng JavaScript, các phương thức này rất hữu ích. Để tìm hiểu thêm, hãy xem các hướng dẫn sau trên blog của chúng tôi