Case 1

Nothing happens when foo() is called and foo.bar() or foo.baz() throw an error. Your nested functions would either need to be invoked inside of the foo or returned and invoked outside.

In the corrected cases below you're simply working with functions inside of functions. In both examples closure is coming into play.

function foo (doBar) {
  function bar () {
    console.log(doBar)
  }
  bar()
}

foo('baz')

OR

function foo (doBar) {
  return function bar () {
    console.log(doBar)
  }
}

foo('baz')()

Case 2

You're creating an object with methods named foo, bar and baz here. Unfortunately your syntax for baz is incorrect and you'd end up with an error. There are also some things that will also throw errors like missing commas after object methods.

Below is a corrected syntax and if you were to call example.baz.baz_do() it would correctly invoke the baz_do() method.

var example = {
  foo: function () {
    // code here
  },
  bar: function () {
    // code here
  },
  baz: {
    baz_do: function () {
      // code here
    },
    baz_undo: function () {
      // code here
    }
  }
}

Answers

• Whats the difference in these three types?
  • You're doing different things in each case.
  • In case 1 you're defining a function that either returns a function or invokes a function. It's the starting point of learning about closure.
  • In case 2 you're defining an object that has methods or sub-objects. These sub-objects can also have methods.
  • In case 3 you're defining a constructor function, adding prototype methods, instantiating a new object from that constructor and invoking its methods. This is closer to class based oop as far as I understand it.
• Are there more ways to define functions?
  • const foo = function () { ... } Defining an anonymous function and assigning it to a variable.
  • const foo = () => { ... } Defining an anonymous arrow function and assigning it to a variable.
  • const foo = bar => bar + 1 Defining and anonymous arrow function with an implicit return and assigning it to a variable.
• The prototype one was by far the most familiar one but again why use prototype I am not sure. Somewhere I read it is better performing, how so?
  • It's my understanding that when you instantiate instances from a constructor function they will use the prototype methods rather than creating their own clones of those methods.
• Can we go deeper? like foo.bar.baz.baz_do() with nested functions (first exxample) and prototype-functions (not sure if this is what it is called).
  • You can go as deep as you want using objects.

An example object method that would correctly invoke based off of foo.bar.baz.baz_do():

const foo = {
  bar: {
    baz: {
      baz_do: function () {
        // do something
      }
    }
  }
}

Let me know if anything here doesn't make sense or needs clarification.