Is there a way to chain functions in JavaScript so when last function in chain is called we take into consideration all function in chain that was specified.
Basically what I am trying to do is the same thing express-validator
does:
Something like this:
check('password').passwordValidator().optional();
I want to be able to call
check('password').passwordValidator();
and
check('password').passwordValidator().optional();
So you're looking for a sort of builder pattern? You can do that like this:
class Foo {
_passwordValidator = false;
_optional = false;
passwordValidator() {
this._passwordValidator = true;
return this;
}
optional() {
this._optional = true;
return this;
}
doThing() {
if (this._optional) { /* ... */ }
if (this._passwordValidator) { /* ... */ }
}
}
const foo = new Foo().passwordValidator().optional();
foo.doThing();
Edit: to more directly answer your question, there is no way to wait to do something until the current chain of method calls is done; you have to call a method like doThing() in the example to signal that you actually want to do the thing now.
I ended up using what #coolreader18 suggested.
That was exactly what I was looking for.
function func(val) {
this._optional = false;
this._check = false;
const doStaff = (message = 'Doing staff') => {
console.log(message);
return;
};
return {
check: function(n) {
this._check = true;
return this;
},
optional: function(n) {
this._check = false;
this._optional = true;
return this;
},
exec: function() {
if (this._check) doStaff();
if (this._optional) doStaff('Maybe not');
}
}
}
func().check().optional().exec();
var Obj = {
result: 0,
addNumber: function(a, b) {
this.result = a + b;
return this;
},
multiplyNumber: function(a) {
this.result = this.result * a;
return this;
},
divideNumber: function(a) {
this.result = this.result / a;
return this;
}
}
Obj.addNumber(10, 20).multiplyNumber(10).divideNumber(10);
link => https://medium.com/technofunnel/javascript-function-chaining-8b2fbef76f7f
Calling a chained method of express-validator returns a middleware function, and as functions can have properties you can call a method on that returned function, which returns a new function with methods and so on. Chaining functions is quite easy:
const chain = (pairs, fn = el => el) => {
for(const [key, method] of pairs)
fn[key] = (...opt) => chain(pairs, method(fn)(...opt));
return fn;
};
const math = chain([
["add", prev => a => b => prev(b) + a],
["mul", prev => a => b => prev(b) * a]
]);
console.log(
(math.add(5).mul(3).add(3))(5)
);
This solution is inspierd by React setState:
function pipe/*<U>*/(val/*: U*/) {
return {
case: function (condition/*: boolean*/, value/*: U | ((prop: U) => U)*/) {
if (condition) {
if (value instanceof Function) {
return pipe(value(val));
} else {
return pipe(value);
}
} else {
return pipe(val);
}
},
valueOf: function () {
return val;
},
};
}
const result = pipe(2)
.case(false, 3)
.case(true, (current) => current + 2)
.case(false, 4)
.valueOf();
console.log(result) // 4
Related
Found this question Implement async/await in sort function of arrays javascript but mine is different.
I want to implement async version of the sort function. for my programming language that compiles to JavaScript called Gaiman where everything is async by default. This make the code way simpler. Some things can be really asynchronuios like reading the input from user but all functions defined in Gaiman are async even if they don't use anything that is really asynchronous.
I've implemented custom class that extend Array:
function is_function(obj) {
return typeof obj === 'function';
}
function is_promise(obj) {
return obj && is_function(obj.then);
}
class GaimanArray extends Array {
map(...args) {
function call(arr) {
return new GaimanArray(...arr);
}
const arr = super.map.apply(this, args);
const some = super.some;
const has_promise = some.call(arr, is_promise);
if (has_promise) {
return Promise.all(arr).then(call);
} else {
return call(arr);
}
}
forEach(...args) {
return this.map(...args);
}
filter(fn, ctx) {
const filter = super.filter;
function call(arr) {
return new GaimanArray(...filter.call(arr, x => x));
}
const items = this.map(fn, ctx);
if (is_promise(items)) {
return items.then(arr => {
return call(arr);
});
} else {
return call(items);
}
}
reduce(fn, init) {
return super.reduce.call(this, function(acc, ...args) {
if (is_promise(acc)) {
return acc.then(acc => {
return fn(acc, ...args);
});
} else {
return fn(acc, ...args);
}
}, init);
}
sort() {
}
some(fn, ctx) {
const some = super.some;
return this.mapWithCallback(fn, (arr) => {
return some.call(arr, x => x);
}, ctx);
}
every(fn, ctx) {
const every = super.every;
return this.mapWithCallback(fn, (arr) => {
return every.call(arr, x => x);
}, ctx);
}
find(fn, ctx) {
return this.mapWithCallback(fn, (arr) => {
const index = arr.findIndex(x => x);
return this[index];
}, ctx);
}
flatMap(fn, ...args) {
return this.map(...args).flat();
}
mapWithCallback(fn, callback, ctx) {
const items = this.map(fn, ctx);
if (is_promise(items)) {
return items.then(arr => {
return callback(arr);
});
} else {
return callback(items);
}
}
}
The implementation of methods in my array actually makes the promise-based function optional, this is a leftover implementation when I was modifying Array.prototype but it gives problems with some other library that was executing args.some(is_promise).
I think that I can't use Schwartzian transform because I can't get value for each item, my comparison function needs to be really async.
So how can I implement async sort in JavaScript? Every method is working with async functions except I have no idea how to implement sort.
I've created working code based on Rosseta Code:
// based on: https://rosettacode.org/wiki/Sorting_algorithms/Merge_sort#JavaScript
async function mergeSort(array, fn) {
if (array.length <= 1) {
return array;
}
const mid = Math.floor(array.length / 2),
left = array.slice(0, mid), right = array.slice(mid);
await mergeSort(left, fn);
await mergeSort(right, fn);
let ia = 0, il = 0, ir = 0;
while (il < left.length && ir < right.length) {
array[ia++] = (await fn(left[il], right[ir]) <= 0) ? left[il++] : right[ir++];
}
while (il < left.length) {
array[ia++] = left[il++];
}
while (ir < right.length) {
array[ia++] = right[ir++];
}
return array;
}
The Add function is called by the user in the external environment. It is necessary that the called Add function is executed and the resulting value is converted to a number and returned as a response from the called Add function to the external environment.
function Ext() {
let cs = 0;
function pars(fn) {
let newFn = fn.bind(null);
function cal(...num) {
newFn = newFn.bind(null, ...num);
return cal;
}
cal.toString = () => newFn();
return (...num) => {
newFn = fn.bind(null);
return cal(...num);
};
}
const _add = pars((...num) => {
num.forEach((item) => { cs += item; });
return num.reduce((a, b) => a + b);
});
return {
add: function add(...num) {
if ([...num].length === 0) return add;
return _add(...num);
}
/*
add: function(...num) {
function add(...num) {
if ([...num].length === 0) return add;
var promise = new Promise(function(resolve, reject) {
let result = _add(...num);
resolve(result);
});
return promise;
}
add(...num).then(function(result) { Number(result) });
},
*/
}
}
const ext = Ext();
console.log(ext.add()); //function
console.log(ext.add(1)); //1
console.log(ext.add(3, 1)()(3)); //7
console.log(typeof ext.add(1)); //function
let one = ext.add(1);
console.log(one === 1); //false
console.log(Number(one) === 1); //true
console.log(typeof one) //function
console.log(typeof 1) //number
That is, the add function externally returns a number, but it is a function by type. It is necessary that the function ultimately return exactly the number: console.log (typeof ext.add (1)) // Number P. S. The commented code in the question is an attempt to make the function return exactly the number.
I got a code challenge that create a plus-minus functions using method chaining. i have created the code as follows but it eventually failed when it comes to the output rendering
like plus(3).minus(2).value() and minus(3).minus(3).value() kind of method invoking
code as follows
function plus(valuez)
{
this.valuez = this.valuez+ valuez;
function value{
return valuez
}
plus.minus = minus;
plus.value = value;
plus.plus = this;
return this;
}
function minus(valuez)
{
this.valuez = this.v+ valuez;
function value(){
return valuez
}
minus.plus = plus;
minus.minus = this
minus.value = value;
return this;
}
expected output is
1 and 6 but I only get the printed last number entered. how can I resolve this?
class Box {
constructor(v) { this._value = v }
plus(v) { this._value += v; return this; }
minus(v) { this._value -= v; return this; }
value() { return this._value; }
}
function plus(v) { return new Box(v) }
function minus(v) { return new Box(-v) }
console.log("plus(3).minus(2).value()", plus(3).minus(2).value());
console.log("minus(3).minus(3).value()", minus(3).minus(3).value());
function plus (x) { return { _value: x, plus(y){ return plus(this._value+y) }, minus(y){ return plus(this._value-y) }, value(){ return this._value } } }
function minus(x) { return plus(-x) }
console.log("plus(3).minus(2).value()", plus(3).minus(2).value());
console.log("minus(3).minus(3).value()", minus(3).minus(3).value());
Using closure
function plus (x) { return { plus(y){ return plus(x+y) }, minus(y){ return plus(x-y) }, value(){ return x } } }
function minus(x) { return plus(-x) }
console.log("plus(3).minus(2).value()", plus(3).minus(2).value());
console.log("minus(3).minus(3).value()", minus(3).minus(3).value());
Without a constructor or class-sugar you can return an object using closed over values from the addition/subtraction method. Something like:
const { plus, val, reset } = PM();
console.log(plus().plus(3).minus(4).plus(25).plus(4).trace());
console.log(reset().minus(2).plus(33).val());
function PM() {
let values = [];
let traced = [];
const reset = () => {
values = [];
traced = [];
return ret;
};
const add = value => {
const calc = +(values[values.length-1] || 0) + value;
traced.push(`${values[values.length-1] || 0}${
!value || value >= 0 ? "+" : ""}${value || 0}=${calc || 0}`);
values.push(calc || 0);
return ret;
};
const ret = {
plus: value => add(value),
minus: value => add(-value),
val: () => values,
trace: () => traced,
reset,
};
return ret;
}
Or combine this with an embedded constructor
What is the best practice to make an object in JavaScript like this, knowing T is the main object:
T('isArray')([])
T.run('isArray')([])
T().run('isArray')([])
T('isArray', [])
T.run('isArray', [])
T().run('isArray', [])
They all must use the same function.
Since the main object can be called it must be a function. The function should decide what to return based on the arguments:
var T = (function() {
var functions = { // define functions that can be run like isArray
isArray: function(a) {
return Array.isArray(a);
},
log: function(a, b) {
console.log(a + b);
}
};
var noop = function() {}; // function doing nothing (no operation)
var T = function(f) {
if(arguments.length >= 2) { // function + args provided
return (functions[f] || noop) // call it
.apply(this, [].slice.call(arguments, 1));
} else if(arguments.length === 1) { // only function provided
return function() { // return function that can be called with args
return (functions[f] || noop)
.apply(this, arguments);
}
} else { // nothing provided, return T itself (so that e.g. T.run === T().run)
return T;
}
}
T.run = function() { // run function
return T.apply(this, arguments);
};
T.getState = function() { // another function
console.log("Not implemented");
};
return T; // actually return T so that it gets stored in 'var T'
})();
// tests
console.log(
T('isArray')([]),
T.run('isArray')([]),
T().run('isArray')([]),
T('isArray', []),
T.run('isArray', []),
T().run('isArray', [])
);
T('log')(1, 2);
T.getState();
Is there a way to specify something similar to the following in javascript?
var c = {};
c.a = function() { }
c.__call__ = function (function_name, args) {
c[function_name] = function () { }; //it doesn't have to capture c... we can also have the obj passed in
return c[function_name](args);
}
c.a(); //calls c.a() directly
c.b(); //goes into c.__call__ because c.b() doesn't exist
Mozilla implements noSuchMethod but otherwise...no.
No, not really. There are some alternatives - though not as nice or convenient as your example.
For example:
function MethodManager(object) {
var methods = {};
this.defineMethod = function (methodName, func) {
methods[methodName] = func;
};
this.call = function (methodName, args, thisp) {
var method = methods[methodName] = methods[methodName] || function () {};
return methods[methodName].apply(thisp || object, args);
};
}
var obj = new MethodManager({});
obj.defineMethod('hello', function (name) { console.log("hello " + name); });
obj.call('hello', ['world']);
// "hello world"
obj.call('dne');
Almost 6 years later and there's finally a way, using Proxy:
const c = new Proxy({}, {
get (target, key) {
if (key in target) return target[key];
return function () {
console.log(`invoked ${key}() from proxy`);
};
}
});
c.a = function () {
console.log('invoked a()');
};
c.a();
c.b();
No.