JSON: Mảng JSON


Đăng ký nhận thông báo về những video mới nhất

Mảng dưới dạng đối tượng JSON

Ví dụ:

"Ford""BMW""Fiat" ]

Mảng trong JSON gần giống như mảng trong JavaScript.

Trong JSON, các giá trị mảng phải có kiểu chuỗi, số, đối tượng, mảng, boolean hoặc null.

Trong JavaScript, các giá trị mảng có thể là tất cả các giá trị trên, cộng với bất kỳ biểu thức JavaScript hợp lệ nào khác, bao gồm các hàm, ngày tháng và undefined.

Mảng trong đối tượng JSON

Mảng có thể là giá trị của thuộc tính đối tượng. Ví dụ:

{
"name":"John",
"age":30,
"cars":[ "Ford""BMW""Fiat" ]
}

Truy cập giá trị mảng

Bạn truy cập các giá trị mảng bằng cách sử dụng chỉ số: x = myObj.cars[0];

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>Access an array value of a JSON object.</p>

<p id="demo"></p>

<script>
  var myObj, x;
  myObj = {
    "name":"John",
    "age":30,
    "cars":[ "Ford", "BMW", "Fiat" ]
  };
  x = myObj.cars[0];
  document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Lặp qua một mảng

Bạn có thể truy cập các giá trị mảng bằng cách sử dụng vòng lặp for-in dạng thế này:

for (i in myObj.cars) {
  x += myObj.cars[i];
}

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>Looping through an array using a for in loop:</p>

<p id="demo"></p>

<script>
  var myObj, i, x = "";
  myObj = {
    "name":"John",
    "age":30,
    "cars":[ "Ford", "BMW", "Fiat" ]
  };
  
  for (i in myObj.cars) {
    x += myObj.cars[i] + "<br>";
  }
  document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Hoặc bạn có thể sử dụng một vòng lặp for thông thường:

for (i = 0; i < myObj.cars.length; i++) {
  x += myObj.cars[i];
}

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>Loopin through an array using a for loop:</p>

<p id="demo"></p>

<script>
  var myObj, i, x = "";
  myObj = {
    "name":"John",
    "age":30,
    "cars":[ "Ford", "BMW", "Fiat" ]
  };
  
  for (i = 0; i < myObj.cars.length; i++) {
    x += myObj.cars[i] + "<br>";
  }
  document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Mảng lồng nhau trong các đối tượng JSON

Giá 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":"John",
  "age":30,
  "cars": [
    { "name":"Ford""models":[ "Fiesta""Focus""Mustang" ] },
    { "name":"BMW""models":[ "320""X3""X5" ] },
    { "name":"Fiat""models":[ "500""Panda" ] }
  ]
 }

Để truy cập các mảng bên trong mảng, hãy sử dụng vòng lặp bổ sung cho mỗi mảng:

for (i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>Looping through arrays inside arrays.</p>

<p id="demo"></p>

<script>
  var myObj, i, j, x = "";
  myObj = {
    "name":"John",
    "age":30,
    "cars": [
      {"name":"Ford", "models":["Fiesta", "Focus", "Mustang"]},
      {"name":"BMW", "models":["320", "X3", "X5"]},
      {"name":"Fiat", "models":["500", "Panda"] }
    ]
  }
  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>

Sửa đổi giá trị mảng

Sử dụng chỉ số để sửa đổi một mảng:

myObj.cars[1] = "Mercedes";

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>How to modify an array value of a JSON object.</p>

<p id="demo"></p>

<script>
  var myObj, i, x = "";
  myObj = {
    "name":"John",
    "age":30,
    "cars":[ "Ford", "BMW", "Fiat" ]
  };
  myObj.cars[1] = "Mercedes";
  
  for (i in myObj.cars) {
    x += myObj.cars[i] + "<br>";
  }
  document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Xóa các mục trong mảng

Sử dụng từ khóa delete để xóa các mục khỏi một mảng:

delete myObj.cars[1];

Ví dụ:

<!DOCTYPE html>
<html>
<body>

<p>How to delete properties of an array.</p>

<p id="demo"></p>

<script>
  var myObj, i, x = "";
  myObj = {
    "name":"John",
    "age":30,
    "cars": ["Ford","BMW","Fiat"]
  }
  delete myObj.cars[1];
  
  for (i in myObj.cars) {
    x += myObj.cars[i] + "<br>";
  }
  document.getElementById("demo").innerHTML = x;
</script>

</body>
</html>

Nếu bạn có điều thắc mắc, bạn hãy comment cho V1Study để được giải đáp.
Bài viết này được chia sẻ bởi LongDT. Nếu bạn muốn chia sẻ bài viết, bạn hãy Đăng ký làm thành viên!
« Prev
Next »
Copied !!!