JSON là gì? Và cách sử dụng nó lên website

JSON (JavaScript Object Notation) là định dạng để lưu giữ và trao đổi thông tin mà con người có thể đọc được. File chỉ chứa văn bản và sử dụng phần mở rộng .json.


    Trong bài viết này, bạn sẽ được biết JSON là gì và công dụng của nó, cũng như làm thế nào nó cải thiện hiệu suất của website.
    JSON


    JSON là gì và được sử dụng để làm gì?


    JSON là định dạng lưu trữ thông tin có cấu trúc và chủ yếu được sử dụng để truyền dữ liệu giữa server và client.

    File cơ bản là sự thay thế đơn giản và nhẹ hơn cho XML (Extensible Markup Language) có chức năng tương tự.

    Các nhà phát triển sử dụng JSON để làm việc với AJAX (Asynchronous JavaScript and XML). Các định dạng này phối hợp hiệu quả với nhau để nén dữ liệu tải không đồng bộ, nghĩa là trang web có thể cập nhật thông tin mà không cần làm mới trang.

    Quá trình này dễ thực hiện với JSON hơn XML/ RSS. Và ngày nay, khi nhiều trang web đang áp dụng AJAX, file .json đã trở nên rất phổ biến.

    Hơn nữa, nó cho phép người dùng yêu cầu dữ liệu từ domain khác với phương thức gọi là JSONP bằng cách áp dụng thẻ <script>. Nếu không, bạn không thực sự có thể chuyển dữ liệu cross-domain vì chính sách cùng nguồn gốc.


    Bạn đã có khái niệm cơ bản JSON là, hãy cùng xem cú pháp của nó để hiểu rõ hơn cách hoạt động của JSON.

    Cú pháp JSON - JSON Syntax

    Để tạo chính xác file .json, bạn phải tuân theo đúng cú pháp.

    Có hai yếu tố cốt lõi của object JSON: Keys và Values.

    Keys phải là chuỗi. Nó là chuỗi ký tự được bao quanh bởi dấu ngoặc kép.

    Values là một kiểu dữ liệu JSON hợp lệ. Nó có thể dạng array, object, chuỗi, boolean, số hoặc rỗng.

    Một object JSON bắt đầu và kết thúc bằng dấu ngoặc nhọn {}. Nó có thể có hai hoặc nhiều cặp key/ value, với dấu phẩy để phân tách chúng. Trong khi mỗi key được theo sau bởi dấu hai chấm để phân biệt với value.

    Dưới đây là ví dụ:

      {"city":"Da Nang", "country":"Viet Nam"}
    Chúng ta có hai cặp key/ value ở đây: citycountry là keys; Da NangViet Nam là values.

    Các loại Values

    Values chứa loại dữ liệu JSON hợp lệ, chẳng hạn như:

    Array


    Array là bộ sưu tập values có thứ tự. Nó được bao quanh bởi dấu ngoặc vuông [] và mỗi value bên trong được phân tách bằng dấu phẩy.

    Một value dạng array có thể chứa object JSON, nghĩa là nó sử dụng cùng khái niệm cặp key/ value. Ví dụ:
      "students":[      
      {"firstName":"Hien", "lastName":"Hoang Duc"},
      {"firstName":"Hieu", "lastName":"Ho Quoc"},
      {"firstName":"Nam", "lastName":"Tran Thanh Nam"}
      ]
    

    Thông tin giữa các dấu ngoặc vuông là array, chứa ba objects trong đó.

    Object

    Một object chứa một key và một value. Có dấu hai chấm sau mỗi key và dấu phẩy sau mỗi value, cũng phân biệt giữa mỗi object. Cả hai đều nằm trong dấu ngoặc kép.


    Object như một value, phải tuân theo quy tắc tương tự như một object giống như thế này:
      “employees”: {"firstName":"Hien", "lastName":"Hoang Duc”}
    

    Chuỗi


    Chuỗi là một bộ tập hợp gồm số 0 hoặc nhiều ký tự Unicode. Nó được bao quanh bởi hai dấu ngoặc kép.

    Ví dụ này cho thấy Hien biểu thị một chuỗi bởi vì nó là một bộ ký tự trong dấu ngoặc kép.

      "firstName":"Hien"
    

    Số


    Số trong JSON là số nguyên hoặc số thực, chẳng hạn như:
      {“age”:”20”}

    Boolean


    Bạn có thể sử dụng true hoặc false làm value như sau:
      {“married”:”false”)
    

    Rỗng


    Nó thể hiện là không có thông tin.
      {“bloodType”:”null”}
    

    Dữ liệu JSON được lưu trữ


    Bạn có hai cách để lưu trữ dữ liệu JSON – object và mảng. Cách đầu tiên sẽ như thế này:
      {
      "firstName":"Hien",
      "lastName":"Hoang Duc",
      "gender":"male"
      }
     
    Dấu ngoặc nhọn biểu thị rằng đó là object JSON. Nó bao gồm ba cặp key/ value được phân tách bằng dấu phẩy.
    Trong mỗi cặp, bạn có keys (firstName, lastName và gender) theo sau là dấu hai chấm để phân biệt chúng với values (Hien, Hoang Duc, male).
    Value trong ví dụ này là chuỗi. Đó là tại sao chúng cũng ở trong dấu ngoặc kép, tương tự như keys.

    Sử dụng Array


    Cách khác để lưu trữ dữ liệu là array. Hãy xem ví dụ này:
      {
      "firstName":"Hien",
      "lastName":”Hoang Duc”,
      “gender”:”male”,
      "hobby":["Code", "Singer", "Swimming"]
      }
     
    Điều khác biệt của cách này so với cách trước là cặp key/ value thứ tư. Hobby là key và có một số values (Code, Singer, Swimming) trong dấu ngoặc vuông, đại diện cho mảng.

    Nó có thể hữu ích khi được ghép nối với JSONP để khắc phục vấn đề cross-domain. Quá trình này hoạt động bằng cách sử dụng callbacks, sẽ yêu cầu một mục được chỉ định trong Mảng mà không gặp same-origin error (lỗi cùng nguồn gốc).

    Và may mắn là Array cũng hỗ trợ for loop, cho phép bạn chạy các lệnh lặp đi lặp lại để tìm kiếm nhiều dữ liệu – làm cho quá trình nhanh hơn và hiệu quả hơn.

    Kết luận


    Như bạn có thể thấy, JSON là công cụ hữu ích để trao đổi dữ liệu. Nó có rất nhiều lợi thế:

    Nó có thể tải thông tin không đồng bộ để trang web phản ứng nhanh hơn và có thể xử lý luồng dữ liệu dễ dàng hơn.
    Bạn cũng có thể sử dụng nó để khắc phục các vấn đề liên quan đến domain khi trao đổi dữ liệu từ một trang web khác.
    JSON đơn giản và nhẹ hơn XML.
    Giờ không những bạn biết JSON là gì, bạn còn hiểu rõ hơn về JSON và có thể quản lý trang web hiệu quả hơn. Nếu bạn muốn thảo luận, hay thắc mắc gì hãy để lại bình luận bên dưới nhé! Xin cám ơn các bạn.

    DucHienTechnical