Regarding Nested functions in Javascript

Question

I am going through Head First JavaScript to understand nested functions. Below is the code I am failing to understand.

var migrating = true;
if (migrating) {
    quack(4);
    fly(4);
}

var fly = function(num) {
    var sound = "Flying";
    for (var i = 0; i < num; i++) {
        wingFlapper();
    }
    function wingFlapper() {
       console.log(sound);
    }
};

function quack(num) {
    var sound = "Quack";
    for (var i = 0; i < num; i++) {
        quacker();
    }
    var quacker = function() {
        console.log(sound);
    };
}

The book says "quacker is defined by a function expression in the function quack. So its scope is the entire quack function but it’s defined only after the function expression is evaluated, until the end of the function body." So I am calling the function before its evaluated so shouldn't it throw an exception or I am not understanding the concept?

I'm getting a `Uncaught TypeError: quacker is not a function` in chromes console. Take a look at this [fiddle](http://jsfiddle.net/34h4e2dd/), any messages in the console when you run? — Spencer Wieczorek, Jul 12 '15 at 18:51
I'm failing to understand it because it's badly indented. http://jsbeautifier.org/ — Bergi, Jul 12 '15 at 19:17
I cleaned up the indentation for you. It's vital to use correct indentation to indicate the structure of your code. (@Bergi, looks like my edit crossed paths with your comment.) — Michael Geary, Jul 12 '15 at 19:21
I also took the liberty of moving the `{` characters to the previous lines instead of having them on a line by themselves. In many "curly brace" languages (C, Java, etc.) it doesn't matter which style you use, but in JavaScript it's a "best practice" to put the `{` at the end of the previous line because of automatic semicolon insertion. In many cases it won't matter, but there is at least one situation where the `{` character on a separate line won't work (returning an object literal). So for consistency it's best to follow the above style throughout. — Michael Geary, Jul 12 '15 at 19:21

score 0 · Answer 1 · edited May 23 '17 at 11:51

0

This should error out. quacker() is a function expression which follows top down approach. If you change that function expression to function statement it should work fine. I know it is confusing have a look at this

Why can I use a function before it's defined in Javascript?

Try this. It should not error out as we are using function statement which gets bound to the context (global here) before any thing else executes.

function qaucker() 
{
     console.log(sound);
};

edited May 23 '17 at 11:51

Community

1
1

answered Jul 12 '15 at 18:53

sanket joshi

43
4

Thanks.I understand the point of how the function declaration and expression are evaluated by JS interpreter.And i was was expecting an error .So my only concern is why my browser is not throwing an exception when it should . – beginner_developer Jul 12 '15 at 19:00
Hmmm. That's strange. What you are getting currently any output if not error. – sanket joshi Jul 12 '15 at 19:13
4 time "quack" and 4 times "flying" – beginner_developer Jul 12 '15 at 19:18
I dnt know why you are getting that output, I ran this code even on my android js runner but there also it is showing me error. – sanket joshi Jul 12 '15 at 19:27
Which version of chrome you are using. Please point me some details – sanket joshi Jul 12 '15 at 19:28
chrome says :Version 43.0.2357.132 m – beginner_developer Jul 12 '15 at 19:44
Ok . I will check this out and let you know. – sanket joshi Jul 12 '15 at 19:45

score -1 · Answer 2 · answered Jul 12 '15 at 18:40

-1

That's right. It should. If you try the example in some browser console you will see something like this:

Uncaught TypeError: quacker is not a function
    at quack (<anonymous>:26:1)
    at <anonymous>:5:1
    at Object.InjectedScript._evaluateOn (<anonymous>:895:140)
    at Object.InjectedScript._evaluateAndWrap (<anonymous>:828:34)
    at Object.InjectedScript.evaluate (<anonymous>:694:21)

answered Jul 12 '15 at 18:40

Mariy

5,746
4
40
57

Thats what i was expecting what my browser(chrome) is in fact is not throwing an exception and running it just fine – beginner_developer Jul 12 '15 at 18:41
Before I had written my answer I've tested the code in Chrome and pasted the error message. Open new tab and paste the exact same code. It will throw exception. ;) – Mariy Jul 12 '15 at 18:43
I have tested this code in safari,firefox and chrome and i see no exception. – beginner_developer Jul 12 '15 at 18:45

Regarding Nested functions in Javascript

2 Answers2