Массив JSON почти такой же, как массив JavaScript. Массив JSON может хранить значения типа string, массив, логическое значение, число, объект или null. В массиве JSON значения разделяются запятыми. Доступ к элементам массива можно получить с помощью оператора [].
Массив JSON бывает разных типов. Давайте разберемся в них с помощью примеров.
Массив строк JSON: массив строк JSON содержит только строковые элементы. Например, приведенный ниже массив содержит 6 строковых элементов: “Ram”, “Shyam”, “Radhika”, “Akshay”, “Prashant” и “Varun”, каждый элемент разделен запятой (,).
["Ram", "Shyam", "Radhika", "Akshay", "Prashant", "Varun"]
Пример: Здесь мы назначим ключу массив строк JSON Для студентов в Объект jsonStringArray. Затем мы обращаемся к первому элементу массива с помощью оператора [ ].
<!DOCTYPE html>
<html>
<body>
<p id="para"></p>
<script>
var jsonStringArray = {
// Assigned a JSON array of strings
// to the key "students".
"students": ["Ram", "Shyam", "Radhika",
"Akshay", "Prashant", "Varun"],
};
// It returned an array. Then we accessed
// the first index of the array
// (which is "Ram") using [] syntax.
var x = jsonStringArray.students[0];
// Set the inner HTML of "para" paragraph
// to the value of variable "x".
document.getElementById("para").innerHTML = x;
</script>
</body>
</html>
Выход:
Ram
Массив чисел JSON: Массив чисел JSON содержит только числовые элементы. Например, приведенный ниже массив содержит 5 элементов, 23, 44, 76, 34, 98.
[23, 44, 76, 34, 98]
Пример: Здесь мы присваиваем ключу массив чисел JSON Метки в Объект jsonNumberArray. Затем мы обращаемся к первому элементу массива с помощью оператора [ ].
<!DOCTYPE html>
<html>
<body>
<p id="para"></p>
<script>
var jsonNumberArray = {
// Assigned a JSON array of numbers
// to the key "marks".
"marks": [23, 44, 76, 34, 98],
};
// It returned an number array.
// Then we accessed the first
// index of the array
// (which is 23) using [] syntax.
var x = jsonNumberArray.marks[0];
// Set the inner HTML of "para" paragraph
// to the value of variable "x".
document.getElementById("para").innerHTML = x;
</script>
</body>
</html>
Выход:
23
Массив логических значений JSON: Массив логических значений JSON содержит только логические элементы (либо true, либо false). Например, приведенный ниже массив содержит 5 элементов, каждый из которых является либо истинным, либо ложным.
[true, true, true, false, false, true]
Пример: Здесь мы назначаем ключу массив логических значений JSON логический в Объект jsonBooleanArray. Затем мы обращаемся к первому элементу массива с помощью оператора [ ].
<!DOCTYPE html>
<html>
<body>
<p id="para"></p>
<script>
var jsonBooleanArray = {
// Assigned a JSON array of boolean
// to the key "booleans".
"booleans": [true, true, true, false, false, true],
};
// Here we accessed the booleans propery
// of jsonBooleanArray Object.
// It returned an boolean array. Then we accessed the
// first index of the array
// (which is true) using [] syntax.
var x = jsonBooleanArray.booleans[0];
// Set the inner HTML of "para" paragraph
// to the value of variable "x".
document.getElementById("para").innerHTML = x;
</script>
</body>
</html>
Выход:
true
Массив объектов JSON: Объект JSON совпадает с объектом JavaScript. Мы также можем создать массив JSON, содержащий множество объектов JSON, затем мы можем выполнить итерацию по этому массиву или использовать [], чтобы получить нужный нам объект. В приведенном ниже примере в массиве есть три объекта JSON, назначенных ключевым “книгам”. Каждый объект имеет свойство “name” и “author”.
{
"books":[
{"name":"Let Us C", "author":"Yashavant Kanetkar"},
{"name":"Rich Dad Poor Dad", "author":"Robert Kiyosaki "},
{"name":"Introduction to Algorithms", "author":"Cormen"},
]
}
Пример: Здесь мы назначаем массив объектов JSON ключевым книгам в объекте jsonObjectArray. Затем мы обращаемся к первому элементу массива с помощью оператора [ ].
<!DOCTYPE html>
<html>
<body>
<p id="para"></p>
<script>
var jsonObjectArray = {
// Assigned a JSON array of objects
// to the key "books"
"books": [
{
"name": "Let Us C",
"author": "Yashavant Kanetkar"
},
{
"name": "Rich Dad Poor Dad",
"author": "Robert Kiyosaki "
},
{
"name": "Introduction to Algorithms",
"author": "Cormen"
},
]
};
// Here we accessed the books propery of
// jsonObjectArray Object.
// It returned an object array. Then we
// accessed the first index of the array
// (which is an JSON oject) using [] syntax
var x = jsonObjectArray.books[0];
// Set the inner HTML of "para" paragraph
// to the value of variable "x".
document.getElementById("para").innerHTML
= x.name + " by " + x.author;
</script>
</body>
</html>
Выход:
Let Us C by Yashavant Kanetkar
5. Массив массивов JSON ИЛИ многомерный массив JSON: Также возможно создать массив JSON, содержащий другие массивы в качестве элементов в нем. В приведенном ниже примере у нас есть массив JSON, содержащий массивы [“a”, “b”, “c”], [“d”, “e”, “f”], [“g” , “h”, “i”] в этом. Мы можем использовать оператор [ ] для получения массива по любому индексу и снова использовать оператор [ ] для получения элемента выбранного массива.
{
"matrix": [
[ "a", "b", "c" ],
[ "d", "e", "f" ],
[ "g", "h", "i" ]
],
};
Пример: Здесь мы назначаем массив массивов JSON матрице ключей в объекте jsonMultiArray. Затем мы обращаемся к первому элементу массива с помощью оператора [ ].
<!DOCTYPE html>
<html>
<body>
<p id="para"></p>
<script>
var jsonMultiArray = {
// Assigned a JSON array of
// Arrays to the key "matrix".
"matrix": [
["a", "b", "c"],
["d", "e", "f"],
["g", "h", "i"]
],
};
// Here we accessed the matrix propery
// of jsonMultiArray Object.
// It returned an matrix(2D array). Then we
// accessed the first element of
// the first index of matrix using [] syntax.
var x = jsonMultiArray.matrix[0][0];
// Set the inner HTML of "para" paragraph
// to the value of variable "x".
document.getElementById("para").innerHTML = x;
</script>
</body>
</html>
Выход:
a