Проблема с получением возвращаемого значения из функции

Question

Ниже приведен небольшой фрагмент моего проекта, у меня эти функции работали один в один, но когда я изменил другие функции для своей программы, приведенный ниже код перестал работать.

То, что я пытаюсь сделать, - это получить от пользователя (бывшего января) входные данные одной из меток в массиве объектов daysInMonth, а затем вернуть значение объекта вместе с индексом этого объекта в массиве. .

Моя проблема в том, что я вызываю getMonthNum () внутри DrawCal (), чтобы получить значение returnMonDayNum возвращает 0, даже если внутри функции getMonthNum возвращается 31, если вы используете Jan в качестве примера.

var daysInMonth = [{
    label: 'Jan',
    value: 31
  }, {
    label: 'Feb',
    value: 28
  }, {
    label: 'Marc',
    value: 31
  }, {
    label: 'Apr',
    value: 30
  },
  {
    label: 'May',
    value: 31
  }, {
    label: 'June',
    value: 30
  }, {
    label: 'July',
    value: 31
  }, {
    label: 'Aug',
    value: 31
  },
  {
    label: 'Sept',
    value: 30
  }, {
    label: 'Oct',
    value: 31
  }, {
    label: 'Nov',
    value: 30
  }, {
    label: 'Dec',
    value: 31
  }
]


function getMonthNum() {

  var monInput = document.getElementById("month").value;

  for (var i = 0; i <= 11; i++) {
    if (daysInMonth[i].label == monInput) {
      var returnMonDayNum = daysInMonth[i].value;
      var returnMonNum = i;
      console.log(monInput);
      console.log(returnMonDayNum);
      console.log(i);
      return returnMonDayNum, returnMonNum;
    }
  }
}


function DrawCal() {

  var returnMonDayNum = getMonthNum(returnMonDayNum);
  console.log(returnMonDayNum);
}

<form action="#" onsubmit="DrawCal();">
  <label>Month: <input type="text" name="Enter Month" id="month" required></label>
  <br>
  <br>
  <input type="submit" value="MakeCal">
</form>

Answer 1

var daysInMonth = [{
    label: 'Jan',
    value: 31
  }, {
    label: 'Feb',
    value: 28
  }, {
    label: 'Marc',
    value: 31
  }, {
    label: 'Apr',
    value: 30
  },
  {
    label: 'May',
    value: 31
  }, {
    label: 'June',
    value: 30
  }, {
    label: 'July',
    value: 31
  }, {
    label: 'Aug',
    value: 31
  },
  {
    label: 'Sept',
    value: 30
  }, {
    label: 'Oct',
    value: 31
  }, {
    label: 'Nov',
    value: 30
  }, {
    label: 'Dec',
    value: 31
  }
]


function getMonthNum() {

  var monInput = document.getElementById("month").value;

  var returnMonDayNum
  var returnMonNum

  for (var i = 0; i <= 11; i++) {
    if (daysInMonth[i].label === monInput) {
      returnMonDayNum = daysInMonth[i].value;
      returnMonNum = i;
    }
  }
  return `Month: ${returnMonNum}. Days in ${daysInMonth[returnMonNum].label}: ${returnMonDayNum}`
}


function DrawCal() {

  console.log(getMonthNum());
}

document.querySelector('.submit').addEventListener('click', DrawCal)

<label>Month: <input type="text" name="Enter Month" id="month" required></label>

<button class="submit" value="MakeCal">Submit</button>

Answer 2

Вы пытаетесь вернуть две вещи из getMonthNum.Если вы действительно хотите вернуть индекс и количество дней, вы должны поместить их в массив.В противном случае вы просто получите последний в списке.

Затем вы можете сослаться на тот элемент, который вы хотите в массиве.

В качестве примечания вы можете найти такие функции массива, как find() и findIndex() немного приятнее, чем for петли для подобных вещей.(Я также добавил stopDefault (), чтобы предотвратить обновление формы, чтобы результаты оставались в консоли - это может быть не то, что вам нужно в вашем реальном коде).

var daysInMonth = [{label: 'Jan',value: 31}, {label: 'Feb',value: 28}, {label: 'Marc',value: 31}, {label: 'Apr',value: 30},{label: 'May',value: 31}, {label: 'June',value: 30}, {label: 'July',value: 31}, {label: 'Aug',value: 31},{label: 'Sept',value: 30}, {label: 'Oct',value: 31}, {label: 'Nov',value: 30}, {label: 'Dec',value: 31}]

function getMonthNum() {

  var monInput = document.getElementById("month").value;

  for (var i = 0; i <= 11; i++) {
    if (daysInMonth[i].label == monInput) {
      var returnMonDayNum = daysInMonth[i].value;
      var returnMonNum = i;
      console.log("input:", monInput);
      console.log("days:",returnMonDayNum);
      console.log("i:",i);
      return [returnMonDayNum, returnMonNum];
    }
  }
}


function DrawCal(e) {
  e.preventDefault()
  var result = getMonthNum();
  // result is an array: [returnMonDayNum, returnMonNum]
  console.log("days:", result[0]);
}

<form action="#" onsubmit="DrawCal(event);">
  <label>Month: <input type="text" name="Enter Month" id="month" required></label>
  <br>
  <br>
  <input type="submit" value="MakeCal">
</form>