top of page
Logo der Online Agentur mdwp

Array

In ReactJS, an array is a built-in JavaScript datatype that holds an ordered list of items of various types, such as numbers, strings, objects, and even other arrays. It allows developers to gather data and access or manipulate it with a variety of built-in methods.

Arrays in React can be utilized in various ways, including to render multiple components or generate lists of elements in the UI. Rendering arrays is commonly done in conjunction with the map( ) function, which iterates over the elements of the array and transforms each one.

Here is an example of how an array would be used in React:

```javascript
import React from "react";

class App extends React.Component {
constructor() {
super();
this.state = {
items: ["Apple", "Banana", "Cherry"]
};
}

render() {

return (
<ul>
{this.state.items.map(item => <li>{item}</li>)}
</ul>
);
}
}

export default App;
```

In this piece of code, we have an array `items` in the state which contains a list of fruits. In the render method, we're using the map function to generate a list element `<li>` for each item in the array. This will display a bulleted list of fruit names on the page.

Remember to provide a unique "key" property for each child in a list when you are using an array to generate JSX in React. This is necessary for React to maintain state between re-renders and improve performance.

bottom of page