logo

Цикличен масив в React JS | Пример за цикъл React Foreach

В този раздел ще използваме масив, за да обясним естествения цикъл на достигане в изобразяването. За това сме описали пример за масив от цикъл на реакция в изобразяването. Когато искаме да създадем каквото и да е уеб приложение, е много важно да имаме познания за работа с масив от данни. В този пример ще видим използването на loop in реагирам js . В нашия пример ще използваме for цикъл в react js. За да направим това, трябва да следваме някои стъпки.

В този раздел ще използваме приложението React. Когато имаме нужда от map, foreach цикъл и for цикъл в реакцията, можем да разгледаме следния пример, за да научим използването на цикличен масив n react js. В масива винаги искаме for цикъл и foreach цикъл. Когато искаме да обхванем нашия масив в обхват, ще е необходима карта, за да направим това. Така че ще обясним примера на карта в react native. Нов масив се създава от метода map(). В извикващия масив той предоставя резултата от извикване на функция за всеки елемент. Процесът на зацикляне може да бъде опростен по този начин. Когато използваме картата, не изискваме използването на функция forEach и for цикъл. Карта, forEach цикъл, for цикъл има много разлики. Вместо да презаписва съществуващите данни, функцията map използва данните и създава нов масив. Поради всички функции и простотата на функцията за карта, документите на React силно ни насърчават да използваме функцията за карта.

Ще предоставим два примера в приложението React, за да обясним тази лесна концепция. В първия пример ще опишем реагиращия цикъл, който има едномерен масив. Във втория пример ще опишем цикъл, който има многоизмерен масив. И двата примера са както следва:

Пример 1:

rc/App.js

 import React from &apos;react&apos;; function App() { const myArray = [&apos;Jack&apos;, &apos;Mary&apos;, &apos;John&apos;, &apos;Krish&apos;, &apos;Navin&apos;]; return ( <table class="table"> <tr> <th>ID</th> <th>Name</th> <th>Email</th> </tr> {students.map((student, index) =&gt; ( <tr> <td>{student.id}</td> <td>{student.name}</td> <td>{student.email}</td> </tr> ))} </table> ); } export default App; 

След като стартираме този пример, ще получим следния преглед:

Loop Array в React JS