Json là gì? Tìm hiểu cách sử dụng Json

Khi bước chân vào thế giới lập trình bạn sẽ được nghe đến khái niệm Json. Vậy Json là gì? Cấu trúc của nó như thế nào và sử dụng ra sao? Hãy tìm hiểu qua bài viết này với Quachquynh.com nhé.

Json là gì?

JSON được viết tắt bởi JavaScript Object Notation. Đây là một định dạng văn bản tiêu chuẩn để biểu diễn dữ liệu có cấu trúc dựa trên cú pháp đối tượng JavaScript. Có thể đọc được theo dạng cặp “thuộc tính (Key) – giá trị (Value)”.

Nó thường được dùng để truyền dữ liệu giữa các ứng dụng web. Ví dụ như dữ liệu được Server tới Client để hiển thị một website hoặc ngược lại.

Tuy được viết dựa trên cú pháp JavaScript nhưng nó lại không ràng buộc bất cứ ngôn ngữ nào. Các ngôn ngữ lập trình như PHP, Java, C#, Python vv… đều dùng được.

Cấu trúc định dạng Json

Cấu trúc của Json tồn tại dưới dạng chuỗi (String). Và các đối tượng (Objects) đều nằm dấu ngoặc nhọn {}. Các key và value của JSON phải đáp ứng điều kiện nằm trong dấu nháy kép " ".

Key: phải luôn nằm ở trong dấu ngoặc kép. Không được phép là biến số.
Value: Chỉ cho phép các kiểu dữ liệu cơ bản như number, string, boolean, null,… Không cho phép function, data, undefined.

Một file Json sẽ được viết như sau:

{
"NhanVien":
{
"name": "Quach Quynh", 
"age": 100, 
"city": "Viet Nam"
}
}

Nhìn qua ví dụ trên bạn sẽ thấy các key là name, age, city và giá trị (Value) được viết ngay sau và ngăn cách bằng dấu hai chấm : . Với dạng number sẽ không có dấu ngoặc kép.

Mảng dưới dạng JSON

Trong lập trình mảng được viết bởi 2 dấu ngoặc vuông [].

Ví dụ:

{
"name": "Doremon",
"age": 1000,
"cars": ["Ford", "BMW", "Fiat"]
}

Để đọc file Json dạng mảng sử dụng myObj.cars[0]; Mảng sẽ sắp xếp từ bên trái qua bên phải và bắt đầu từ không. Trong ví dụ này mảng [0] sẽ tương ứng với Ford, mảng [1] tương ứng với BMW…

Trường hợp nhiều Object:

Như đã nói ở trên mỗi đối tượng (Object) đều nằm trong dấu ngoặc nhọn {}. Khi có nhiều đối tượng sẽ được ngăn cách bởi dấu phẩy ,

[
    {
        "name" : "Yasuo",
        "age" : "100 tuổi"
    },
    {
        "name" : "Zed",
        "age" : "150 tuổi"
    },
    {
        "name" : "Leesin",
        "age" : "200 tuổi"
    }
]

Ví dụ về cách sử dụng Json:

<p id="display_data"></p>

<script>
const JSONdata = '{ "name":"John", "age":30, "car": "BMW" }';
const myObj = JSON.parse(JSONdata);
document.getElementById("display_data").innerHTML = myObj.car;
</script>

Kết luận: Với bài viết tìm hiểu về Json là gì bạn đã có cái nhìn rõ ràng hơn về nó. Vì cú pháp dựa trên JavaScript nên bạn có thể thực hành ngay lập tức. Bằng cách sử dụng W3School hoặc Codepen.