javascript calculating standard deviation on the fly-CodePudding

I have some Html Input fields with the name="textfield". For those input fields i want to calculate the standard deviation and put it into a html field.

for the calculation i am using this javascript code.

        <script>
        // Javascript program to calculate the standered deviation of an array
        function dostd(){   
            var btns = document.querySelectorAll('textfield'); 
            var btnsArr = Array.prototype.slice.call(btns); //Array.prototype.slice.call(btns);         
            // Creating the mean with Array.reduce
            let mean = btnsArr.reduce((acc, curr)=>{
            return acc   curr
          }, 0) / arr.length;
           
          // Assigning (value - mean) ^ 2 to every array item
          arr = arr.map((k)=>{
            return (k - mean) ** 2
          })
           
          // Calculating the sum of updated array
         let sum1 = arr.reduce((acc, curr)=> acc   curr, 0);
          
         // Calculating the variance
         let variance = sum1 / arr.length;
          
         // Returning the Standered deviation
         sum1 = Math.sqrt(sum1 / arr.length);
        document.getElementById("ergebnis1").value = sum1;
        }
        
        </script>

but i dont get the output in the html field. i think i made a mistake at putting the textfield into an array. But i dont get it and cant find the mistake. I hope someone can clarify the problem.

thx

CodePudding user response：

Us e the following code. It is working for me. Your shared code is incomplete in terms of syntax.

<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<textarea id="ergebnis1" ></textarea>   
<button onclick="dostd()">Check</button>
<script>       
    function dostd(){ 
// YOu should select by name as follows. Using name="value"  
        var btns = document.querySelectorAll('[name="textfield"]'); 
      
        var btnsArr = Array.prototype.slice.call(btns); //Array.prototype.slice.call(btns);         
       // THis array init was missed in you code
        let arr = btnsArr.map((b) => {return b.value})

        let mean = arr.reduce((acc, curr)=>{
            return acc   curr
        }, 0) / btnsArr.length;           
       
        arr = arr.map((k)=>{
            return (k - mean) ** 2
        })
       
         let sum1 = arr.reduce((acc, curr)=> acc   curr, 0);
                  
         let variance = sum1 / arr.length;
          
         sum1 = Math.sqrt(sum1 / arr.length);
        document.getElementById("ergebnis1").value = sum1;
    }        
</script>

CodePudding user response：

Convert the field values to numeric values and filter out those that are non-numeric (e.g. because they are empty) before calculating the results. It will also make things easier if you create separate functions for the maths.

const sum = arr => arr.reduce((partialSum, a) => partialSum   a, 0);
const mean = arr => sum(arr) / arr.length;
const variance = arr => {
  const m = mean(arr);
  return sum(arr.map(v => (v - m) ** 2));
};
const sd = arr => Math.sqrt(variance(arr));

function dostd() {
  const values = [...document.querySelectorAll('[name="textfield"]')]
    .map(b => parseFloat(b.value))
    .filter(v => !isNaN(v));
  document.getElementById("ergebnis1").value = sd(values);
}

<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<input name="textfield" />
<textarea id="ergebnis1" ></textarea>   
<button onclick="dostd()">Check</button>