Grouping Data with JSON Arrays

JSON (Javascript Object Notation) is a human-readable data format designed for easy handling within Javascript. An important data type within JSON is the JSON array, which is similar to a Javascript array but is not directly defined in the Javascript standard.

JSON arrays are part of the JSON standard, which is distinct from the Javascript standard. The main difference between JSON arrays and Javascript arrays is that JSON arrays are always static, while Javascript arrays are dynamic.

In this article, we define what JSON arrays are and how they differ from Javascript arrays. The two data structures are similar, so it is important to understand the differences in how they are used.

JSON Arrays Overview

JSON arrays group valid JSON data types together. A JSON array may contain any valid JSON data type, and may also contain duplicate values. This article covers valid data types in the next section.

Define JSON arrays by surrounding lists of JSON data types with square brackets. Separate every value in the JSON array with a comma. You may use any amount of whitespace you wish, including newline characters, to separate values.

The following JSON arrays are equivalent.

["A", "B", "C", "D"]

[
    "A", "B",
    "C", "D"
]

JSON Array Data Types

JSON arrays can hold information in six basic data types:

• String: Zero or more Unicode characters surrounded by quotation marks.
• Number: Whole or decimal number. It may be signed, may contain a fractional part, and may use exponential E notation.
• Boolean: True or false value, specified by the keywords true or false.
• Null: An empty value, specified by the keyword null.
• Object: Collection of key-value pairs. Objects are declared with curly braces. Keys and values are separated by colons, while key-value pairs are separated by commas. Every key within an object must be unique.
• Array: Ordered list of zero or more elements of any data type, including null values, objects, and duplicates. Arrays are declared with square brackets and elements are separated by commas.

Nesting JSON Arrays

JSON arrays can hold other JSON arrays inside of them, a technique called “nesting.” This is a common strategy for data architecture when creating grids or tables of information.

// A JSON table containing 3 rows with 4 columns each
[
    ["A", "B", "C", "D"],
    ["E", "F", "G", "H"],
    ["I", "J", "K", "L"]
]

Each nesting of a JSON array is called a “dimension.” Assuming an array has “n” dimensions, the standard way of referring to nested JSON arrays is that they are “n-dimensional.”

The previous example is 2-dimensional, but there is no limit to the number of dimensions a nested JSON array may contain. For readability and maintenance purposes, it is usually easiest to restrict dimensions to 3 or less. The following 3-dimensional example shows how complicated multidimensional JSON arrays can become, even with indenting and added spacing for readability.

// A JSON 3-dimensional array
[
    [
        ["A", "B", "C", "D"],
        ["E", "F", "G", "H"],
        ["I", "J", "K", "L"]
    ],
    [
        ["1", "2",  "3",  "4" ],
        ["5", "6",  "7",  "8" ],
        ["9", "10", "11", "12"]
    ]
]

Javascript Arrays vs. JSON Arrays

JSON arrays are simpler than Javascript arrays because they have a more restricted set of values. Javascript arrays, since they’re dynamically created inside a running computer program, can hold functions, references, and the results of calculations. A static data format like JSON cannot accurately represent these things.

Since JSON arrays are static, you cannot access different elements individually the way you could with a Javascript array. JSON arrays are plain text; they require conversion into Javascript arrays before you can access or manipulate their content.

It is possible to convert JSON arrays into Javascript arrays using the JSON.parse() function. Conversion in the other direction, from Javascript arrays into JSON arrays, happens with the JSON.stringify() function.

Conclusion

JSON arrays group data together within JSON objects and are a critical JSON data type. They can be structured as simple lists, 2-dimensional tables, or complex multidimensional arrays.

JSON arrays hold fewer data types and simpler data than Javascript arrays, but you can convert between the two array types if necessary. Since they’re built almost identically, conversion is easy with JSON.parse() and JSON.stringify().

Enroll in our Intro to Programming Nanodegree Program today to learn more about JSON arrays and other programming concepts.

Start Learning