useState 的用法：
const [count, setCount] = useState(0);
可以看到 useState 返回的是一个数组，那么为什么是返回数组而不是返回对象呢？
要回答这个问题得弄明白 ES6 的解构赋值(destructring assignment)语法 , 来看 2 个简单的示例：
- 数组的解构赋值：
const foo = ["one", "two", "three"];
const [red, yellow, green] = foo;
console.log(red); // "one"
console.log(yellow); // "two"
console.log(green); // "three"
- 对象的解构赋值：
const user = {
id: 42,
is_verified: true,
};
const { id, is_verified } = user;
console.log(id); // 42
console.log(is_verified); // true
搞清楚了解构赋值，那上面的问题就比较好解释了。
如果 useState 返回数组，那么你可以顺便对数组中的变量命名，代码看起来也比较干净。而如果是对象的话返回的值必须和 useState 内部实现返回的对象同名，这样你只能在 function component 中使用一次，想要多次使用 useState 必须得重命名返回值。
// 第一次使用
const { state, setState } = useState(false);
// 第二次使用
const { state: counter, setState: setCounter } = useState(0);
当然事情总是有两面性的，使用 array 也存在一些问题：
- 返回值强顺序，灵活性比较低。array[0] 为值，array[1] 为改变值的方法。
- 返回的值基本都得使用，对于有些返回值不想使用的话代码看起来有些怪，比如只想用 setState, 就得这么写：
const [, setState] = useState(false)。 - 返回的参数不能太多，否则处理上面 2 个场景会很麻烦。
如果在自定义的Hook中遇到了以上几个问题，不妨试试返回 object。
简单总结一下，在自定义 hook 的时候可以遵循一个简单原则：当参数大于 2 个的时候返回值的类型返回 object， 否则返回数组。