useState实现原理

useState 函数作用：声明状态和修改状态的函数
关于 useState 的用法是，需要传入一个参数作为状态的初始值，当函数执行后会返回两个值，一个是当前状态的属性，一个是修改状态的方法
（废话不多说）

let state = []
let setters = []
let index = 0

function createState(index) {
return function (newState) {
state[index] = newState
render()
}
}

function useState(initData) {
state[index] = state[index] ? state[index] : initData
setters.push(createState(index))
let value = state[index]
let setter = setters[index]
index ++
return [value, setter]
}

function render () {
index = 0
ReactDOM.render(, document.getElementById(‘root’))
}

export default function App() {
const [count, setCount] = useState(0)
const [name, setName] = useState(‘张三’)
return (

{ count }
<button onClick={() => setCount(count + 1)} >setCount
{ name }
<button onClick={() => setName(‘李四’)}>setName

)
}