Mảng - Array Trong JSON - Lập Trình Từ Đầu
Có thể bạn quan tâm
Mảng trong JSON thực chất cũng giống như một mảng trong Js. Nhưng cũng có một số khác biệt. Trong JSON thì mảng sẽ có những giá trị là kiểu chuỗi, số, đối tượng, mảng, boolean hay null . Còn trong Js thì mảng có thể có giá trị là tất cả kiểu trên cùng với đó giá trị của nó cũng có thể là một biểu thức Js hợp lệ khác như hàm, ngày tháng hay unundefined.
Ví dụ:
Đây là một chuỗi JSON : '["Ford", "BMW", "Vinfast"]'
Bên trong chuỗi này có một mảng JSON : ["Ford", "BMW", "Vinfast"]
Ta cũng có thể tạo mảng Js bằng cách phân tích cú pháp JSON với việc sử dụng JSON.parse
Ví dụ:
<!DOCTYPE html> <html> <body> <h2>Tạo một mảng từ JSON</h2> <p id="demo"></p> <script> const myJSON = '["Ford", "BMW", "Vinfast"]'; const myArray = JSON.parse(myJSON); document.getElementById("demo").innerHTML = myArray; </script> </body> </html> 2. Truy cập và sửa đổi các giá trị trong mảngMảng JSON cũng có thể là giá trị của thuộc tính dối tượng JSON
{ "name":"Thành", "age":19, "cars":["Ford", "BMW", "Vinfast"] }Sau đó ta truy cập các giá trị mảng theo chỉ mục:
<!DOCTYPE html> <html> <body> <h2>Truy cập giá trị mảng</h2> <p id="demo"></p> <script> const myJSON = '{"name":"Thành", "age":19, "cars":["Ford", "BMW", "Vinfast"]}'; const myObj = JSON.parse(myJSON); document.getElementById("demo").innerHTML = myObj.cars[0]; </script> </body> </html>Ta cũng có thể dựa theo chỉ mục để sửa đổi mảng
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> var myObj, i, x = ""; myObj = { "name":"Thành", "age":19, "cars":[ "Ford", "BMW", "Vinfast" ] }; myObj.cars[1] = "Mercedes"; for (i in myObj.cars) { x += myObj.cars[i] + "<br>"; } document.getElementById("demo").innerHTML = x; </script> </body> </html> 3. Lặp qua một mảng JSONTa có thể sử dụng vòng lặp for in để truy cập các giá trị của mảng
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> const myJSON = '{"name":"Thành", "age":19, "cars":["Ford", "BMW", "Vinfast"]}'; const myObj = JSON.parse(myJSON); let text = ""; for (let i in myObj.cars) { text += myObj.cars[i] + ", "; } document.getElementById("demo").innerHTML = text; </script> </body> </html>Hoặc thay vào đó sử dụng một vòng lặp for
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> const myJSON = '{"name":"Thành", "age":19, "cars":["Ford", "BMW", "Vinfast"]}'; const myObj = JSON.parse(myJSON); let text = ""; for (let i = 0; i < myObj.cars.length; i++) { text += myObj.cars[i] + ", "; } document.getElementById("demo").innerHTML = text; </script> </body> </html> 4. Mảng lồng nhau trong đối tượng JSONGiá trị trong một mảng cũng có thể là một mảng khác hoặc thậm chí là một đối tượng JSON khác.
Ví dụ:
myObj = { "name":"Thành", "age":19, "car":[ {"name":"Ford","models":["Fiesta","Focus","Mustang"]}, {"name":"BMW","models":["210","X5","X3"]}, {"name":"Vinfast","models":["Điện","C9","X4"]}, ] }Để truy cập giá trị bên trong ta cũng sẽ sử dụng vòng lặp cho mảng
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> var myObj, i, j, x = ""; myObj = { "name":"Thành", "age":19, "cars": [ {"name":"Ford","models":["Fiesta","Focus","Mustang"]}, {"name":"BMW","models":["210","X5","X3"]}, {"name":"Vinfast","models":["Điện","C9","X4"]}, ] } for (i in myObj.cars) { x += "<h2>" + myObj.cars[i].name + "</h2>"; for (j in myObj.cars[i].models) { x += myObj.cars[i].models[j] + "<br>"; } } document.getElementById("demo").innerHTML = x; </script> </body> </html> 5. Xóa chỉ mục trong mảngTa sử dụng delete để xóa các mục bên trong mảng
Ví dụ:
<!DOCTYPE html> <html> <body> <p id="demo"></p> <script> var myObj, i, x = ""; myObj = { "name":"Thành", "age":19, "cars": ["Ford","BMW","Vinfast"] } delete myObj.cars[1]; for (i in myObj.cars) { x += myObj.cars[i] + "<br>"; } document.getElementById("demo").innerHTML = x; </script> </body> </html>Từ khóa » Duyệt Mảng Json
-
Mảng (Array) Trong JSON - VietTuts
-
Xử Lý JSON Trong JAVASCRIPT - NIIT - ICT Hà Nội
-
Hiểu Rõ Về JSON Là Gì? Cách Lấy Dữ Liệu Từ JSON | TopDev
-
Xử Lý Dữ Liệu JSON Đơn Giản Với Javascript - CodeLearn
-
Hướng Dẫn Xử Lý JSON Trong JavaScript - Openplanning
-
Truy Cập / Xử Lý (lồng) Các đối Tượng, Mảng Hoặc JSON? - HelpEx
-
Chuyển đổi Mảng Thành đối Tượng JSON Trong JavaScript - Morioh
-
Cách Duyệt Dữ Liệu Cho Các Phần Tử Trong Mảng Json | CodeIgniter
-
TÌM HIỂU VỀ JSON TRONG JAVASCRIPT - Viblo
-
rse() And ringify() - Viblo
-
Json Là Gì? Tìm Hiểu Chi Tiết Về Json - Tino Group
-
Xử Lý Dữ Liệu JSON Trong PHP - Góc Học IT
-
Bài 11: Xử Lý JSON Trong Android - Programming Tutorial
-
Gửi Dữ Liệu JSON Từ Javascript Sang PHP?