Note that there are some explanatory texts on larger screens.

plurals
  1. POCan you create functions with custom prototypes in JavaScript?
    primarykey
    data
    text
    <p>First of all, I <em>don't</em> want to add methods to <code>Function.prototype</code>. Doing that would make them available for <em>all</em> functions and that's not what I'm looking for.</p> <p>In JavaScript you can create objects with custom prototypes like this:</p> <pre><code>function CustomObj() {} CustomObj.prototype = {}; CustomObj.prototype.sayFoo = function () { return 'foo' }; var myCustomObj = new CustomObj(); //=&gt; returns an object: {} myCusomObj.sayFoo(); //=&gt; 'foo' </code></pre> <p>You can also create array-like objects with custom prototypes like this:</p> <pre><code>function CustomArr() {} CustomArr.prototype = []; CustomObj.prototype.sayFoo = function () { return 'foo' }; var myCustomArr = new CustomArr(); //=&gt; returns an ordered object: [] myCustomArr.sayFoo(); //=&gt; 'foo' </code></pre> <p>What I'd like to do is use some kind of constructor to create a function with its own custom prototype in the same way. However, the following does not work:</p> <pre><code>function CustomFn() {} CustomFn.prototype = function () {}; CustomFn.prototype.sayFoo = function () { return 'foo' }; var myCustomFn = new CustomFn(); //=&gt; PROBLEM! returns an object: {} myCustomFn.sayFoo(); //=&gt; 'foo' // ^^ Here, the prototype was applied but the output was not a function. myCustomFn(); //=&gt; TypeError: object is not a function </code></pre> <p>So is there any way to accomplish what I'm trying to do?</p> <h2>UPDATE</h2> <p>Maybe there's another way I could be asking this question that would make it a little clearer.</p> <p>There's a problem with the idea of a closure:</p> <pre><code>function makeFn() { var output = function () { /* do some stuff */ }; output.foo = function () { /* do some stuff */ }; return output; } var specialFn = makeFn(); </code></pre> <p>Essentially, this technique gives me what I want. However, the problem is that every time I call <code>makeFn</code>, <code>output.foo</code> has to be created as a totally independent function that takes up its own memory. Gross. So I could move that method out of the closure:</p> <pre><code>var protoMethods = { "foo" : function () { /* do some stuff */ } }; function makeFn() { var output = function () { /* do some stuff */ }; for (var i in protoMethods) { Object.prototype.hasOwnProperty.call(protoMethods, i) &amp;&amp; (output[i] = protoMethods[i]); } return output; } var specialFn = makeFn(); </code></pre> <p>But now I have to manually do an iteration every time I call <code>makeFn</code> which would be less efficient than if I could just assign <code>protoMethods</code> to be the prototype of <code>output</code>. So, with this new update, any ideas?</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload