Output of JavaScript Programs
In this article, we will see the outputs of various Javascript programs.
Predict and Explain the Output of the below JavaScript programs.
Example 1: When (x, y, z) is logged, x gives value 4 (as primitives are passed by value, and hence its value does not change even after function f()). y is an array, hence an object, and so it is passed by reference and its index 0 gets changed to X. So y logs X, B, C. Inside function f(), c.first has been changed to false and since it is passed by reference, it logs first: false. In function g(), a new object is created with the value true and so it logs first: true. Finally, in the last line, z.first is still equal to false and hence it logs first: false.
Javascript
function f(a, b, c) {
m = [ "1" , "2" , "3" ];
a = 3;
b[0] = "X" ;
c.first = false ;
}
var x = 4;
var y = [ "A" , "B" , "C" ];
var z = { first: true };
f(x, y, z);
console.log(x, y, z);
function g(a) {
a = { first: true };
console.log(a);
}
g(z);
console.log(z);
|
Output:
4 ["X", "B", "C"] {first:false} {first:true} {first:false}
Example 2: In foo1(), the bar object is returned as it should and hence it gives the output {bar:”hello”}. But in foo2(), the newline after the return is interpreted differently. It implicitly puts a semicolon after the return and the corresponding set of lines is treated as a block of statements. So foo2() has the following return statement- return; which gives output as undefined.
Javascript
<script type= "text/javascript" charset= "utf-8" >
function foo1() {
return {
bar: "hello"
}
}
function foo2() {
return
{
bar: "hello" ;
}
}
console.log(foo1());
console.log(foo2());
</script>
|
Output:
{bar:"hello"}
undefined
Example 3: The setTimeout() function is called only after the parent function has been executed fully and returned. So even though console.log(3) has a timeout of 0 milliseconds, it is executed only after the parent function has returned after logging 1 and 4. Then 3 is logged. Finally, after a timeout of 1000 milliseconds, 2 is logged.
Javascript
( function () {
console.log(1);
setTimeout( function (){console.log(2)}, 1000);
setTimeout( function (){console.log(3)}, 0);
console.log(4);
})();
|
Output:
1
4
3
2
Example 4: With the help of an Immediately Invoked Function Expression (IIFE), its own scope will be created, and we can pass i to the function. Variable i will be a local variable and the value of i in every loop will be preserved and finally printed after a timeout of 1 second.
Javascript
for ( var i = 0; i < 5; i++) {
( function (x) {
setTimeout( function () {
console.log(x);
}, 1000 );
})(i);
}
|
Output:
0
1
2
3
4
Example 5: var x has been defined and initialized inside check() after it is logged. Hoisting works only for variable declaration and not for initialization, so it returns undefined. In check(), y has been initialized to 10. Since var is not used, the variable has its scope until it encounters a variable by the given name or the global object. So when check2() is called, it logs 10 as the output.
Javascript
var x= 5;
function check(){
y = 10;
console.log(x);
var x =10;
}
function check2(){
console.log(y);
}
check();
check2();
|
Output:
undefined
10
Last Updated :
17 Jan, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...