useState Hook
useState, EK, ARRAY, RETURN karta hai — [CURRENT VALUE, UPDATER FUNCTION] — DESTRUCTURING SE, INHE, NAAM DIYE, JAATE, HAIN (jaise, const [count, setCount] = useState(0)). JAB, setCount(), CALL HOTA hai, React, COMPONENT ko, NAYI, VALUE ke, SAATH, RE-RENDER karta hai.
State UPDATES, ASYNCHRONOUS HAIN, aur, "BATCHED" HOTE HAIN — MULTIPLE, setState CALLS, EK, HI, RENDER mein, COMBINE ho sakte hain, PERFORMANCE ke liye. Functional UPDATE FORM (setCount(prev => prev + 1)), USE karna, SAFE hai, JAB, NAYI, VALUE, PURANI, VALUE PAR, DEPEND karti hai.
function Counter() {
const [count, setCount] = React.useState(0);
function increment() {
setCount(prev => prev + 1); // functional update — SAFE
}
return (
<div>
<p>Count: {count}</p>
<button onClick={increment}>+1</button>
</div>
);
}- useState = [value, setter] array RETURN karta hai
- setState calls, ASYNCHRONOUS, aur, BATCHED HOTE HAIN
- Functional update (prev => prev+1), SAFE hai, JAB, purani value, PAR, DEPEND karo
useState(() => computeExpensiveValue()) — FUNCTION, PASS, KARNE, SE, computeExpensiveValue(), SIRF, FIRST, RENDER, PAR, CALL, HOTI, hai. useState(computeExpensiveValue()) — DIRECT, CALL, KARNE, SE, WOH, HAR, RENDER, PAR, RUN, HOTI, hai (RESULT, DISCARD, HO, JAATA, hai, AFTER, FIRST, RENDER), JO, WASTEFUL, hai.
const [state, setState] = useState(() => {
return JSON.parse(localStorage.getItem("data")) || [];
});useState, EK, OBJECT, KE, SAATH, USE, KARТE, WAQT, setState, KO, POORA, NAYA, OBJECT, DENA, PADТA, hai (React, AUTOMATICALLY, MERGE, NAHI, KARTA, jaise, CLASS, COMPONENTS, MEIN, this.setState() KARTA, THA) — spread, OPERATOR, (...prev) SE, EXISTING, FIELDS, PRESERVE, KIYE, JAATE, HAIN.
const [user, setUser] = useState({ name: "", email: "" });
setUser(prev => ({ ...prev, name: "Aarav" })); // email, PRESERVE hota hai