How must a function be 'chained', in order to call this function like this
F('Test').custom_substring(0,1);
3 Answers
You have to return an object that has a method member named custom_substring. One example:
var F = function(){
return {
custom_substring:function(){
console.log('custom substring');
return this;
}
}
}
F('Test')
.custom_substring(0,1)
.custom_substring(0,1)
.custom_substring(0,1);
To create objects you can use constructor functions and prototype, this is a complex subject and explained here.
I would not mess with the String.prototype because that breaks encapsulation.
The following sample provides a chainable custom_substring that does not modify the original object but instead returns a new one. This is similar to how jQuery and other libraries work (and how built-in string operations work) and it helps make for safer and more predictable code.
function F(str) {
return {
toString: function () { return str; },
// You didn't provide an example of what you want custom_substring
// to do, so I'll have it append a "!" to the beginning of the resulting value
// (since I can't think of anything else for it to do)
custom_substring: function (from, to) {
return F("!" + str.substring(from, to));
}
};
}
var s1 = F("Hello everyone");
var s2 = s1.custom_substring(0, 7);
var s3 = s2.custom_substring(0, 5)
.custom_substring(0, 4);
console.log(s1); // Hello everyone
console.log(s2); // !Hello e
console.log(s3); // !!!He
4 Comments
enzian
Is there a equivalent for toString: ..., if you have (like in libraries) a string as input and want to return an element as 'default'?
JLRishe
@user3744885 Could you give a more specific example? I'm not sure what you mean.
enzian
I want a function I call F('id_of_an_element'), that returns me the document.getElementById() of the parameter, but I still want to have other 'subfunctions' like F('test').custom_substring;
JLRishe
@user3744885 Ok, and what would
custom_substring do in this case (if F('test') is selecting elements. And have you considered creating a jQuery plugin for this instead of reinventing the wheel?If you really want to create chainloading you need always return this from methods where it's possible.
For example we have some class with some methods:
function Foo() {
this.foo = 'bar';
return this;
}
Foo.prototype = Object.create({
sayFoo: function() {
console.log(this.foo);
return this;
},
getFoo: function() {
return this.foo; // Here you can't make chainload
},
saySmth: function() {
console.log('Something');
return this;
}
});
And we can use this:
var test = new Foo().sayFoo().saySmth().getFoo(); // prints this.foo -> 'Something' -> returns this.foo
console.log(test); // prints out this.foo
3 Comments
Bergi
WTH is
Object.create good for? Btw, you don't need to return this from a constructor
Eugene Obrezkov
@Bergi Are you seriously? Object.create creates object with prototype, read ECMA-262. For creating chainloading effect needs return this from a constructor. Oh man, you need read a lot of books.
Bergi
I know very well what it does, I'm trying to tell you that it's useless (if not wrong) where you use it. And no, you don't need to
return this from constructors. Oh man, you should throw away your books (I have tried reading a few, but I mostly found them sprinkled with mistakes).
"Test".replace("T","").replace("e","")....becausereplacereturns a string which you can call letter.