Javascript 使用函数更新状态。map()是变异状态吗?

Javascript 使用函数更新状态。map()是变异状态吗?,javascript,reactjs,Javascript,Reactjs,我还是个新来的反应者,我还是不太了解变异状态 我看过很多关于这方面的帖子,但我不明白突变过程是如何发生的,所以我认为有必要问这个问题 首先我需要知道这叫做变异状态吗? this.setState(prevState=>({ colors:this.state.colors.map((c,i)=>{ return{ original_color:c.original_color, h

我还是个新来的反应者,我还是不太了解变异状态

我看过很多关于这方面的帖子,但我不明白突变过程是如何发生的,所以我认为有必要问这个问题

首先我需要知道这叫做变异状态吗?

this.setState(prevState=>({
        colors:this.state.colors.map((c,i)=>{
            return{
                original_color:c.original_color,
                hex_color:c.hex_color,
                isActive:false
            }
        })
    }))

let newData = this.state.colors.map((c,i)=>{
            return{
                original_color:c.original_color,
                hex_color:c.hex_color,
                isActive:false
            }
        })

        this.setState({
            colors: newData
        })
在这种情况下,我只想将所有这些值
isActive
设置为
false

最后一次

我想将此值设置为空

  this.setState({
            colors:[]
        })

你的状态在任何情况下都不会发生变异
.map()
返回一个新数组。只有在不调用
.setState()
而直接将状态赋值给另一个值时,状态才会发生变化,如下所示:

this.state.value = anotherValue;
或:

由于
.map()
返回一个新数组作为结果,因此使用它是安全的,不被视为变异


基本上,任何不改变原始状态或对原始状态的任何直接引用的行为都不会被视为突变。

映射并像您那样返回,不会以上述任何方式对状态进行突变。但是,在第一个模式中,您需要像
this.setState(prevState=>({colors:prevState.colors.map((c,i)=>{return{original\u color:c.original\u color,hex\u color:c.hex\u color,isActive:false}})那样使用它。
。另外,变异意味着在同一引用处更新值最后一种情况如何@ShubhamKhatrisetState不会改变原始数组。它会创建它的新副本。变异状态:
this.state.colors=YourObject
,在这两种情况下,您都没有这样做,两种情况看起来都很好
this.state.value.push(anotherValue)