最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Adding values to an array, sum or subtract depending on input - Stack Overflow

programmeradmin4浏览0评论

I have to create a new input text every time the user enters an integer and those integers should be add it to an array which at the end the program must sum or subtract depending on the values.

For example, if the array is like this: [1, 5, 10] the final result is: 16 but if the array goes like this [2, 3, 7, -1, 5] the final result should be 7, why? it is because you sum up 2 + 3 + 7 and then subtract 5.

The main problem I have right now is that there is something wrong with my code which is not doing the final calculation.

A bit of code:

var arrayOfNumbers = [];
var column = 1;

function logingValues (){

    var values = $('input[name^=valuesToSum]').map(function(idx, elem) {
            newVal = $(elem).val();
            if (isNaN(newVal)) {
              newVal = 0;
            }
            return newVal;
    }).get();

    console.log("Values aquired from inputs " + values);

    arrayOfNumbers = values;

    console.log("Values inserted on Array " + arrayOfNumbers);
}


function removeElement (id){
    $('#' + id ).remove();
    console.log("element #" + id + " was eliminated");
}

function iterateOverArray(array){

   var oldArray = array;
   var newArray = "";

   for (var i = 0; i < oldArray.length; i++) {
      newArray += " + " + oldArray[i];
   }

   return newArray;
}

function addElement (whereToPrint){

    logingValues();

    var newArray = iterateOverArray(arrayOfNumbers);

    var printId = "print" + whereToPrint;

    console.log(printId);

    console.log("we can see the array like this " + arrayOfNumbers);

    $('#'+ printId).html(newArray);

    console.log('Element was created');


      column += 1;

      var newInput  =  // here goes a template

      $('.elemPlaceHold').append(newInput);

}

function loadingBar (){

    var summingBar = '<div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div>';

    $('.spinner').append(summingBar);
}

function caculationEffect (countTotal){

    $('#result').html("");
    loadingBar();


    setTimeout(function(){

        $('.spinner').html("");
        $('#result').html(countTotal);
    }, 2000);
}

function calculate (){

    console.log("is calculating....");

    logingValues();
    // Variable to hold your total 
    var countTotal = 0;  
    // Variable that states how the process start (sum/subtract)
    var conditional = true;
    var changeCondition;

    for(var i = 0; i < arrayOfNumbers.length; i++) {

        if(arrayOfNumbers[i] === -1){
            changeCondition = conditional ? conditional = false : conditional;
        }else{
            if(conditional === true){
               countTotal += arrayOfNumbers[i];
            }else{
               countTotal -= arrayOfNumbers[i];
            }
        }
      }
    console.log('countTotal', countTotal);
    caculationEffect('countTotal', countTotal);
}

Here is a JSBin

Any suggestions?

EDIT

The only thing to take into account is: before doing the calculation, if there is a -1 in the Array, then it should subtract. Otherwise sum!

I have to create a new input text every time the user enters an integer and those integers should be add it to an array which at the end the program must sum or subtract depending on the values.

For example, if the array is like this: [1, 5, 10] the final result is: 16 but if the array goes like this [2, 3, 7, -1, 5] the final result should be 7, why? it is because you sum up 2 + 3 + 7 and then subtract 5.

The main problem I have right now is that there is something wrong with my code which is not doing the final calculation.

A bit of code:

var arrayOfNumbers = [];
var column = 1;

function logingValues (){

    var values = $('input[name^=valuesToSum]').map(function(idx, elem) {
            newVal = $(elem).val();
            if (isNaN(newVal)) {
              newVal = 0;
            }
            return newVal;
    }).get();

    console.log("Values aquired from inputs " + values);

    arrayOfNumbers = values;

    console.log("Values inserted on Array " + arrayOfNumbers);
}


function removeElement (id){
    $('#' + id ).remove();
    console.log("element #" + id + " was eliminated");
}

function iterateOverArray(array){

   var oldArray = array;
   var newArray = "";

   for (var i = 0; i < oldArray.length; i++) {
      newArray += " + " + oldArray[i];
   }

   return newArray;
}

function addElement (whereToPrint){

    logingValues();

    var newArray = iterateOverArray(arrayOfNumbers);

    var printId = "print" + whereToPrint;

    console.log(printId);

    console.log("we can see the array like this " + arrayOfNumbers);

    $('#'+ printId).html(newArray);

    console.log('Element was created');


      column += 1;

      var newInput  =  // here goes a template

      $('.elemPlaceHold').append(newInput);

}

function loadingBar (){

    var summingBar = '<div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div>';

    $('.spinner').append(summingBar);
}

function caculationEffect (countTotal){

    $('#result').html("");
    loadingBar();


    setTimeout(function(){

        $('.spinner').html("");
        $('#result').html(countTotal);
    }, 2000);
}

function calculate (){

    console.log("is calculating....");

    logingValues();
    // Variable to hold your total 
    var countTotal = 0;  
    // Variable that states how the process start (sum/subtract)
    var conditional = true;
    var changeCondition;

    for(var i = 0; i < arrayOfNumbers.length; i++) {

        if(arrayOfNumbers[i] === -1){
            changeCondition = conditional ? conditional = false : conditional;
        }else{
            if(conditional === true){
               countTotal += arrayOfNumbers[i];
            }else{
               countTotal -= arrayOfNumbers[i];
            }
        }
      }
    console.log('countTotal', countTotal);
    caculationEffect('countTotal', countTotal);
}

Here is a JSBin

Any suggestions?

EDIT

The only thing to take into account is: before doing the calculation, if there is a -1 in the Array, then it should subtract. Otherwise sum!

Share Improve this question edited Jul 7, 2016 at 2:14 Non asked Jul 7, 2016 at 2:07 NonNon 8,61920 gold badges80 silver badges130 bronze badges 4
  • What's the logic for whether or not to subtract the final number? – Quill Commented Jul 7, 2016 at 2:12
  • @Quill the only thing to take into account is: before doing the calculation, if there is a -1 in the Array, then it should subtract. – Non Commented Jul 7, 2016 at 2:14
  • so if there's a -1 in the array, do you subtract the last number, or do you subtract every number after the -1? – Quill Commented Jul 7, 2016 at 2:16
  • @Quill you should subtract only the following number. Eg: [3, -1, 2, 10, 5] it should subtract only 2 and then keep summing up the followings. – Non Commented Jul 7, 2016 at 2:19
Add a ment  | 

6 Answers 6

Reset to default 2

There was a few problems here.

  • 1) caculationEffect is only supposed to take countTotal, but you were passing it caculationEffect('countTotal', countTotal)
  • 2) You were trying to use the arrayOfNumbers like strings, you have to convert them to numbers first.

Try using the below code instead:

var total = 0;
var shouldSubtract = false;
for (var i = 0; i < arrayOfNumbers.length; i++) {
    if (arrayOfNumbers[i] == "") continue;
    var currentNumber = parseInt(arrayOfNumbers[i], 10);
    if (currentNumber === -1) {
        shouldSubtract = true;
    } else {
        if (shouldSubtract) {
            total -= currentNumber;
            shouldSubtract = false;
        } else {
            total += currentNumber;
        }
    }
}
caculationEffect(total);

The solution is quite simple, if you do a simple console.log(arrayOfNumbers);, you will notice that your values are stored as strings .

Example of the log : ["3", "4"]

Since you use the === operator, JavaScript also pares the value's types. Indeed, "-1" === -1 returns false. This is the reason why you're never reaching your "changeCondition" code.

Either use the parseInt() function to convert your "string" to the number and your problem will be fixed.

Try it :

<html>
    <head>
        <meta charset="utf-8">
        <style>
        </style>
    </head>
    <body>
        <script>
           var arr = [2, 3, 7, -1, 5];
            function calculate(arr) {
                total = 0;
                if(arr.length > 0) {
                var index = arr.indexOf(-1);
                if (index === -1){
                    for(var i = 0;i <arr.length;i++)
                        total += arr[i];
                    }
                else {
                    for(var i=0 ; i<arr.length;i++) {
                        if(i===index)
                            continue;
                        if(i < index)
                            total+=arr[i];
                        else
                            total-=arr[i];  
                    }  
                }
            }
                return total;
            }
            alert (calculate(arr));
        </script>
     </body>
</html>

You need the reset the conditional value after doing the subtraction. So change

        if(arrayOfNumbers[i] === -1){
            changeCondition = conditional ? conditional = false : conditional;
        }else{
            if(conditional === true){
               countTotal += arrayOfNumbers[i];
            }else{
               countTotal -= arrayOfNumbers[i];
            }
        }

to

        if(arrayOfNumbers[i] === -1){
            changeCondition = conditional ? conditional = false : conditional;
        }else{
            if(conditional === true){
               countTotal += arrayOfNumbers[i];
            }else{
               countTotal -= arrayOfNumbers[i];
               conditional = true;
            }
        }

1) the array is an array of strings so you get concatenation

    var values = $('input[name^=valuesToSum]').map(function(idx, elem) {
            newVal = $(elem).val();
            if (isNaN(newVal)) {
              newVal = 0;
            }
            return parseInt(newVal); // parseInt or parseFloat
    }).get();

2) you are passing "countTotal" as the argument [0] instead of the actual value

caculationEffect('countTotal', countTotal);


function caculationEffect (title, countTotal){ // add title argument

    $('#result').html("");
    loadingBar();

    setTimeout(function(){
        $('.spinner').html("");
        $('#result').html(countTotal);
    }, 2000);
}

You can perform your calculations as follow:

function calculate(array) {
  return array.reduce(function(prev, curr, i, arr) {
    if(curr === -1) {
      arr[i+1] *= -1;
      return prev;
    }
    return prev + curr;
  });
}

Demo:

function calculate(array) {
  return array.reduce(function(prev, curr, i, arr) {
    if(curr === -1) {
      arr[i+1] *= -1;
      return prev;
    }
    return prev + curr;
  });
}

console.log(calculate([2, 3, 7, -1, 5]));
console.log(calculate([2, 3, 7, -1, 5, -1, 2]));
console.log(calculate([2, 3, 7]));

发布评论

评论列表(0)

  1. 暂无评论