Working with Objects in React

Exploring various ways objects are used within React libraries

Modern apps rely heavily on objects and their properties

This article aims to break down a range of scenarios where objects are used in React and React Native.

The concepts discussed here can also be applied to React JS (React for the web), as the features of the two versions are identical at the component level. Where React for the DOM and React Native differ is their handling of components (pertaining to DOM elements or native mobile components), not in the framework’s defining features like components, props, state, refs, context, and others.

Mobile apps of today rely on complex objects to represent a range of data types and values, that range from component props to server responses, objects to arrays (and converting between the two), functions and classes.

A class in JavaScript (introduced in the ECMAScript6 [2015] edition) is a type of function, declared with the class keyword instead of the function keyword and implements the constructor, introduces context with this, class properties, and the ability for instantiation. An object in JavaScript however is a type of variable that can contain many values. Instantiating classes will therefore…