useEffect cleanup function explained

I don't understand the cleanup function in React's useEffect. When does it run and why do I need it?

useEffect(() => {
  // setup
  return () => {
    // cleanup - when does this run?
  };
}, [dependency]);

Can someone explain with practical examples?