I have an object that looks something like this:
var myObj = {
_fooCon: function(f) {
if (typeof f != 'function') throw new TypeError('Bad Foo');
this.fn = f;
},
_barCon: function(f) {
if (typeof f != 'function') throw new TypeError('Bad Bar');
this.fn = f;
},
someFoo: function(v) {
return new this._fooCon(function(x) {
return x + ' Foo ' + v;
});
},
someBar: function(v) {
return new this._barCon(function(x) {
return x + ' Bar ' + v;
});
}
};
The reason for doing this is so I can use instanceof productively (i.e., so I can distinguish between the two objects, which are used in different scenarios, despite being structurally identical). (Ignore the fact that someFoo and someBar are similar!)
Is there a way I can abstract the constructor functions, so if I need to create, say, _bazCon, I don't need to repeat myself; or, if there's a bug, I don't have to fix every constructor definition?
I tried making a factory member, like this:
_factory: function(type, f) {
if (typeof f != 'function') throw new TypeError('Bad ' + type);
this.fn = f;
}
...then:
_fooCon: function(f) { return new this._factory('Foo', f); }
Even without trying this, I can see it's not going to work! Any ideas on how to achieve what I'm looking for?
If your functions really do the same thing, then it's as simple as this:
var myObj = {
_factory: function(err) {
return function(f) {
if (typeof f != 'function') throw new TypeError('Bad ' + err);
this.fn = f;
};
},
someFoo: function(v) {
return new this._fooCon(function(x) {
return x + ' Foo ' + v;
});
},
someBar: function(v) {
return new this._barCon(function(x) {
return x + ' Bar ' + v;
});
}
};
myObj._fooCon = myObj._factory("Foo");
myObj._barCon = myObj._factory("Bar");
If there's other behavior that differentiates them, then you could have _factory receive a function argument that is invoked within the constructor. That function could use .call or .apply to set the this value to the object being constructed.
A different approach would be to use a constructor to create myObj, and take advantage of the variable scope so that you don't need to expose the _xxxCon constructors.
This uses an anonymous function as a constructor, since we don't need it again.
var myObj = new function() {
var _factory = function(err) {
return function(f) {
if (typeof f != 'function') throw new TypeError('Bad ' + err);
this.fn = f;
};
};
var _fooCon = _factory("Foo");
var _barCon = _factory("Bar");
this.someFoo = function(v) {
return new _fooCon(function(x) {
return x + ' Foo ' + v;
});
},
this.someBar = function(v) {
return new _barCon(function(x) {
return x + ' Bar ' + v;
});
}
};
You don't necessarily need the outer function to be used as a constructor, but you do need a function that returns an object to myObj.
If you did want to expose the _xxxCon functions, then change var to this., and put the this. back in someFoo and someBar.
Related
I'd like to know if it is possible to achieve this in javascript:
function Hello() { }
Hello.prototype.echo = function echo() {
return 'Hello ' + this.firstname + '!';
};
// execute the curryed new function
console.log(new Hello()('firstname').echo())
Is it possible to curry var o = new Class()(param1)(param2)(...) ?
Thank you in advance for your help.
Using the answer of georg with an array of the properties and a counter for assigning an arbitrary count of properties.
function Hello() {
var args = ['firstname', 'lastname'],
counter = 0,
self = function (val) {
self[args[counter++]] = val;
return self;
};
Object.setPrototypeOf(self, Hello.prototype);
return self;
}
Hello.prototype.echo = function echo() {
return 'Hello ' + this.firstname + ' ' + (this.lastname || '') + '!';
};
console.log(new Hello()('Bob').echo());
console.log(new Hello()('Marie')('Curie').echo());
For example:
function Hello() {
let self = function (key, val) {
self[key] = val;
return self;
};
Object.setPrototypeOf(self, Hello.prototype);
return self;
}
Hello.prototype.echo = function echo() {
return 'Hello ' + this.firstname + this.punct;
};
console.log(new Hello()('firstname', 'Bob')('punct', '...').echo())
In your code new Hello('Bob') does not return a function, but an object that has an .echo() method.
function Hello(firstname) {} is a contructor function that returns an object when instantiated with new.
// constructor function expecting 1 argument
function Hello(firstname) {
this.firstname = firstname;
}
// attach a method to the constructor prototype
Hello.prototype.echo = function() {
return 'Hello ' + this.firstname + '!'; // the method can use the contructor's properties
};
// new Hello('Bob') returns the object, and you can call the .echo() method of that object
console.log(new Hello('Bob').echo())
I had a coding interview test that asked the following question which I was not able to fully solve. I'm wondering the best way to do this following my approach -- also sorry this is long.
You are given a function to read in like this (not necessarily 2 parameters):
function add(a, b) {
return a + b;
}
The objective is to create a function to initialize some of those variables and again call the function to perform the calculation like, function setParam(func, params). To use this you would do the following:
_add = setParam(add, {b:9})
_add(10) // should return 19
My solution was to parse the function to see how many parameters there are, then set them using the given parameters but since I barely know javascript I was never able to actually return a function with only some variables set and others still undefined.
(attempt at solution)
function setParam(func, params) {
// varray is an array of the the varriables from the function, func
// ie varray = [a,b] in this test
var varray = /function[^\(]*\(([^\)]*)\)/.exec(func.toString())[1].split(',');
//creates an array, paramset, that has the variables in func defined
//where possible
// ex paramset = [a,9] if only b was set
var paramsset = []
for (i = 0; i < varray.length; i++) {
if (typeof(params[varray[i]]) == "undefined"){
paramsset[i] = varray[i];
} else {
paramsset[i] = params[varray[i]];
}
}
//////
// need to modify existing function and return with added parameters
// where I'm stuck as this doesn't work.
newfunc = (function(){
var _func = func;
return function() {
return _func.apply(this, paramsset);
}
})();
newfunc()
}
I'm sure I'm not doing this the correct way, but any help would be appreciated.
I'm certainly not advocating to go towards that solution, but I still implemented something to follow your initial's API design for fun. The signatures weak map is necessary in order to preserve the initial function's signature so that we can call setParams again on partially applied functions.
var setParams = (function () {
var signatures = new WeakMap();
return function (fn, paramsToApply) {
var signature = signatureOf(fn), newFn;
validateParams(paramsToApply, signature.params);
newFn = function () {
var params = appliedParamsFrom(arguments, paramsToApply, signature.indexes);
return fn.apply(this, params);
};
signatures.set(newFn, signature);
return newFn;
};
function signatureOf(fn) {
return signatures.has(fn)?
signatures.get(fn) :
parseSignatureOf(fn);
}
function parseSignatureOf(fn) {
return String(fn)
.match(/function.*?\((.*?)\)/)[1]
.replace(/\s+/g, '')
.split(',')
.reduce(function (r, param, index) {
r.indexes[param] = index;
r.params.push(param);
return r;
}, { indexes: {}, params: [] });
}
function validateParams(paramsToApply, actualParams) {
Object.keys(paramsToApply).forEach(function (param) {
if (actualParams.indexOf(param) == -1) throw new Error("parameter '" + param + "' could not be found in the function's signature which is: 'function (" + actualParams + ")'");
});
}
function appliedParamsFrom(args, paramsToApply, paramsIndex) {
var appliedParams = [],
usedIndexes = [],
argsIndex = 0,
argsLen = args.length,
argSpotIndex = 0;
Object.keys(paramsToApply).forEach(function (param) {
var index = paramsIndex[param];
appliedParams[index] = paramsToApply[param];
usedIndexes.push(index);
});
while (argsIndex < argsLen) {
if (usedIndexes.indexOf(argSpotIndex) == -1) {
appliedParams[argSpotIndex] = args[argsIndex++];
}
++argSpotIndex;
}
return appliedParams;
}
})();
function add(a, b) { return a + b; }
var addTo9 = setParams(add, { b: 9 });
var add10To9 = setParams(addTo9, { a: 10 });
document.write(addTo9(10) + ', ' + add10To9());
Now, note that JavaScript comes with the Function.prototype.bind function which allows to perform in-order partial function application. The first parameter to bind has nothing to do with arguments, it's to bind the this value.
function add(a, b) { return a + b; }
var addTo9 = add.bind(null, 9);
document.write(addTo9(10));
And finally, an implementation with a placholder if you need one:
var partial = (function (undefined) {
var PLACEHOLDER = {};
function partial(fn, partialArgs) {
return function () {
return fn.apply(this, applyPartialArgs(arguments, partialArgs));
};
}
Object.defineProperty(partial, 'PLACEHOLDER', {
get: function () { return PLACEHOLDER; }
});
return partial;
function applyPartialArgs(args, partialArgs) {
var appliedArgs = partialArgs.map(function (arg) {
return arg === PLACEHOLDER? undefined : arg;
}),
partialArgsLen = partialArgs.length,
argsLen = args.length,
argsIndex = 0,
argSpotIndex = 0;
while (argsIndex < argsLen) {
if (
partialArgs[argSpotIndex] === PLACEHOLDER ||
argSpotIndex >= partialArgsLen
) {
appliedArgs[argSpotIndex] = args[argsIndex++];
}
++argSpotIndex;
}
return appliedArgs;
}
})();
function add(a, b, c, d) {
return a + b + c + d;
}
var _ = partial.PLACEHOLDER;
var addTo9 = partial(add, [_, 5, _, 4]);
document.write(addTo9(5, 5));
I'm guessing that they might have been testing for knowledge of partial application. (not currying)
Edit: Edited based upon your comments. This is Crockford's curry function straight from his book.
function add(a, b) {
return a + b;
}
if (!Function.prototype.partial) {
Function.prototype.partial = function() {
var slice = Array.prototype.slice,
args = new Array(arguments.length),
that = this;
for (var i = 0; i < args.length; i++) {
args[i] = arguments[i];
}
return function() {
return that.apply(null, args.concat(slice.apply(arguments)));
}
};
}
var example = add.partial(4);
console.log(example(10)); // output 14
console.log(example(20)); // output 24
var example = adder(4) assigns example to be function with a closure with a (in this case 4). When example is called like in the console.log, it will in effect be returning "the value of a when example was assigned, plus this new number."
Walkthrough of the partial() function:
Converts arguments to an array
returns a function gets passed the arguments given, which can be called later. It has a closure with the previously assigned arguments.
I need to implement inheritance tree in JavaScript where each node can have more than 1 parent. We have to implement Object.Create and Object.call methods on our own. We are specifically not allowed to use new keyword. Here is what I have so far:
var myObject = {
hash:0,
parents: [],
create: function(args){
//TODO check if not circular
if(args instanceof Array){
for(i=0;i<args.length;i++){
this.parents.push(args[i]);
}
}
return this;
},
call : function(fun,args){
//TODO: dfs through parents
return this[fun].apply(this,args);
},
}
var obj0 = myObject.create(null);
obj0.func = function(arg) { return "func0: " + arg; };
var obj1 = myObject.create([obj0]);
var obj2 = myObject.create([]);
obj2.func = function(arg) { return "func2: " + arg; };
var obj3 = myObject.create([obj1, obj2]);
var result = obj0.call("func", ["hello"]);
alert(result);
//calls the function of obj2 istead of obj0
The problem with this code is that I get a call to obj2's function instead of obj0's. I'm suspecting that create() function should not return this, but something else instead (create instance of itself somehow).
In your current solution, you are not actually creating a new object with your myObject.create() function, you are just using the same existing object and resetting it's parent array. Then, when you define .func() you are overriding that value, which is why func2: appears in your alert.
What you need to do is actually return a brand new object. returning this in your myObject.create() will just return your existing object, which is why things are getting overridden.
To avoid using the new keyword, you'll want to do either functional inheritance or prototypal inheritance. The following solution is functional inheritance:
function myObject (possibleParents) {
//create a new node
var node = {};
//set it's parents
node.parents = [];
//populate it's parents if passed in
if (possibleParents) {
if (possibleParents instanceof Array) {
for (var index = 0; index < possibleParents.length; index++) {
node.parents.push(possibleParents[index]);
}
} else {
node.parents.push(possibleParents);
};
}
//
node.call = function(fun,args) {
return this[fun].apply(this,args);
};
return node;
};
var obj0 = myObject();
obj0.func = function(arg) { return "func0: " + arg; };
var obj1 = myObject([obj0]);
var obj2 = myObject();
obj2.func = function(arg) { return "func2: " + arg; };
var obj3 = myObject([obj1, obj2]);
var result = obj0.call("func", ["hello"]);
alert(result); // this will successfully call "func0: " + arg since you created a new object
I managed fix this problem only by using function instead of variable.
function myObject () {
this.parents = [];
this.setParents = function(parents){
if(parents instanceof Array){
for(i=0;i<parents.length;i++){
this.parents.push(parents[i]);
}
}
};
this.call = function(fun,args) {
return this[fun].apply(this,args);
};
}
var obj0 = new myObject();
obj0.func = function(arg) { return "func0: " + arg; };
var obj2 = new myObject();
obj2.func = function(arg) { return "func2: " + arg; };
var result = obj0.call("func", ["hello"]);
alert(result);
This is a question for the guru of JavaScript. I'm trying to do work with JavaScript prototype model more elegant. Here is my utility code (it provides real chain of prototypes and correct work with instanceof operator):
function Class(conf) {
var init = conf.init || function () {};
delete conf.init;
var parent = conf.parent || function () {};
delete conf.parent;
var F = function () {};
F.prototype = parent.prototype;
var f = new F();
for (var fn in conf) f[fn] = conf[fn];
init.prototype = f;
return init;
};
It allows me to do such thigns:
var Class_1 = new Class({
init: function (msg) { // constructor
this.msg = msg;
},
method_1: function () {
alert(this.msg + ' in Class_1::method_1');
},
method_2: function () {
alert(this.msg + ' in Class_1::method_2');
}
});
var Class_2 = new Class({
parent: Class_1,
init: function (msg) { // constructor
this.msg = msg;
},
// method_1 will be taken from Class_1
method_2: function () { // this method will overwrite the original one
alert(this.msg + ' in Class_2::method_2');
},
method_3: function () { // just new method
alert(this.msg + ' in Class_2::method_3');
}
});
var c1 = new Class_1('msg');
c1.method_1(); // msg in Class_1::method_1
c1.method_2(); // msg in Class_1::method_2
var c2 = new Class_2('msg');
c2.method_1(); // msg in Class_1::method_1
c2.method_2(); // msg in Class_2::method_2
c2.method_3(); // msg in Class_2::method_3
alert('c1 < Class_1 - ' + (c1 instanceof Class_1 ? 'true' : 'false')); // true
alert('c1 < Class_2 - ' + (c1 instanceof Class_2 ? 'true' : 'false')); // false
alert('c2 < Class_1 - ' + (c2 instanceof Class_1 ? 'true' : 'false')); // true
alert('c2 < Class_2 - ' + (c2 instanceof Class_2 ? 'true' : 'false')); // true
My question is: Is there more simple way to do this?
Yes, there is a better way to do this.
var call = Function.prototype.call;
var classes = createStorage(),
namespaces = createStorage(),
instances = createStorage(createStorage);
function createStorage(creator){
var storage = new WeakMap;
creator = typeof creator === 'function' ? creator : Object.create.bind(null, null, {});
return function store(o, v){
if (v) {
storage.set(o, v);
} else {
v = storage.get(o);
if (!v) {
storage.set(o, v = creator(o));
}
}
return v;
};
}
function Type(){
var self = function(){}
self.__proto__ = Type.prototype;
return self;
}
Type.prototype = Object.create(Function, {
constructor: { value: Type,
writable: true,
configurable: true },
subclass: { value: function subclass(scope){ return new Class(this, scope) },
configurable: true,
writable: true }
});
function Class(Super, scope){
if (!scope) {
scope = Super;
Super = new Type;
}
if (typeof Super !== 'function') {
throw new TypeError('Superconstructor must be a function');
} else if (typeof scope !== 'function') {
throw new TypeError('A scope function was not provided');
}
this.super = Super;
this.scope = scope;
return this.instantiate();
}
Class.unwrap = function unwrap(Ctor){
return classes(Ctor);
};
Class.prototype.instantiate = function instantiate(){
function super_(){
var name = super_.caller === Ctor ? 'constructor' : super_.caller.name;
var method = Super.prototype[name];
if (typeof method !== 'function') {
throw new Error('Attempted to call non-existent supermethod');
}
return call.apply(method, arguments);
}
var Super = this.super,
namespace = namespaces(Super),
private = instances(namespace)
var Ctor = this.scope.call(namespace, private, super_);
Ctor.__proto__ = Super;
Ctor.prototype.__proto__ = Super.prototype;
namespaces(Ctor, namespace);
classes(Ctor, this);
return Ctor;
}
example usage:
var Primary = new Class(function(_, super_){
var namespace = this;
namespace.instances = 0;
function Primary(name, secret){
this.name = name;
_(this).secret = secret;
namespace.instances++;
}
Primary.prototype.logSecret = function logSecret(label){
label = label || 'secret';
console.log(label + ': ' + _(this).secret);
}
return Primary;
});
var Derived = Primary.subclass(function(_, super_){
function Derived(name, secret, size){
super_(this, name, secret);
this.size = size;
}
Derived.prototype.logSecret = function logSecret(){
super_(this, 'derived secret');
}
Derived.prototype.exposeSecret = function exposeSecret(){
return _(this).secret;
}
return Derived;
});
var Bob = new Derived('Bob', 'is dumb', 20);
Bob.logSecret();
console.log(Bob);
console.log(Bob.exposeSecret());
After some research I've concluded there is no more simple way to do this.
...or are there better ways to implement a Memoization?
Function.memoize = function(callableAsString)
{
var r = false, callable, code;
try
{
callable = eval(callableAsString);
if (typeof callable == "function" && typeof(Function.memoize.cache[callableAsString]) == "undefined")
{
code = callableAsString + " = function()" +
"{" +
"var cache = Function.memoize.cache['" + callableAsString + "'];" +
"var k = Json.stringify([this].concat(arguments));" +
"return cache.r[k] || (cache.r[k] = cache.c.apply(this, arguments));" +
"};" +
"true;";
if (r = eval(code))
{
Function.memoize.cache[callableAsString] = {c: callable, r: {}};
}
}
}
catch (e) {}
return r;
};
Function.memoize.cache = {};
Function.memoize("String.prototype.camelize");
Update based on the suggestions by Felix Kling
Function.memoize = function(callable)
{
var r = false;
if (typeof callable == "function")
{
var hash = callable.toString().hashCode();
r = function()
{
var cache = Function.memoize.cache[hash];
var key = Json.stringify([this].concat(arguments));
return cache.r[key] || (cache.r[key] = cache.c.apply(this, arguments));
}
if (!Function.memoize.cache)
{
Function.memoize.cache = {};
}
r.memoize = callable;
Function.memoize.cache[hash] = {c: callable, r: {}};
}
return r;
};
Function.unmemoize = function(callable)
{
if (callable.memoize && typeof callable.memoize == "function")
{
return callable.memoize;
}
else
{
return false;
}
};
String.prototype.camelize = Function.memoize(String.prototype.camelize);
String.prototype.camelize = Function.unmemoize(String.prototype.camelize);
I don't see the need for eval... consider this implementation
function memoize(f, cache)
{
if (!cache) cache = {};
return function()
{
var key = JSON.stringify(arguments);
return (cache[key] || (cache[key] = [f.apply(this, arguments)]))[0];
}
}
Note that I deliberately ignored this in the key. The reason is that this may not be serializable by stringify (e.g. because of loops) and this is more the rule than the exception for example when this == window i.e. in the global context.
What is IMO useful is the ability to explictly pass the cache, so that you can for example create a separate cache for each instance or one shared cache for all instances by doing something like:
function MyObj(...)
{
// every instance has its own cache
this.foo = memoize(function(...) { ... });
// there is one shared cache for all instances
this.bar = memoize(function(...) { ... }, MyObj.memoize_cache);
}
MyObj.memoize_cache = {};