Мне нужна помощь. Я пытаюсь создать приложение, которое вычисляет среднее значение заданных чисел. Тем не менее, я новичок, и мои функции массива не всегда работают. Мне удалось отобразить введенные числа, но теперь я хочу добавить их и рассчитать среднее значение. Я почти на месте. Чтобы вычислить среднее значение, я разделю сумму на длину массива. Но я не могу добавить числа из массива для добавления. Они объединяются или отображается Нэн. Должен ли я где-то использовать метод Number()?

Кстати, я знаю, что для некоторых из вас этот вопрос может показаться жалким, но я самоучитель и немного старожил, поэтому, пожалуйста, не понижайте оценку этого вопроса. Я пытался найти ответы в Google, но они не решили проблему.

let numbersEntered = document.querySelector("#numbersEntered");
let inputEl = document.querySelector("#input");
let numArr = [];


// buttons
let enterBtn = document.querySelector("#enter");
let avgBtn = document.querySelector("#avg");

enterBtn.addEventListener("click", displayNums);

function displayNums() {
  let newNumber = Number(inputEl.value);
  numArr.push(newNumber);
  numbersEntered.innerHTML = "";
  console.log(numArr);

  for (let i = 0; i < numArr.length; i++) {
    numbersEntered.innerHTML += numArr[i] + ",";
  }
}

avgBtn.addEventListener("click", displayAvg);

// the below code is totally useless - I can't get the right sum 
function displayAvg() {
  let total = 0;
  for (let i = 0; i < numArr.length; i++) {
    total += numArr[i];
    console.log(total);
  }
}
<input type="text" id="input" />
<button id="enter" type="button">Enter</button>
<p id="numbersEntered"></p>
<button id="avg" type="button">Average</button>
<p id="average"></p>
</div>
0
TomDev 26 Янв 2022 в 16:23
Почему бы вам попробовать использовать Number?
 – 
Scott Hunter
26 Янв 2022 в 16:25
let newNumber = inputEl.value; - поскольку вы читаете это из поля ввода текста, очевидно, это тоже будет текст. Вам нужно явно попытаться преобразовать его в число
 – 
UnholySheep
26 Янв 2022 в 16:26
Вроде работает, но выдает три числа, а мне нужен только последний
 – 
TomDev
26 Янв 2022 в 16:29
Вы можете полностью избавиться от этой головной боли, сделав ввод type="number" вместо type="text", но по какой-то причине, если вы хотите поддерживать пробелы, запятые и т. д., вы можете преобразовать его в число, а затем вставить его в массив, остальная логика lgtm
 – 
tsamridh86
26 Янв 2022 в 16:30
Отвечает ли это на ваш вопрос? Как добавить два значения в javascript
 – 
Heretic Monkey
26 Янв 2022 в 16:38

3 ответа

Лучший ответ

Разобрать значение в число, в настоящее время оно имеет тип строки

let numbersEntered = document.querySelector("#numbersEntered");
let average = document.querySelector("#average");

let inputEl = document.querySelector("#input");
let numArr = [];


// buttons
let enterBtn = document.querySelector("#enter");
let avgBtn = document.querySelector("#avg");

enterBtn.addEventListener("click", displayNums);

function displayNums() {
  let newNumber = inputEl.value;
  numArr.push(parseInt(newNumber));
  numbersEntered.innerHTML = "";
  for (let i = 0; i < numArr.length; i++) {
    numbersEntered.innerHTML += numArr[i] + ",";
  }
}

avgBtn.addEventListener("click", displayAvg);

// the below code is totally useless - I can't get the right sum 
function displayAvg() {
  let total = 0;
  for (let i = 0; i < numArr.length; i++) {
    total = total + numArr[i];
  }
  average.innerHTML = total/numArr.length
}
<input type="number" id="input" />
<button id="enter" type="button">Enter</button>
<p id="numbersEntered"></p>
<button id="avg" type="button">Average</button>
<p id="average"></p>
0
sojin 26 Янв 2022 в 16:39

Вы почти у цели... просто рассчитайте среднее значение за пределами for

let numbersEntered = document.querySelector("#numbersEntered");
let inputEl = document.querySelector("#input");
let numArr = [];


// buttons
let enterBtn = document.querySelector("#enter");
let avgBtn = document.querySelector("#avg");

enterBtn.addEventListener("click", displayNums);

function displayNums() {
  let newNumber = Number(inputEl.value);
  numArr.push(newNumber);
  numbersEntered.innerHTML = "";
  console.log(numArr);

  for (let i = 0; i < numArr.length; i++) {
    numbersEntered.innerHTML += numArr[i] + ",";
  }
}

avgBtn.addEventListener("click", displayAvg);

// the below code is totally useless - I can't get the right sum 
function displayAvg() {
  let total = 0;
  for (let i = 0; i < numArr.length; i++) {
    total += numArr[i];
  }
  // FIXED HERE
  console.log(total/numArr.length);
}
<input type="text" id="input" />
<button id="enter" type="button">Enter</button>
<p id="numbersEntered"></p>
<button id="avg" type="button">Average</button>
<p id="average"></p>
</div>
0
Patrick Ferreira 26 Янв 2022 в 16:40

В вашей функции displayNums

В настоящее время вы вводите массив в виде текстовых/строковых значений, и при добавлении он связывается с номерами, поскольку это текст. например «23», должно быть просто 23.

Измените его на:

 let newNumber = Number(inputEl.value);
 numArr.push(newNumber);

Рабочая скрипка здесь - https://jsfiddle.net/La8z52rn/

0
H_H 26 Янв 2022 в 16:42
Я сделал это, но как я могу добавить введенные числа. В console.log они отображаются в виде нескольких значений. Я просто хочу остаться последним.
 – 
TomDev
26 Янв 2022 в 16:32
Просто отобразите console.log из цикла for @TomDev после завершения расчета
 – 
innocent
26 Янв 2022 в 16:36
1
Добавлена ​​рабочая демонстрация - jsfiddle.net/La8z52rn
 – 
H_H
26 Янв 2022 в 16:42