Adding methods to an JavaScript object

Question

I could create an object with some methods, and later add a property to it as follows:

var myObj = (function () {
 var my = {};
 my.method1=function(){}
 my.method2=function(){}
 my.method3=function(){}
 return my;
 }());
myObj.myProperty=123;

How could I create the object first and add a property, and then later add the methods afterwards?

myObj={};
myObj.myProperty=123;
//How do I add the above methods to myObj?

• tymeJV: myObj.my = { method1: function() }
• Shawn Bush: Why can't you use myObj.method1 = function() {}?
• Felix Kling: I assume you are not simply doing myObj.method1=function(){}; because you want the functions to be defined in their own scope? Otherwise I don't really see what the issue is.
• user1032531: @FelixKling Yes, each of them have their own script.
• user1032531: @ShawnBush I suppose I could, but the way I showed just seemed like a clean way to organize them.

Answer 1

I guess there are two solutions:

Merge the objects:

var myObj = {...};
// ...
var objWithMethods = (function() { ... }());
Object.assign(myObj, objWithMethods);

(Object.assign is an ES6 methods. A polyfill can be found in the link, libraries often also provide a method with similar behavior).

Pass the object the methods should be assigned to as argument:

var myObj = {};
myObj = (function (obj) {
 var my = obj || {};
 my.method1=function(){}
 my.method2=function(){}
 my.method3=function(){}
 return my;
}(myObj));

• user1032531: Thank you Felix. Would you recommend one approach over the other? I assume I will go the with the second option unless you think differently.
• Felix Kling: At this point, the most important factor is that whoever reads the code understands what's going on.
• user1032531: Well, I definitely understand the second approach, but currently not the first approach. Suppose I should learn both of them. Thanks!

Answer 2

You can do an extend operation using an existing object

var myObj = {...}
var myAdditionalMethods = { someMethod : function(){ } }
//extend the object
for(var i in myAdditionalMethods)
 if(!myObj.hasOwnProperty(i)) 
 myObj[i] = myAdditionalMethods[i];

there are a lot of libraries that have this functionality built in, but that is how you would do it without one

Answer 3

Even prototype can add the functions to original object.

 var myObj = function() {
 this.myProperty = 123;
 }
 myObj.prototype.method1 = function method1() {
 alert("method1")
 }
 myObj.prototype.method2 = function method2() {
 alert("method2")
 }
 var newObj = new myObj();
 newObj.method1();
 newObj.method2();
 console.log(newObj)