Примитивный калькулятор (ошибка в коде)

Вопрос-ответ JavaScript
41

Допустим, возможность добавлять числа - можно сделать с помощью объединения строк:
для этого создать еще одну функцию для объединения срок:

function concat(event) {
      event.target.value = str;// сделать значение инпута строкой
     var s = str + str; 
}

не знаю - верный ли вообще такой подход, не говоря уже об ошибках в коде…

42
  1. создать пустой массив arr=[]
  2. записывать в arr значения из кнопок (вам понадобиться познакомиться с push)
  3. для вывода в табло калькулятора понадобиться -join

Выполните для начала простое
var arr = [11,22,33,44] // получить "11223344"
в arr записать значения // [11, 22, 33, 44, “qwe”, “12d”, “hello”]
из этого же arr сделать такой вид // [“hello”, “12d”, “qwe”, 44, 33, 22, 11]

ну почитайте все таки про массивы

43

Примитивные задачи на массивы - это еще понятно.

var arr = [];
    var arr2 = [11, 22, 33, 44, "qwe", "12d", "hello"];
    
        arr2.reverse();    
    arr.push(arr2.join(" "));        
            
    alert(arr);

Но как это связать с DOM?
Получается, что вместо arr должен быть value input-a , а вместо arr2 - value кнопки (для передачи значений из кнопок в массив).
Как это записывать?
var arr = document.querySelector(’.firstN’).value;
var arr2 = event.target.value; ?
Но так не будет работать.

44

может натолкнет куда нибудь http://jsfiddle.net/fg9q0opx/

console.log() не убирал.

45

спасибо, но для меня это пока что сложно

46

и для меня…
так вопросы только с DOM?

Выбор за тобой:

  1. записывать значения из кнопок в массив А и выводить на экран
  2. брать значения из inputa экрана -куда выводятся все значения кнопок из массива А

допустим после нажатия на кнопку “+”, “-”, “*”, “/” присваивать последнее значение А массиву В -вроде как сохранить надо первую цифру и очистить экран.
Ну соответственно при нажатии на “=” производить действие между двумя массивами А и В. действие мы уже нажимали и его тоже надо куда то сохранять.

47

я ни первое ни второе не представляю как оно должно работать.

window.onload = function(){
      var arr = [];

var onekey = document.querySelector('#one');
onekey.addEventListener('click', result, false);
...
(аналогично для всех кнопок)
function concat(event) {
      document.querySelector('.firstN').value = arr; //не знаю верная ли такая запись
arr.push(event.target.value); // значения кнопок записываются в массив

arr.innerHTML=event.target.value; // ???
}
        }

Но потом как из массива присваивать в инпут firstN?

48

arr.innerHTML

Вам сюда- надо почитать

49

я знаю как работает innerHtml, но я не знаю как передать элементы из массива в DOM

50

Можно пример?

51

вместо

arr.push(event.target.value); // значения кнопок записываются в массив

arr.innerHTML=event.target.value; // ???
}

будет

function result(event){
             var arr = [];
      for (var i =0; i<=arr.length; i++){
          document.querySelector('.firstN').value = event.target.value;
          arr[i]= event.target.value;
      }      
      } // элементы из массива передаются в инпут

как бы надо получить длину этого массива, чтобы из него передавать любое количество элементов.
Не знаю можно ли так присваивать arr[i]= event.target.value; ?

52

как вы думаете - какая длина тут у arr ?
после чего код делает :boom:

‘.firstN’ предполагает наличие inputa. (надеюсь вы это знаете)
что вы хотели тут сделать? и зачем его засунули в цикл?

пишите проверки тип console.log(arr[i])
так можно делать!!! но в вашем случае это бессмысленное действие.
вы размазали один клик на весь массив.
приведу пример для понимания вашего действия
arr=;
for (var i =0; i<=10; i++){
arr[i]= ‘event’;
}

логично передавать туда i

53

значит цикл на длину массива туда добавлять - не надо?

54

т.е в случае addEventListener(‘click’, result, false) отрабатывает при событие “click”. Запуская фу-ю result в которой при каждом клике создается, внутри ее области видимости, массив arr=[]. Каждый раз нажимая на область где висит этот Listener вы получаете пустой массив длина которого arr.length = 0. Тем самым вы говорите своему циклу -“сделай мне 0 итераций”

55

я не знаю способа, как можно на одну функцию клика навешивать несколько событий передачи значений (из разных кнопок), и так чтобы оно передавалось поочередно в инпут.
Где можно об этом почитать?

56

На одно действие есть много решений.
Одна функция может брать несколько [quote=“lena, post:55, topic:1072, full:true”]
значений (из разных кнопок),
[/quote]
записанных в переменные, массивы, объекты, джейсоны… предварительно перед запуском результирующей функции.

57

Присвоить инпуту массив разделенный join-ом

function result(event) {
      document.querySelector('.firstN').value = arr.join(' ');
arr.push(event.target.value);
}

Пример полностью здесь - http://jsfiddle.net/LenaR/8kaus5bt/
Но оно работает так что первый клик - игнорирует, а второй клик - выдает результат этого первого клика, и т.д. Куда девается первый клик? … Либо там еще цикл надо, где бы i=1 ( а не с нуля) . Не знаю верное ли это предположение, и надо ли там этот цикл вообще.

58

пишите проверки !!!

59

Результаты в консоли - мне ни о чем не говорят.

При клике на кнопку “1” - выдает результат “1 step: 1”, при клике на двойку - “1 step: 1, 2” (общий результат в value инпута), и т.д. Всё верно, получаемые результаты при клике на кнопки отображаются в консоли. Но где этот первый клик (1) в value инпута?

60

тут срабатывает ваш push в массив
чтение идет сверху вниз
я добавил счетчик кликов http://jsfiddle.net/8kaus5bt/2/- вы можете увидеть, в первом клике
1 step:
1 step:
1 step: 1
единица уже есть в массиве. И почему она не выводиться в input.value?
2 step: 1
2 step: 1
2 step: 1,1
и когда все step имеют 1 она выводиться в input.value.