Javascript - Create instance with array of arguments

Question

I know the possibility to call a function with an array of arguments with apply(obj,args); Is there a way to use this feature when creating a new instance of a function?

I mean something like this:

function A(arg1,arg2){
    var a = arg1;
    var b = arg2;
}

var a = new A.apply([1,2]); //create new instance using an array of arguments

I hope you understand what i mean... ^^^

Thanks for your help!

Solved!

I got the right answer. To make the answer fit to my question:

function A(arg1,arg2) {
    var a = arg1;
    var b = arg2;
}

var a = new (A.bind.apply(A,[A,1,2]))();

Important note: it doesn't matter what the first element of that array is. For example, new (A.bind.apply(A,['cats',1,2]))(); will work just as well. The reason for this is that new ignores the this value provided to bind. — Nikolai
– Nikolai, Commented Jul 2, 2013 at 22:26
With the shorthand version provided, you don't need the last two brackets '()'. Thus it could be: var a = new (A.bind.apply(A, [null].concat([1, 2]))); — Daniel
– Daniel, Commented Jan 14, 2015 at 22:03

Raynos · Accepted Answer · 2011-02-21 13:53:56Z

16

var wrapper = function(f, args) {
    return function() {
        f.apply(this, args);
    };
};

function Constructor() {
    this.foo = 4;
}
var o = new (wrapper(Constructor, [1,2]));
alert(o.foo);

We take a function and arguments and create a function that applies the arguments to that function with the this scope.

Then if you call it with the new keyword it passes in a new fresh this and returns it.

The important thing is the brackets

new (wrapper(Constructor, [1,2]))

Calls the new keyword on the function returned from the wrapper, where as

new wrapper(Constructor, [1,2])

Calls the new keyword on the wrapper function.

The reason it needs to be wrapped is so that this that you apply it to is set with the new keyword. A new this object needs to be created and passed into a function which means that you must call .apply(this, array) inside a function.

Live example

Alternatively you could use ES5 .bind method

var wrapper = function(f, args) {
    var params = [f].concat(args);
    return f.bind.apply(f, params);
};

See example

edited Feb 21, 2011 at 13:53

answered Feb 20, 2011 at 2:51

Raynos

170k57 gold badges359 silver badges399 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

user113716 Over a year ago

Very nice. +1 Building off of yours, it may be desirable to have wrapper return the function to a variable with the identifier you want so you can call new from that, giving instanceof the result you'd expect. jsfiddle.net/pSpz8/2

user113716 Over a year ago

...or not (to my jsFiddle). After some sleep, I see that I missed the point of the question.

Van Coding Over a year ago

Thanks, this is really good. But the problem of this is, that the Object that is generated, is not of type Constructor. Is there a way to avoid this?

Raynos Over a year ago

@FlashFan that's difficult to do without native .bind support. Alternatively you can start building it into the prototype chain but that just makes a mess of your prototype chain. See edited question though.

Nikolai Over a year ago

Important note: it doesn't matter what array you concat with, as long as it contains exactly one element. For example, var params = ['cats'].concat(args); will work just as well. The reason for this is that new ignores the this value provided to bind.

|

sqykly · Accepted Answer · 2012-02-23 07:19:19Z

7

with ECMAscript 5 you can:

function createInstanceWithArguments (fConstructor, aArgs) {
    var foo = Object.create(fConstructor.prototype);
    fConstructor.apply(foo, aArgs);
    return foo;
}

answered Feb 23, 2012 at 7:19

sqykly

1,59611 silver badges16 bronze badges

Comments

Jon Jaques · Accepted Answer · 2013-05-01 19:00:01Z

6

@Raynos answer works well, except that the non-ES5 version is missing the constructor's prototype after instantiation.

Here's my updated cApply method:

var cApply = function(c) {
  var ctor = function(args) {
    c.apply(this, args);
  };
  ctor.prototype = c.prototype;
  return ctor;
};

Which can be used like this:

var WrappedConstructor = cApply(Constructor);
var obj = new WrappedConstructor([1,2,3]);

// or inline like this.    
var obj2 = new (cApply(Constructor))([1,2,3]);

JSFiddle for reference.

edited May 1, 2013 at 19:00

answered May 1, 2013 at 18:53

Jon Jaques

4,4202 gold badges25 silver badges25 bronze badges

3 Comments

Ali Over a year ago

Best solution - I tweaked your solution to not have to pass an array, but use the wrapped constructor like normal, eg. new WrappedConstructor(1,2,3). I also added the constructor to the prototype for good measure - forked jsfiddle: jsfiddle.net/pBJn4

Ali Over a year ago

Unfortunately there doesn't seem a way to keep the original constructor for the return type, which would be bad for obj instanceof Constructor cases

Jon Jaques Over a year ago

Definitely agree, hacks like this are less than optimal. ES5 FTW.

sdleihssirhc · Accepted Answer · 2011-02-20 02:51:31Z

3

You can curry the functions:

function A(arg1, arg2) {
    // ...
}

function A12() {
    A(1, 2);
}

You could even build a curry factory:

function A_curry() {
    var args = arguments;
    return function () {
        A.apply(null, args);
    };
}

answered Feb 20, 2011 at 2:51

sdleihssirhc

42.6k6 gold badges56 silver badges67 bronze badges

Comments

inf3rno · Accepted Answer · 2014-09-05 14:27:22Z

You can use Object.create() to build the new instance, and call the constructor on the instance after that:

var args = [1,2,3];
var instance = Object.create(MyClass.prototype);
MyClass.apply(instance, args);

or in a single line:

var instance = MyClass.apply(Object.create(MyClass.prototype), args);

but don't forget return this; in MyClass by this single line solution.

If you don't have Object.create(), then it is very simple to write one:

Object.create = function (source){
    var Surrogate = function (){};
    Surrogate.prototype = source;
    return new Surrogate();
};

You can optionally write an Function.newInstance() or a Function.prototype.newInstance() function:

Function.newInstance = function (fn, args){
    var instance = Object.create(fn.prototype);
    fn.apply(instance, args);
    return instance;
};

so var instance = Function.newInstance(MyClass, args);.

note: It is not recommended to override native classes.

Community · Accepted Answer · 2017-05-23 12:10:11Z

0

What if you have your object class name stored in a variable called className ?

var className = 'A'

According to this answer here it all becomes very clean and simple using ECMAScipt5's Function.prototype.bind method.

With an array of arguments:

new ( Function.prototype.bind.apply( className, arguments ) );

Or with an argument list:

new ( Function.prototype.bind.call( className, argument1, argument2, ... ) );

A single line, no need for a wrapper.

edited May 23, 2017 at 12:10

CommunityBot

11 silver badge

answered Mar 4, 2016 at 8:32

Wilt

44.9k15 gold badges163 silver badges216 bronze badges

Comments

Toufiqur Chowdhury · Accepted Answer · 2019-03-07 00:40:24Z

0

I just had the same issue and also wanted to preserve prototype properties of the target object. After looking at the answers, just came up with a rather simple solution. Thought I might as well share it for any future seeker :)

// Define a pseudo object that takes your arguments as an array
var PseudoObject = function (args) {
    TargetObject.apply(this, args);
};
// if you want to inherit prototype as well
PseudoObject.prototype = new TargetObject();

// Now just use the PseudoObject to instantiate a object of the the OtherObject
var newObj = new PseudoObject([1, 2, 3]);

edited Mar 7, 2019 at 0:40

answered Dec 20, 2016 at 0:43

Toufiqur Chowdhury

12 bronze badges

Comments

dlporter98 · Accepted Answer · 2021-10-27 14:27:53Z

0

It can now be done using the spread operator:

let a = new A(...[1,2]);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax#examples

answered Oct 27, 2021 at 14:27

dlporter98

1,6301 gold badge12 silver badges19 bronze badges

Collectives™ on Stack Overflow

Javascript - Create instance with array of arguments

8 Answers 8

7 Comments

Comments

3 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

7 Comments

Comments

3 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related