Returning Array value from a function

Question

I'm having an issue returning the array value from the multiply function. I would like to know what's the best approach for this? Appreciate any help. Thanks

<head>
<script>

function test() {
    let list1 = [ 17, 8, 9, 5, 20 ];
    let list2 = [ 12, 4, 8, 15, 17, 5, 20, 11 ];

    // Test the multiply function by calling it two times.
    let mult1 = multiply(list1,3);
    let mult2 = multiply(list2,2);

function multiply(list,x) {            
    var myArray = [0];
    for (i = 0; i < list.length; i++) {
      myArray[i] = list[i] * x;            
    }   
  return myArray;  
}

let output = mult1 + '<br>' + mult2;

</script>

</head>

<body>
<button type="button" click="test()">Compute</button>
<p id="output"></p>
</body>

Anh Nhat Tran · Accepted Answer · 2020-12-09 02:44:55Z

First, you miss one curly brace for your test function.

function test() {
    let list1 = [ 17, 8, 9, 5, 20 ];
    let list2 = [ 12, 4, 8, 15, 17, 5, 20, 11 ];

    // Test the multiply function by calling it two times.
    let mult1 = multiply(list1,3);
    let mult2 = multiply(list2,2);

// You miss this curly brace below
}

Second, you can't call mult1 and mult2 because they are declared in the function scope.

/* This function creates a scope 
 * so every variable is declared in this function cannot be called outside
 */
function test() {
    let list1 = [ 17, 8, 9, 5, 20 ];
    let list2 = [ 12, 4, 8, 15, 17, 5, 20, 11 ];

    // Test the multiply function by calling it two times.
    let mult1 = multiply(list1,3);
    let mult2 = multiply(list2,2);
}

console.log(mult1, mult2) // undefined, undefined
// Uncaught ReferenceError: mult1 is not defined
let output = mult1 + '<br>' + mult2;

You can fix this as below

function test() {
    let list1 = [ 17, 8, 9, 5, 20 ];
    let list2 = [ 12, 4, 8, 15, 17, 5, 20, 11 ];

    // Test the multiply function by calling it two times.
    let mult1 = multiply(list1,3);
    let mult2 = multiply(list2,2);
    // Return value here
    return { mult1, mult2 }
}
// Read it here
let { mult1, mult2 } = test();
let output = mult1 + '<br>' + mult2;

I've fixed that curly brace. The real problem is this function: It's not returning myArray value function multiply(list,x) { var myArray = [0]; for (i = 0; i < list.length; i++) { myArray[i] = list[i] * x; } return myArray; }

Harshana · Accepted Answer · 2020-12-09 02:31:03Z

There are few issues in your code:

In the HTML, the click attribute should be onclick
To display the output in the p tag: first, you need to get the element by ID. Then, appending the value to the innerHTML.

function test() {
  let list1 = [17, 8, 9, 5, 20];
  let list2 = [12, 4, 8, 15, 17, 5, 20, 11];

  // Test the multiply function by calling it two times.
  let mult1 = multiply(list1, 3);
  let mult2 = multiply(list2, 2);

  let output = document.getElementById("output");
  output.innerHTML = mult1 + '<br>' + mult2;

  function multiply(list, x) {
    var myArray = [0];
    for (i = 0; i < list.length; i++) {
      myArray[i] = list[i] * x;
    }
    return myArray;
  }
}

<head>


</head>

<body>
  <button type="button" onclick="test()">Compute</button>
  <p id="output"></p>
</body>

KShewengger · Accepted Answer · 2020-12-09 02:57:29Z

1

You can implement it like this:

function test() {
  let list1 = [ 17, 8, 9, 5, 20 ];
  let list2 = [ 12, 4, 8, 15, 17, 5, 20, 11 ];

  const multiply = (list, x) => list.map(num => num * x);

  return [ multiply(list1, 3), multiply(list2, 2) ];
}

const [ mult1, mult2 ] = test();
const output = mult1 + '<br>' + mult2;


// Reflect the result inside your div#output element
document.getElementById('output').innerHTML = output;

<div id="output"></div>

edited Dec 9, 2020 at 2:57

answered Dec 9, 2020 at 2:38

KShewengger

8,3293 gold badges27 silver badges38 bronze badges

Collectives™ on Stack Overflow

Returning Array value from a function

3 Answers 3

2 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Related