React-Native
ReactNative / JS study misc.
수동애비
2022. 5. 27. 14:49
반응형
# Object 복제 관련
let obj = { field: 1}
// newObj 는 참조형 인스턴스가 되므로 obj.field 값도 같이 변경된다.
let newObj = obj
newObj.field = 10
// 새로운 인스턴스를 생성하고 모든 필드값이 복제된다. (... 은 전개 연산자)
let newObj = {...person}
# [Hook] useEffect
import { useState, useEffect} from 'react'
export const useClock = () => {
// const [대상변수, set함수(대상변수타입)] = useState(초기값)
// 대상변수는 초기값을 가지고 시작되며 set함수를 호출하여 새값 전달 시 view를 갱신
const [time, setTime] = useState(new Date())
// useEffect(함수, [의존자..])
// 기본적으로 함수가 최소 1회 호출되며 [의존자] 들의 값이 변경될 때마다 호출된다.
useEffect(() => {
const id = setInterval(() => {
setTime(new Date())
}, 4000)
return () => clearInterval(id) // return 으로 반환되는 함수는 컴포넌트가 소멸 시 호출됨.
}, [])
return time
}
# [Hook] useMemo
// 반환값1 = useMemo(함수1, [의존자..])
// 함수1 에서 반환된 값이 반환값1로 반환되며 의존자값들이 변경 시 함수1이 호출되며 뷰가 갱신된다.
const dataArray = useMemo(() => D.makeArray(100).map(getRandom()), [])
# [Hook] useState
// const [대상변수1, set함수(대상타입)] = useState<대상타입>(초기상태값)
const [targetVar, setValue] = useState<number>(0)
// targetVar 는 처음 0 값을 가지게되며 setValue(10) 을 통해 10으로 값이 변경되고 view 를 갱신한다.
setValue(10)