86

I'd like to be able to say something like this in javascript :

   "a".distance("b")

How can I add my own distance function to the string class?

2

6 Answers 6

161

You can extend the String prototype;

String.prototype.distance = function (char) {
    var index = this.indexOf(char);

    if (index === -1) {
        alert(char + " does not appear in " + this);
    } else {
        alert(char + " is " + (this.length - index) + " characters from the end of the string!");
    }
};

... and use it like this;

"Hello".distance("H");

See a JSFiddle here.

5
  • 49
    FYI.. use this to get the string this function is called on
    – Brian Low
    Commented Jul 29, 2012 at 5:49
  • 5
    Actually, for me, this returns an object like String {0: "t", 1: "e", 2: "s", 3: "t", length: 4, [[PrimitiveValue]]: "test"}. To work with the actual text, I had to call this.toString() Commented Nov 10, 2015 at 7:11
  • 1
    is there any way to write "String.prototype.distance = function (char) {}" in ECMA script way? Commented Oct 4, 2016 at 4:05
  • 5
    Extending native JavaScript objects is generally a bad practice. See stackoverflow.com/questions/14034180/… Commented May 5, 2017 at 2:35
  • how about an array? Array.prototype.myFunc = function(a) and [/*...*/].myFunc(5) don't work
    – danik0011
    Commented Sep 3, 2023 at 9:41
22
String.prototype.distance = function( arg ) {
    // code
};
19

Minimal example:

No ones mentioned valueOf.

==================================================

String.prototype.
OPERATES_ON_COPY_OF_STRING = function ( 
    ARGUMENT 
){

    //:Get primitive copy of string:
    var str = this.valueOf();

    //:Append Characters To End:
    str = str + ARGUMENT;

    //:Return modified copy:
    return( str );
};

var a = "[Whatever]";
var b = a.OPERATES_ON_COPY_OF_STRING("[Hi]");
console.log( a ); //: [Whatever]
console.log( b ); //: [Whatever][Hi]

==================================================

From my research into it, there is no way to edit the string in place.

Even if you use a string object instead of a string primitive.

Below does NOT work and get's really weird results in the debugger.

==================================================

String.prototype.
EDIT_IN_PLACE_DOES_NOT_WORK = function ( 
    ARGUMENT 
){

    //:Get string object:
    var str = this;

    //:Append Characters To End:
    var LN = str.length;
    for( var i = 0; i < ARGUMENT.length; i++){
        str[LN+i] = ARGUMENT[ i ];
    };

};

var c = new String( "[Hello]" );
console.log( c );
c.EDIT_IN_PLACE_DOES_NOT_WORK("[World]");
console.log( c );

==================================================

3
  • 3
    This is exactly what I was searching for.
    – Mahesh
    Commented Jun 5, 2019 at 22:19
  • While the accepted answer, answers the original question this is a stronger overall general answer. I do have to ask why return(str) vs return str? Commented Sep 17, 2019 at 20:05
  • I was creating a new method for string class, something like String.prototype.toJadeCase(). And this answer helped me achieve that. Commented Aug 18, 2020 at 13:16
13

after years (and ES6) … we have a new option how to do this:

Object.defineProperty( String.prototype, 'distance', {
	value: function ( param )
	{
		// your code …
		return 'counting distance between ' + this + ' and ' + param;
	}
} );

// ... and use it like this:
const result = "a".distance( "b" );
console.log(result);

2
  • this only defines a common property for all strings. what if i want to add a different function instance to each string instance?
    – Michael
    Commented May 30, 2022 at 18:13
  • @Michael yes, this example add property only for String(). But it's possible to add property into all objects by using Window.prototype instead of String.prototype.
    – iiic
    Commented Sep 26, 2023 at 15:12
8

You could do this:

String.prototype.distance = function (){ 
    //your code 
}
1
  • 2
    That's a syntax error (you commented out your closing curly brace) :D
    – Will
    Commented Dec 5, 2011 at 21:28
4

Using prototype to add you own function to string is called a prototype I created small JavaScript code that can select elements and change its innerHTML

var dom; //you can replce this to be $ just like jQuery
dom = function(elm) {
if(typeof elm === "object") {
   // already done example 
   //typeof document.getElementById('id') will be object
   return [elm];
 } else {
    return document.querySelectorAll(elm);
 }
} // Returns elements by all css selector eg
// .class #id id p id > p id ~ p in short any css selectors 
 Object.prototype.text = function(txt) {  //object prototype as NodeList returned would be object or maybe displayed as [Object NodeList]
     var i = 0; //loop through the elements 
     for(i; i < this.length; i++) {
        this[i].innerHTML = txt;
      }
 // in this function this refers to object that this function is passed on
 };
 dom('.classh').text('Changed for elements with classh');
 dom('#heading').text('Changed for elements with id heading'); //examples

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.