TypeScript中如何使用for循环遍历数组中的对象

嘿，我来帮你解决这个TypeScript里遍历数组对象的问题！首先，咱们先给你的数据结构加上TypeScript的类型定义，这样写代码的时候能获得类型提示，减少出错概率——毕竟TypeScript的核心就是类型安全嘛～

第一步：定义类型（可选但推荐） #

先给你的数据结构定义接口，让TypeScript能识别每个字段的类型：

// 单个答案对象的类型
interface AnswerItem {
  question_id: number; // 你可以根据实际情况改成string或其他类型
  int_result: number | null;
  string_result: string | null;
}

// 整体数据结构的类型
interface BodyDataAnswer {
  answers: AnswerItem[];
}

// 你的数据（这里假设你是在类的方法里，所以用了this）
const bodyDataAnswer: BodyDataAnswer = {
  answers: [
    {
      question_id: this.verifyCustomer.questions[0].id,
      int_result: this.verifyCustomer.questions[0].answer_template.answers["0"].int_result,
      string_result: this.verifyCustomer.questions[0].answer_template.answers["0"].string_result
    },
    // 其他答案对象...
  ]
};

方法一：普通for循环（基于索引） #

这是最传统的遍历方式，适合需要用到索引的场景：

for (let i = 0; i < bodyDataAnswer.answers.length; i++) {
  const currentAnswer = bodyDataAnswer.answers[i];
  // 访问每个对象的属性
  console.log(`问题ID: ${currentAnswer.question_id}`);
  console.log(`整数结果: ${currentAnswer.int_result}`);
  console.log(`字符串结果: ${currentAnswer.string_result}`);
  
  // 在这里添加你的业务逻辑，比如把结果存到另一个数组，或者提交到后端等
}

方法二：for...of循环（直接遍历元素） #

这种方式更简洁直观，不需要关心索引，直接拿到数组里的每个对象：

for (const answer of bodyDataAnswer.answers) {
  console.log(`问题ID: ${answer.question_id}`);
  console.log(`整数结果: ${answer.int_result}`);
  console.log(`字符串结果: ${answer.string_result}`);
  
  // 执行你的处理逻辑
}

方法三：Array.forEach() 方法 #

这是数组内置的迭代方法，适合简单的遍历场景，还能直接拿到索引：

bodyDataAnswer.answers.forEach((answer, index) => {
  console.log(`第${index + 1}个答案：`);
  console.log(`问题ID: ${answer.question_id}`);
  console.log(`整数结果: ${answer.int_result}`);
  console.log(`字符串结果: ${answer.string_result}`);
  
  // 处理逻辑
});

小提示 #

如果你的代码是在类的方法中，要注意this的指向问题——如果用普通函数的话可能需要绑定this，但用箭头函数或者for...of/普通for循环就不会有这个问题啦。另外，类型定义里的字段类型可以根据你实际的业务数据调整，比如question_id如果是字符串类型，就把number改成string就行。

内容的提问来源于stack exchange，提问作者Vương Tuấn Anh