How to create a dynamic length array with numbers and sum the numbers using JavaScript?


In JavaScript, arrays are always dynamic in length. Like other programming languages, we don’t need to define the array's length while creating the array. So, we can create an array and push whatever number of elements we want in the JavaScript array. Here, we will create the dynamic length of the array and add numbers to that. After that, we will sum up all numbers. This tutorial will teach us to create a dynamic length array with numbers and sum the numbers using JavaScript.

Use the for loop to sum all elements of the dynamic array

We can iterate over the array using the for loop and add every element to get the sum of all elements. We will use the normal for-loop and for-of-loop to access the array elements and add all into the single variable.

Syntax

Users can follow the syntax below to use the for-loop to sum all elements of an array of dynamic lengths.

let arraySum = 0;
for (let i = 0; i < length; i++) {
  arraySum += dynamicArray[i];
}

In the above syntax, length is the length of the dynamic array. We are adding all elements to the arraySum variable.

Steps

  • Use the Math.random() method and generate a random integer to use as a length of the dynamic array.

  • Also, multiply the randomly generated length with any integer to define the range of length of the dynamic array. For example, if you wanted to create a dynamic array of length between 0 and 15, multiply random integer with 15, as it generates values between 0 and 10.

  • Now, use the for-loop to initialize the values. To initialize the random values, we again used the Math.random() method and multiplied it by 5 to generate random values between 0 and 5.

  • Use the Math.round() method to round off randomly generated numbers.

  • Create an arraysum variable and initialize with zero.

  • Now, iterate through the array and every element to the arraySum variable.

Example 1

In the example below, we have used the Math.random() function to generate the length of the dynamic array, initialize the array with random values, and sum up all array values using the for-lop.

In the output, users can see the array's values and its sum. Also, every time users run the code below, it will create a new array with different lengths and values.

<html>
<body>
   <h2>Using the <i> for-loop </i> add all elements of the array of numbers of dynamic length.</h2>
   <div id = "output"> </div>
   <script>
      let output = document.getElementById('output');
      let length = Math.random() * 15;
      let dynamicArray = [];
         for (let i = 0; i < length; i++) {
            dynamicArray[i] = Math.round(Math.random() * 5);
         }
      let arraySum = 0;
      for (let i = 0; i < length; i++) {
         arraySum += dynamicArray[i];
      }
      output.innerHTML += "The array of random number is " + dynamicArray + "<br/>";
      output.innerHTML += "The sum of all array elements is " + arraySum + "<br/>";
   </script>
</body>
</html>

Example 2

In the example below, We have taken the length of the dynamic array from the users. Also, we are taking every value of the array from the user. After storing user input in the dynamic array, we use the for-of loop to iterate through it.

While iteration of for loop, we add every element of the array in the sum variable.

<html>
<body>
  <h2>Using the <i> for-of loop </i> add all elements of the array of numbers of dynamic length.</h2>
  <div id = "output"> </div>
  <script>
    let output = document.getElementById('output');
    // take the dynamic length of the array from users
    let length = +prompt("Enter a length of the dynamic array", 5);
    let dynamicArray = [];
    // take array inputs from users
    for (let i = 1; i <= length; i++) {
      dynamicArray.push(+prompt("Enter " + i + "th number value", 0))
    }
    let sum = 0;
    // using the for-of loop to get a sum of all elements
    for (let element of dynamicArray) {
      sum += element;
    }
    output.innerHTML += "The array of random number is " + dynamicArray + "<br/>";
    output.innerHTML += "The sum of all array elements is " + sum + "<br/>";
  </script>
</body>
</html>

Use the array.reduce() method to sum all numbers of the dynamic array

The array.reduce() method reduces the array into a single element by performing multiple operations. We can create a variable to store the sum of all array elements and reduce the array by adding every element to the sum variable.

Syntax

Users can follow the syntax below to use the reduce() method to sum all elements of the dynamic array

let sumOfArray = inputArray.reduce((element, currentSum) => element + currentSum, 0)

In the above syntax, the element is the array’s element, currentSum is the sum of all elements of the array till ith index, and the sum of the array contains the final sum of all array elements.

Example 3

In the example below, we have created the dynamic array by taking user input. Also, users can notice that we have used the ‘+’ unary operator before the prompt to convert strings to numbers.

At last, we are doing the sum of all users inputs stored in the array using the array.reduce() method.

<html>
<body>
   <h2>Using the <i> array.reduce() method </i> to add all elements of the array of numbers of dynamic length</h2>
   <div id="output"></div>
   <script>
      let output = document.getElementById('output');
      let arrayLen = +prompt("Enter any number to create array of that length", 10);
      let inputArray = [];
      for (let i = 1; i <= arrayLen; i++) {
         inputArray[i] = +prompt("Enter " + i + "th number value", 5);
      }
      let sumOfArray = inputArray.reduce((element, currentSum) => element + currentSum, 0)
      output.innerHTML += "The length of the array is " + arrayLen + "<br/>";
      output.innerHTML += "The array of random number is " + inputArray + "<br/>";
      output.innerHTML += "The sum of all array elements is " + sumOfArray + "<br/>";
   </script>
</body>
</html>

We learned how to create an array of dynamic lengths in JavaScript. Also, we learned to sum all elements of an array of dynamic length using the for-loop and reduce() method. We can also use the while loop.

Updated on: 16-Feb-2023

837 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements