function MyReact() {
// 상태 목록
const values = []
// 각 상태의 초기화 여부 목록
const isInitialized = []
// 상태를 가리킨다
let cursor = 0
// 상태 목록에서 사용할 cursor를 받는다
function useState(cursor: number, initilaValue = "") {
const { forceUpdate } = useForceUpdate()
// 지정한 상태의 초기화 여부 값을 조회한다
if (!isInitialized[cursor]) {
// 지정한 상태의 값을 설정한다
values[cursor] = initilaValue
isInitialized[cursor] = true
}
// 지정한 상태를 조회한다
const value = values[cursor]
const setValue = (value: any) => {
// 지정한 상태의 값을 변경한다
values[cursor] = value
forceUpdate()
}
return [value, setValue]
}
// 커서 초기화 함수
function resetCursor() {
cursor = 0
}
return {
useState,
resetCursor
}
}
JavaScript
복사
게으른 초기화
•
useState 초깃값으로 변수대신 함수를 전달
•
최초 랜더링 시에만 실행되어 무거운 연산이 필요한 경우 자원을 아낄 수 있음
