How to access mapped objects in another function in ReactJS ? Last Updated : 30 Sep, 2021 Summarize Comments Improve Suggest changes Share Like Article Like Report Following is the simple approach to access objects of array.map() to another function in React We can directly call the function in array.map() and pass the object in that function to return the required value. Setting up environment and Execution: Step 1: Create React App command npx create-react-app foldernameStep 2: After creating your project folder, i.e., folder name, move to it using the following command: cd foldernameProject Structure: It will look like the following. FIlename: App.js JavaScript import React, { Component } from "react"; class App extends Component { constructor(props) { super(props); this.state = { books: [ { title: "Book Title 1", USD: 10 }, { title: "Book Title 2", USD: 20 }, ], }; } // We want to pass books object in this function // and return Rupees value usdToRupees = (book) => { return book.USD * 75; }; render() { return ( <div> {this.state.books && this.state.books.map((book) => { return ( <div> <h2>{book.title}</h2> <p>USD = {book.USD}</p> {/* We are passing book object to the function */} <p>Rupees = {this.usdToRupees(book)}</p> <hr></hr> </div> ); })} </div> ); } } export default App; Step to Run Application: Run the application using the following command from the root directory of the project: npm startOutput: Now open your browser and go to http://localhost:3000/, you will see the following output: Comment More infoAdvertise with us Next Article How to access nested object in ReactJS ? P pratikraut0000 Follow Improve Article Tags : ReactJS Technical Scripter 2020 Similar Reads How to access nested object in ReactJS ? To access a nested object in react we can use the dot notation. But if we want to access an object with multi-level nesting we have to use recursion to get the values out of it. PrerequisitesReact JS NPM & Node.jsJavaScript ObjectApproachThe structure of an object in React JS can be nested many 2 min read How to call function inside render in ReactJS ? In React JS, the render method is a fundamental part of a component's lifecycle. It is responsible for rendering the component's JSX markup onto the DOM. While the render method itself should primarily handle rendering JSX, there are scenarios where you may need to call a function inside the render 3 min read How to access props inside a functional component? React is an open-source JavaScript library that is mainly used for developing User Interface or UI components. It is a single-page application that is popularly used for developing dynamic web interfaces. While building a React application, the React components serve as basic building blocks. In Rea 3 min read How to target Nested Objects from a JSON data file in React ? Accessing nested JSON objects is similar to accessing nested arrays. Suppose we have a JSON object called person with a nested object 'address' , and we want to access the 'city' property from the address object. We can do this using dot notation like person.address.city. This notation allows us to 3 min read How to create a Functional Component in React? To create a functional component in React, you define a JavaScript function that returns JSX. These components are stateless and rely on props for data input. Functional components are concise, easy to read, and can utilize React Hooks for managing state and side effects, making them a fundamental b 2 min read How to create Functional Components in React ? To create a functional component in React, you define a JavaScript function that returns JSX. These components are stateless and rely on props for data input. Functional components are concise, easy to read, and can utilize React Hooks for managing state and side effects, making them a fundamental b 2 min read Like