[React] 고유한 id값 만들기 - Date.now(), uuid

yeon·2023년 4월 29일
0

React

목록 보기
2/3

post 요청을 보낼 때 백엔드에서 id를 알아서 부여해주면 쓸 일이 없지만, 개인 프로젝트를 진행할 때는 고유한 id값을 부여해야 할 때가 많았다. 그동안은 Date.now()만 썼었는데, uuid도 이번에 알게 돼서 고유한 id값을 만드는 여러 방법을 정리해볼 것이다.

Date.now()

milisecond까지 나타내주는 Date() 생성자를 생성해 고유한 id값을 만들 수 있다.

{
	id: Date.now(),
    title: "",
}

uuid 라이브러리

npm install uuid
npm i --save-dev @types/uuid // TypeScript 사용 시

설치한 후 import 하여 고유한 id값이 필요한 부분에 uuid를 함수처럼 호출해주면 고유한 id를 생성해준다.

import { v4 as uuidv4 } from "uuid";

{
	id: uuidv4(),
    title: "",
}

Math.random()

{
	id: Math.floor(Math.random() * 100),
    title: "",
}

이 방법도 있지만, 이 경우는 랜덤한 숫자기 때문에 온전히 고유한 값이 나오지는 않을 가능성이 존재한다.

Math.random()을 고유한 id로 사용할 경우 문제

This is okay for generating less than 10 thousand unique IDs, but any more than 10 thousand and you are going to run into collisions.

느낀점

아무래도 uuid는 라이브러리를 따로 설치해야 하는 부담이 있기 때문에 Date.now() 방식을 더 자주 쓸 것 같은데, Date.now()uuid 중 어떤 방법이 더 자주 쓰이는지, 성능상 차이는 있는지 더 찾아봐야겠다.

0개의 댓글