Question

我有一个状态对象，该对象具有字符串的“文本”属性。我也有一个删除处理程序方法来删除单击的char。如果我在一行中完成所有工作，则join（''）不起作用，React将其存储为数组而不是字符串。但是，如果我在join（''）之后创建一个用于存储的新变量，则它可以正常工作。

//这存储为-> [h，e，y]

let textArr = [...this.state.text].splice(index, 1).join('');
this.setState({text: textArr});

//但是，这个效果很好，如->'嘿'

    let textArr = [...this.state.text];
    textArr.splice(index, 1);
    let text = textArr.join('');
    this.setState({text});

为什么第一个代码不能按预期工作，而第二个代码可以工作？

Answer 1

这是因为您对拼接的结果应用了join：

let textArr = [...this.state.text].splice(index, 1).join('');

它等效于：

let str= [...this.state.text]
let temp = str.splice(index, 1)
let textArr = temp.join('');

Answer 2

您在此处使用拼接。 splice（）方法在数组中添加/删除项目，并返回删除的项目。因此，基本上在第一行中，您将对已删除项目应用联接。例如下面

var arr1 = [1,2,3,4,5,6];
//here result will be equal to join of removed items
var result = [...arr1].splice(1,2).join('');
console.log(result) //it will give '23'

现在向您介绍第二种逻辑。在这里，您是在实际数组上执行联接，而不是通过splice（）返回数组。参见以下示例：

var arr1 = [1,2,3,4,5,6];
var arr2 = [...arr1]; //value of arr2 now is [1, 2, 3, 4, 5, 6]
arr2.splice(1,2); //value of arr2 now is [1, 4, 5, 6]
var result = arr2.join(''); 
console.log(result) //you will see "1456" in console

我希望它能弄清为什么第一个代码不能按您期望的那样工作。

除非我将join（''）存储到新变量中，否则它不起作用

2 个答案: