8 React Native Things That Look Simple but Work Differently Than You Think

Not a Medium Member? “Read For Free”

1. JSON.stringify

Your app keeps data in objects and arrays. But when you save it to storage or send it to a server, it has to become plain text first.

JSON.stringify does that:

const record = { id: 7, tags: ['red', 'blue'], done: true };

JSON.stringify(record);
// {"id":7,"tags":["red","blue"],"done":true}

That’s fine for a computer, but hard for a person to read. So there’s a little secret: a third value that adds spaces and new lines.

JSON.stringify(record, null, 2);
// {
//   "id": 7,
//   "tags": [
//     "red",
//     "blue"
//   ],
//   "done": true
// }

The 2 means “push each level in by 2 spaces”. You can use any number, or even '\t' to use tabs. The null in the middle is for something else, and you can just leave it as null.

In the demo, the same small object sits in a card. Tap 0 and it squashes into one line. Tap 2 or 4 and it spreads out, nice and neat. Tap ⇥ and it uses tabs.