JavaScript - Constructing global objects with nested functions

I am not sure why you have to do like this. But if you really want to you can achieve what you want with this:

    button1Handler: function () {
        return {
             button1: $("#button1"),
             init: function () {
                this.button1.on("click", function () { alert("button1 clicked"); });
             }
        };
    },

and then you can call init as this.button1Handler().init().

In this case this.button1Handler() function returns an object which further has an init method.

You are getting error because this.button1Handler is a function and you will have to create an instance of it to access properties of it.

var Global = {
  button1Handler: function() {
    //this.button1 = $("#button1");
    this.init = function() {
      //this.button1.on("click", function () { alert("button1 clicked"); });
      console.log("Button1 init")
    }
  },
  button2Handler: function() {
    this.init = function() {
      console.log("Button2 init")
    }
  },
  init: function() {
    new this.button1Handler().init();
    new this.button2Handler().init();
  }

};

(function() {
  Global.init();
})();

A better solution is to return necessary properties:

Sample

var Global = {
  button1Handler: function() {
    var button1 = $("#button1");
    var init = function() {
      button1.on("click", function() {
        console.log("Button1 clicked")
      });
    }
    return {
      init: init
    }
  },
  button2Handler: function() {
    var button2 = $("#button2");
    var init = function() {
      button2.on("click", function() {
        console.log("Button2 clicked")
      });
    }
    return {
      init: init
    }
  },
  init: function() {
    this.button1Handler().init();
    this.button2Handler().init();
  }

};

(function() {
  Global.init();
})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<button id="button1">button 1</button>
<button id="button2">button 2</button>

In the following code, button1 is a private variable since it is not exposed using return statement, but init is public property. So you can have any number of properties, but only the properties that you return will be public properties.

button1Handler: function() {
  var button1 = $("#button1");
  var init = function() {
    button1.on("click", function() {
      console.log("Button1 clicked")
    });
  }
  return {
    init: init
  }
}

It is because button1Handler does not return an executed function. In this.button1Handler().init() button1Handler function is invoking the init there this will point to the button1Handler() scope hence function init will be accessible.