useState:- State को manage करने के लिए।
- उदाहरण:
const [state, setState] = useState(initialValue);
useEffect:- Side effects (जैसे, data fetching, DOM updates) को handle करने के लिए।
- उदाहरण:
useEffect(() => { /* effect */ }, [dependencies]);
useContext:- Context API से data प्राप्त करने के लिए।
- उदाहरण:
const contextValue = useContext(MyContext);
useReducer:- Complex state logic के लिए (Redux की तरह)।
- उदाहरण:
const [state, dispatch] = useReducer(reducer, initialState);
useRef:- DOM element या mutable values को reference करने के लिए।
- उदाहरण:
const myRef = useRef(initialValue);
useMemo:- Expensive computations को memoize करने के लिए, जिससे performance improve हो।
- उदाहरण:
const memoizedValue = useMemo(() => computeExpensiveValue(a, b), [a, b]);
useCallback:- Functions को memoize करने के लिए, ताकि unnecessary re-creations से बचा जा सके।
- उदाहरण:
const memoizedCallback = useCallback(() => { /* function */ }, [dependencies]);
useLayoutEffect:useEffectकी तरह है, लेकिन यह DOM mutations के बाद synchronously run होता है।- उदाहरण:
useLayoutEffect(() => { /* effect */ }, [dependencies]);
useImperativeHandle:- Child component से methods expose करने के लिए, ताकि parent component उन methods को access कर सके।
- उदाहरण:123useImperativeHandle(ref, () => ({focus: () => { myInputRef.current.focus(); }}));