Stale closure là gì và cách phòng tránh?

Stale closure xảy ra khi closure nắm giữ giá trị cũ của biến thay vì giá trị mới nhất.

Thường gặp trong React hooks khi useEffect capture state cũ:

javascript

// Bug: stale closure
const [count, setCount] = useState(0);
useEffect(() => {
  const id = setInterval(() => {
    setCount(count + 1); // "count" luôn là 0 (stale)
  }, 1000);
  return () => clearInterval(id);
}, []); // [] → chạy 1 lần, capture count=0 mãi mãi

// Fix 1: functional update (không cần capture count)
setCount(c => c + 1);

// Fix 2: thêm dependency
}, [count]);

// Fix 3: useRef để giữ latest value
const countRef = useRef(count);
countRef.current = count; // luôn cập nhật

Xem toàn bộ JavaScript cùng filter theo level & chủ đề con.

Mở danh sách JavaScript