Javascript: how to print return value of function?

Question

I'm beginner to Javascript and reading Closures and Variables part of book "JS for web developers". It gives two examples:

function Func1() {
    var result = new Array();
    for (var i=0; i < 10; i++){
        result[i] = function() {
           console.log('i:'+i);
           return i; 
        };
    }

    return result;
}

console.log(Func1());

function Func2() {
    var result = new Array();

    for(var i=0; i < 10; i++){
        result[i] = function(num) {
            return function() {
                console.log('num:'+num);
                return num;
            };
        }(i);
    }

    return result;
}

console.log(Func2());

In the book's description, it said in func1, every function could return 10, while in func2, each function would return different number. But when I run the code, it actually returns:

[ [Function],
  [Function],
  [Function],
  [Function],
  [Function],
  [Function],
  [Function],
  [Function],
  [Function],
  [Function] ]

for both functions.

So how to print out actual values for each function? And why "console.log('i:'+i);" is not printed in first function?

Solution 1

Try this wrap your result[i] data into a invoked function to get the data you need...

check this:

function Func1() {
    var result = new Array();
    for (var i=0; i < 10; i++){
        result[i] = (function() {
           console.log('i:'+i);
           return i; 
        })();
    }

    return result;
}

console.log(Func1());

Solution 2

You are returning a function in your for loop, instead you should just return the value inside of your closure.

function Func2() {
    var result = new Array();

    for(var i=0; i < 10; i++){
        result[i] = function(num) {
            console.log('num:'+num);
            return num;
        }(i);
    }

    return result;
}

console.log(Func2());

Solution 3

Given the current output of the execution of the function, an Array of functions, you can iterate the result of FuncN then execute the function at each element of the array

for (let n = 0, f = Func1(); n < f.length; n++) {
  console.log(f[n]())
}

Solution 4

Try them like this:

function Func1() {
    var result = new Array();
    for (var i=0; i < 10; i++){
        result[i] = function() {
           console.log('i:'+i);
           return i; 
        }();
    }
return result;

}

console.log(Func1());

function Func2() {
    var result = new Array();

    for(var i=0; i < 10; i++){
        result[i] = function(num) {
            return function() {
                console.log('num:'+num);
                return num;
            }();
        }(i);
    }

    return result;
}

console.log(Func2());

the problem is due the fact that you have set the function as it's return value rather than calling it and then returning.

View more solutions

Comments

[melpomene]

To print the return value of a function, you have to call it first. E.g. var arr = Func1(); arr[3]();

[jremi]

@L.L you need to wrap the function so it will invoke. Currently you are assigning a function to the variable. You want to invoke the function and return the result into the variable. Check my example below.

[epascarello]

var fncs = Func1(); console.log(fncs[0]()); console.log(fncs[1]())

[L.L]

Now I can get value of the function. But now func1 and func2 get the same result? [0,...,9]. Do you know why?

[jremi]

What result are you expecting?

[L.L]

In the book's description, the first function should return 10 for each function. The second function should return 0-9 for each function. But now both functions return [0,...,9].

[L.L]

Now I can get value of the function. Both functions return [0,...,9]. But in the book's description, the first function should return 10 for each function. The second function should return 0-9 for each function. Do you know why?

[L.L]

console.log(f[n])? Otherwise, it prompts f is not function.

[guest271314]

@L.L No. Did not re-write the code at the question. The code at the answer executes each function in the array and prints the result to console

[L.L]

Thanks, through this way, I could get all 10 for each function in func1.