将其保存到变量时状态发生了什么？

Question

我正在使用Spotify API进行一些测试，发现这一点很奇怪。

基本上，我将变量public protocol FetchRequestProtocol: class { var objectID: NSManagedObjectID { get } } protocol TemporaryProtocol: FetchRequestProtocol { var core: Core { get } } extension TemporaryProtocol { var temp: Self { return core.temporaryContext.object(with: self.objectID) as! Self } } extension Account: TemporaryProtocol {} extension Transaction: TemporaryProtocol {} extension Category: TemporaryProtocol {} 设置为等于状态。然后，我只想更新testarr变量。但是，当我运行此功能并将状态testarr和songList登录到控制台时，它们是相同的。我感到奇怪的是，我从未更新过状态，所以如何更改？

testarr

Answer 1

当您像这样设置变量时：

let testarr = this.state.songList;

实际上，您根本没有创建其他数组。您的新testarr变量实际上将原始数组指向此处。因此，当您更改新数组时，原始数组也会更改。

const foo = [ 1, 2, 3 ];
const bar = foo;
bar[0] = 100;
console.log( foo );

您不应该这样改变状态。您可以像这样使用spread syntax创建一个新数组：

let testarr = [ ...this.state.songList ];

或者您更喜欢concat，它也不会改变原始数组：

let testarr = this.state.songList.concat( [] );

通过这种方式，当您更改新的testarr原始副本时，它会保持原样。

const foo = [ 1, 2, 3 ];
const bar = [ ...foo ];
bar[0] = 100;
console.log( foo );

因此，在使用React进行编码时，切勿改变您的状态。始终使用传播语法或concat方法进行复制。更改数组时，请使用slice而不是splice，因为后者也会改变原始数组。

此概念也适用于对象。不要变异它们。