SOURCE

let index = 0;
let arr = [];
console.clear();
function useState(value) {
  arr[index] = arr[index] || value; //这步很关键每次render都会调用useState
  let curIndex = index;
  let state = arr[index++];
  function setState(newVal) {
    arr[curIndex] = newVal; //用固定下来的index做覆盖操作
    // console.info(arr);
    render();
  }
  // console.info(arr);
  return [state, setState]
}

function useEffect(callback, params) {
  // console.info(arr[index],params);
  const isChange = arr[index] ? arr[index].some((item, i) => item != params[i]) : true;
  // console.info(isChange);
  if (!params || isChange) {
    callback();
    arr[index] = params;
    console.info(arr);
  }
  index++;
}

let times = 0;
function render() {
  index = 0;
  const[count, setCount] = useState(0);
  const[name, setName] = useState('a');
  // useEffect(() => console.info(count), [count]);
  useEffect(() => {
    setTimeout(() => {
      console.info(count)
      // console.log("3 秒前 count = 0，现在 count =", count);
    }, 3000);
  });
  
  while (times++<1) {
    // setCount(count);
    //  setTimeout(() => {
    //   console.log("3 秒前 count = 0，现在 count =", count);
    // }, 3000);
    setCount(count + 2);
  }
  // console.info(count);
}
render();

实现原理：使用一个数组进行状态的存储，每次更新状态都是覆盖对应下标的元素，所以固定下标和重置index计数的操作，对于正确覆盖和正确取值来说是关键的。
useEffect实现也很简单，实现围绕着控制callback的调用时机即可。