JavaScript Function within Function

Question

I was wondering if it is possible to do the following:

worker.name("John").salary(100)

Basically, this changes the worker's(John's) salary to 100.

Is there a way to define a function in a function?

Can you tell me the method and explain it?

• Deepak Ingole: Ans :yes..It possible
• Lok Jun: @Pilot Can you tell me the method and explain it?
• Dave Newton: That's not a function in a function. Just return something you can call the next method on. Method chaining.
• Deepak Ingole: define object worker with nested method returning method again
• user1552586: Have you checked: phpied.com/3-ways-to-define-a-javascript-class ?

Answer 1

This is often times called chaining. Essentially, each method returns the parent object:

var worker = {
 name: function ( name ) {
 this._name = name;
 return this;
 },
 salary: function ( salary ) {
 this._salary = salary;
 return this;
 }
};
worker.name("Jonathan").salary("1ドル");
alert( worker._name );
alert( worker._salary );

You'll note that each method returns the object. This is made very clear in the following screenshot. If we console output the results of calling the name method, we see that the entire worker object is returned:

enter image description here

• Lok Jun: I didn't know this was possible until now.

Answer 2

Create a constructor function like:

var Worker = function(){
};
Worker.prototype.name = function (name){
 this.name = name;
 return this;
};
Worker.prototype.salary = function (salary){
 this.salary = salary;
 return this;
}

Now above constructor function can be used as:

var worker = new Worker();
worker.name("John Doe").salary(100);

• Lok Jun: Can you just use "Worker().name("JOHN").salary(100)"?
• Durgesh: Nope, that wont be possible as I have used constructor pattern. For that you can check @Jonathan Sampson solution.

Answer 3

This is possible:

var worker = {
 nameVar: null,
 salaryVar: null,
 name: function(name) {
 this.nameVar = name;
 return this;
 },
 salary: function(salary) {
 this.salaryVar = salary;
 return this;
 }
}

Each method modifies the object, and returns this, which is the object. Then you can call another method, like in your example, without writing the object name explicitly.

Alternatively, you can implement a .clone method, and instead of this, return the clone with a modified property. This would be somewhat similar to the way jQuery works.