JavaScript中为什么无法向questions数组按序正确写入新增元素？

1. Questions 类构造函数参数嵌套错误 #

你在构造函数里写的this.answerOptions = [answerOptions]，会把外部传入的答案数组整体再包一层数组，最终生成的题目实例结构和预期完全不符——本来answerOptions应该是答案对象的列表，实际会变成「列表套列表」的双层结构。
修正方式：直接去掉外层多余的方括号，对传入的参数直接赋值即可。

2. 数组存储方式触发的连锁异常 #

你现在的写法踩了两个连锁的坑，直接对应你看到的所有异常现象：

• 存储位置问题：如果questions是写在React组件函数内部的普通let变量，每次组件因为setCurrentQuestion触发重渲染时，都会重新执行数组初始化语句，把之前存的所有题目数据完全重置。这就是「添加第二个及更多题目时，原有数据被清空」的核心原因——组件的普通局部变量不会在重渲染周期保留，所有存在React组件内的列表类数据，都需要放到useState中托管。
• 赋值方式问题：全程靠questions[currentQuestion] = 新对象的索引定位方式写入数据，只要currentQuestion出现非连续跳变（比如没走保存逻辑就点了下一题按钮，导致索引值自动增加），JS会自动在数组的跳转位置生成大量无值的稀松空元素。这就是「数组里保留首个有效元素、夹着大量空元素、最后才是最新写入的有效元素」的直接来源。
  修正方式：直接用setQuestions的更新函数，把新题目追加到数组末尾即可，完全不需要靠currentQuestion的索引定位写入位置，从逻辑上就避免了跳位生成空元素的问题。

3. 冗余占位值导致的结构异常 #

你一开始初始化questions数组时，直接塞了一个空结构的占位对象，这个对象没有任何实际作用，反而会混在有效题目数据里，拉低数组的结构一致性。修正方式：直接把初始值设为空数组即可，不需要提前塞空对象占位。

// 用useState托管questions状态，避免重渲染被重置
const [questions, setQuestions] = useState([])

// 修正后的Questions类
class Questions {
    constructor(questionText, answerOptions) {
        this.questionText = questionText
        this.answerOptions = answerOptions // 去掉多余的数组嵌套
    }
}

const pressSave = () => {
    const correctNum = newAnswerCorrect
    // 原有校验逻辑保持不变
    if (correctNum < 0) return
    if (newQuestion.question === "") return
    for (let i = 0; i < newAnswer.answers.length; i++) {
        if (newAnswer.answers[i].answerText === "") return
    }

    // 原有答案数组组装逻辑保持不变
    const answArray = [
        { answerText: newAnswer.answers[0]?.answerText, isCorrect: false },
        { answerText: newAnswer.answers[1]?.answerText, isCorrect: false },
        { answerText: newAnswer.answers[2]?.answerText, isCorrect: false },
        { answerText: newAnswer.answers[3]?.answerText, isCorrect: false }
    ]
    answArray[correctNum].isCorrect = true

    // 去掉冗余的分支判断，统一追加题目
    const newItem = new Questions(newQuestion.question, answArray)
    setQuestions(prevList => [...prevList, newItem])
    setCurrentQuestion(prev => prev + 1)
    console.log("当前已保存题目列表", [...questions, newItem])
}

额外说明：你原来代码里重复写的currentQuestion === 0判断逻辑完全没必要，因为不管是第几个题目，只要校验通过就按顺序追加到数组末尾即可，这种写法可以完全规避因索引计算错误导致的数组结构异常。

内容的提问来源于stack exchange，提问作者Alice