labike
labike

Reputation: 15

in React, why setState() Priority execution than setTimeout?

in React, setState() is async function, and setTimeout() is also async function(somebody think, in some condition, setState() may be sync function?), why setState() priority excution than setTimeout()?

componentDidMount(){
    this.setState({val: this.state.val + 1}, ()=>{
        console.log("In callback " + this.state.val);
    });
    console.log("Direct call " + this.state.val);   
    setTimeout(()=>{
        console.log("begin of setTimeout" + this.state.val);
        this.setState({val: this.state.val + 1}, ()=>{
            console.log("setTimeout setState callback " + this.state.val);
        });
        setTimeout(()=>{
            console.log("setTimeout of settimeout " + this.state.val);
        }, 0);
        console.log("end of setTimeout " + this.state.val);
    }, 0);
}

> Direct call 0
> In callback 1
> begin of setTimeout 1
> setTimeout setState callback 2
> end of setTimeout 2
> setTimeout of settimeout 2

Upvotes: 1

Views: 745

Answers (1)

Sagar
Sagar

Reputation: 1424

There is no need to use setTimeout. setState function does support callback function.

setState(updater[, callback])

Upvotes: 2

Related Questions