What is Three Dots {...} & Handle object using UseState Hook

Normal Method

import React, { useState } from 'react'

export const NewComp = () => {
    const [myValue, setMyValue] = useState({
        name: 'shreyash kolhe', age : '21', degree:"MCA"
    })
    const changeObject=()=>{
        setMyValue({
            name: 'Shreyash DADA', age : '41', degree:"BCA"
        })
    }
    return (
        <>
            <h1>Hello world</h1>
            <p>My name is {myValue.name} and Age:{myValue.age} and Degree: {myValue.degree}</p>
            <button onClick={changeObject}>Updata</button>
        </>
    )
}

export default NewComp;

Using Spread Operator

import React, { useState } from 'react'
export const NewComp = () => {
    const [myValue, setMyValue] = useState({
        name: 'shreyash kolhe', age : '21', degree:"MCA"
    })
    const changeObject=()=>{
        setMyValue({
            ...myValue,
            name : 'pappu dada'
        })
    }
    return (
        <>
            <h1>Hello world</h1>
            <p>My name is {myValue.name} and Age:{myValue.age} and Degree: {myValue.degree}</p>
            <button onClick={changeObject}>Updata</button>
        </>
    )
}
export default NewComp;