REACT_ForEach

<forEach() 함수 사용하기>

-배열 함수 forEach() : 

for문에서 사용했던 순번과 배열의 크기 변수를 사용하지 않음

배열의 처음부터 마지막 순번까지 모두 작업하는 경우 forEach() 문을 사용하는 것이 간편함

하지만 특정 순번에서만 배열 값을 사용하거나 변경해야 하는 상황이라면 for문을 사용

 

- R014_ForEach.js

import React, {Component} from 'react';

class R014_ForEach extends Component {
    componentDidMount() {
        var For_Arr = [3,2,8,8];
        var For_newArr = [];
        for (var i = 0; i < For_Arr.length; i++) {
            For_newArr.push(For_Arr[i]);
        }
        console.log("1. For_newArr : [" + For_newArr + "]");
        var ForEach_Arr = [3,3,9,8];
        var ForEach_newArr = [];
        ForEach_Arr.forEach((result)=> {
            ForEach_newArr.push(result);
        })
        console.log("2. ForEach_newArr : [" + ForEach_newArr + "]");
    }
    render(){
        return(<h2>[THIS IS ForEach]</h2>)
    }
}
export default R014_ForEach;

 

- App.js

import React from 'react';
import './App.css'; 
//App.css가 App.js 보다 더 한 단계 상위 폴더에 있다면  
//'./..App.css'

import ForEach from './R014_ForEach.js';

function App() {
  return (
    <div>
      <h1>Start React 200!</h1>
      <p>css 적용하기</p>
      <ForEach/>
    </div>
  );
}

export default App;

 

결과