JSON and Data Shapes

JSON Arrays

Work with an array of JSON records.

json-arrays JSON arrays often hold records with the same fields. Parse the text, then use array methods to select the records you need.

JSON Arrays

minimum
json_arrays.js
Replay: real traced execution (multi-file project)
const minimum = 2;
const text = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";
const firstName = JSON.parse(text)[0].name;
const kept = JSON.parse(text)
  .filter((item) => item.qty >= minimum)
  .map((item) => item.name)
  .join(",");

console.log("minimum=" + minimum);
console.log("first=" + firstName);
console.log("kept=" + kept);

const minimum = 3;
const text = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";
const firstName = JSON.parse(text)[0].name;
const kept = JSON.parse(text)
  .filter((item) => item.qty >= minimum)
  .map((item) => item.name)
  .join(",");

console.log("minimum=" + minimum);
console.log("first=" + firstName);
console.log("kept=" + kept);

const minimum = 5;
const text = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";
const firstName = JSON.parse(text)[0].name;
const kept = JSON.parse(text)
  .filter((item) => item.qty >= minimum)
  .map((item) => item.name)
  .join(",");

console.log("minimum=" + minimum);
console.log("first=" + firstName);
console.log("kept=" + kept);

  1. minimum ← 2, text ← [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}]

    1const minimum→ 2 = 2; //@minimum=3, 52const text→ [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}] = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";3const firstName→ red = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])[0].name;4const kept→ blue,green = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])5  .filter((item) => item.qty >= minimum)6  .map((item) => item.name)7  .join(",");89console.log("minimum=" + minimum2);10console.log("first=" + firstNamered);11console.log("kept=" + keptblue,green);
    outputminimum=2
first=red
kept=blue,green

  1. minimum ← 3, text ← [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}]

    1const minimum→ 3 = 3;2const text→ [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}] = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";3const firstName→ red = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])[0].name;4const kept→ blue,green = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])5  .filter((item) => item.qty >= minimum)6  .map((item) => item.name)7  .join(",");89console.log("minimum=" + minimum3);10console.log("first=" + firstNamered);11console.log("kept=" + keptblue,green);
    outputminimum=3
first=red
kept=blue,green

  1. minimum ← 5, text ← [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}]

    1const minimum→ 5 = 5;2const text→ [{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}] = "[{\"name\":\"red\",\"qty\":1},{\"name\":\"blue\",\"qty\":4},{\"name\":\"green\",\"qty\":6}]";3const firstName→ red = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])[0].name;4const kept→ green = JSON.parse(text[{"name":"red","qty":1},{"name":"blue","qty":4},{"name":"green","qty":6}])5  .filter((item) => item.qty >= minimum)6  .map((item) => item.name)7  .join(",");89console.log("minimum=" + minimum5);10console.log("first=" + firstNamered);11console.log("kept=" + keptgreen);
    outputminimum=5
first=red
kept=green