原型方法报错？或是我对Question函数构造器任务存在理解偏差？

Hey there! Let's work through this JavaScript question constructor task step by step, and fix those prototype method errors or understanding gaps you're hitting.

First, here's a complete, working version that meets all the task requirements:

// Define the Question function constructor
function Question(text, choices, answerIndex) {
  this.text = text;          // The question itself
  this.choices = choices;    // Array of available answers
  this.answerIndex = answerIndex; // Numeric index of the correct answer
}

// Add a prototype method to display the question and numbered choices
Question.prototype.displayQuestion = function() {
  console.log(this.text);
  
  // Loop through choices to print them with 1-based numbering
  this.choices.forEach((choice, index) => {
    console.log(`${index + 1}. ${choice}`);
  });
}

// Create a collection of questions using the constructor
const questionBank = [
  new Question("Which programming language uses function constructors by default?", ["Python", "JavaScript", "C#"], 1),
  new Question("What's the result of 10 + '5' in JS?", ["15", "105", "Error"], 1),
  new Question("Which method adds an element to the end of an array?", ["push()", "shift()", "unshift()"], 0)
];

// Function to pick a random question from the bank
function getRandomQuestion() {
  const randomIdx = Math.floor(Math.random() * questionBank.length);
  return questionBank[randomIdx];
}

// Grab a random question and display it
const selectedQuestion = getRandomQuestion();
selectedQuestion.displayQuestion();

Let's go over the issues that might be causing your prototype method errors or confusion about the task:

1. Prototype Method Mistakes #

• Putting methods inside the constructor: If you define displayQuestion inside the Question function itself, every new question instance will get its own copy of the method (wasting memory) and it won't be on the prototype. This is a common mix-up.

  // ❌ Wrong: Method is not on the prototype
  function Question(text, choices, answerIndex) {
    this.text = text;
    // This creates a new function for every Question instance
    this.displayQuestion = function() { ... }
  }
  

• Using arrow functions for prototype methods: Arrow functions don't have their own this context—they inherit it from the outer scope. So when you try to access this.text or this.choices, you'll get undefined because this doesn't point to the Question instance.

  // ❌ Wrong: Arrow function breaks `this` binding
  Question.prototype.displayQuestion = () => {
    console.log(this.text); // `this` is not the Question instance here!
  }
  

2. Misinterpreting Task Requirements #

• Answer collection data structure: The task suggests using an array or object—arrays are perfect here because their indexes map directly to the numbered choices we need to display. Using an object (like {1: "A", 2: "B"}) would make it harder to loop through and number choices cleanly.
• Correct answer format: Using a numeric index (matching the array index of the correct choice) is ideal. When you display choices with 1-based numbering, you can just add 1 to the index for display, and keep the answer stored as a 0-based index for easy comparison later.
• Random question selection: Make sure you use Math.floor() with Math.random() * questionBank.length—this ensures you get a valid index (from 0 to questionBank.length - 1) so you don't try to access an index that doesn't exist.

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