[react] 카운트다운 구현 (ft. 5, 4, 3, 2, 1)
보통 게임에 많이 사용하는 카운트다운을 react로 구현합니다. 구현 영상 카운드다운 react 코드 import React, { useRef, useState, useEffect } from 'react'; const Count = () => { const [num, setNum] = useState(5) const [openResult, setOpenResult] = useState(false) const timeRef = useRef([]) useEffect(() => { for (let i = 1; i 0) { console.log('i', i) timeRef.current[i] = setTimeout(() => { setNum(num - 1) }, i * ..
[js] 자바스크립트로 시간차 지연 출력 (ft. for문, setTimeout, react)
자바스크립트에서 시간차, 지연을 위한 구현 방법입니다. 자바스크립트를 이용하여 시간차를 두고 출력하는 방법은 setTimeout와 async를 이용한 방법이 있습니다. 여기서 데이터의 양이 많을 경우, for문과 map을 이용해 setTimeout 을 사용하는 방법이 좋습니다. for문, setTimeout 예제 1초 마다 0부터 4까지 시간차로 출력됩니다. const data = [1, 2, 3, 4, 5] for (let i = 0; i { console.log(i) }, i * 1000) } //결과 //0 //1 //2 //3 //4 map, for문, setTimeout 예제 데이터의 양이 많을 경우 map과 함께 이용하여 데..
