react中useState的使用

import { useState } from 'react'
function FunComponent() {
    const [man, setMan] = useState({ name: 'malinshu', tall: 180 })
    const setName1 = () => {
        setMan({ name: 'ma' })
        console.log(man)//{name: "malinshu", tall: 180}页面更新成了{ name: 'ma' }，setMan是异步的
    }
    const setName2 = () => {
        man.name = 'lin'
        setMan(man)
        console.log(man)//{name: "lin", tall: 180}页面没更新,因为man的内存地址没变
    }
    const setName3 = () => {
        setMan({ ...man, name: 'shu' })
        console.log(man)//{name: "malinshu", tall: 180}页面更新成了{ name: 'shu', tall: 180 }，setMan是异步的
    }
    return (
        <div>
            {JSON.stringify(man)}
            <button onClick={() => { setName1() }}>更姓换名1</button>
            <button onClick={() => { setName2() }}>更姓换名2</button>
            <button onClick={() => { setName3() }}>更姓换名3</button>
        </div>
    )
}
export default FunComponent

总结：setState时，必须给它设置一个新的内容空间，才会引起页面的更新，而且，useState是异步的，在点击“更姓换名1”时，页面更新了，但控制台打印的还是旧的值