React 에서 (current) => 의 의미

가니메데·2023년 3월 14일
0

리액트

목록 보기
2/4
post-thumbnail

React에서 (current) => {} 는 함수형 컴포넌트에서 useState와 함께 사용될 때, 상태값을 업데이트하는 함수를 정의하는 방법 중 하나이다. useState를 사용하면 해당 상태값과 그 값을 업데이트하는 함수를 배열로 반환하며, (current) => {}는 이 업데이트 함수를 정의하는 부분이다.

예시:

import React, { useState } from 'react';

function Counter() {
  const [count, setCount] = useState(0);

  const handleClick = (current) => {
    setCount(current + 1);
  };

  return (
    <div>
      <p>You clicked {count} times</p>
      <button onClick={() => handleClick(count)}>Click me</button>
    </div>
  );
}

위 예시에서 handleClick 함수는 현재 count 값을 받아와서 setCount 함수를 통해 값을 업데이트한다.

(current) => {}와 유사한 다른 예시로는 map 함수에서 사용되는 콜백 함수가 있다. map 함수에서는 배열의 각 요소에 대해 콜백 함수를 실행하며, 이때 콜백 함수의 매개변수로 현재 요소의 값이 전달된다.

예시:

const numbers = [1, 2, 3, 4, 5];

const doubled = numbers.map((current) => {
  return current * 2;
});

console.log(doubled); // [2, 4, 6, 8, 10]

위 예시에서 map 함수의 콜백 함수는 (current) => {} 형태로 작성되었으며, 현재 요소의 값을 받아와서 2배한 값을 반환한다.

profile
비전공/개발신입/초보개발자 since 2021

0개의 댓글