Javascript 为什么切片返回空数组？

我有一套布尔人

const [locks, setLock] = useState([false, false, false, false]);

目标：我正在尝试通过切片旧锁数组来更改基于索引的值

问题：如果值为1，则数组的最后一部分（

锁定.slice（值+1）

）返回为空

slice不应该将数组中选定的元素作为新的数组对象返回，这样就不会改变locks数组了吗

function handleLock(event) {
      const {value} = event.currentTarget;
      const oldLock = locks[value]
      console.log(oldLock)
      const newLocks =  locks.slice(0, value).concat([!oldLock]).concat(locks.slice(value + 1));
      setLock(newLocks)
  }

细分

function handleLock(event) {
      const {value} = event.currentTarget;
      const oldLock = locks[value]
      console.log(oldLock)
      const locks1 = locks.slice(0, value)
      const locks2 = locks.slice(value+1)
      console.log(locks2)
      const newLocks =  locks1.concat([!oldLock]).concat(locks2);
      setLock(newLocks)
  }

---

问题：是什么导致了这个问题，我该如何解决它？

我的猜测是，

事件.target.value

可能返回的是

字符串而不是
数字。这将导致切片值为空数组，因为向数字添加字符串会导致串联，而不是加法

尝试使用const value=parseInt（event.target.value，10）

建议使用扩展语法复制数组，然后分配值。这将使代码更可读、更简单

const newLocks = [...oldLocks];
newLocks[value] = !newLocks[value];
setLock(newLocks);

预期的输出是什么？我发现我是个白痴，这只是因为值是作为字符串传递的。所以值+1=11。