Javascript String extension

Denne gang vil jeg skrive om extension af strings. I rigtige programmeringssprog har man normalt en helt masse metoder, man kan kalde på sine strings. I javascript må man selv lave meget af arbejdet. Jeg har over tiden samlet og skrevet en del udvidelser til string objektet, som kan gøre livet nemmere. For en fuld reference over alle stringobjektets metoder følg dette link til w3schools.

Alle resultater er udregnet med den rigtige metode og ikke bare hardcoded ind.

.trim(), .trimEnd(), trimStart()

Trim metoder benyttes til at fjerne uønskede mellemrum fra starten og/eller slutningen af sin string

//trim fjerner mellemrum både før og efter string'en
String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g,""); };
//trimEnd fjerner mellemrum i enden af string'en
String.prototype.trimEnd = function() { return this.replace(/\s+$/, ''); };
//trimStart fjerner mellemrum i starten af string'en
String.prototype.trimStart = function() { return this.replace(/^\s+/, ''); };

//trim eksempel
var trimString = "  Denne string har nogle dumme mellemrum i enderne   ",
    trimTest = jQuery("#TrimTest");
trimTest.html("'" + trimString + "'");
trimTest.html(trimTest.html() + "<br />'" + trimString.trim() + "'");
trimTest.html(trimTest.html() + "<br />'" + trimString.trimEnd() + "'");
trimTest.html(trimTest.html() + "<br />'" + trimString.trimStart() + "'");

Resultatet bliver sådan:

.format()

Med format metoden kan man skifte tokens i teksten ud med argumenter fra metodens parametre.
Rigtige format metoder kan meget mere end det, og måske får jeg lavet understøttelse for noget mere når jeg får behov for det.

//En ekstra format funktion til String objektet
//Kan bruges med parametre
String.format = function(text) {
  //Tjek om der er mere end 1 argumenter med som parametre
  if (arguments.length <= 1) {
    //Hvis der kun er een parameter med kan vi bare returnere, da der ikke er noget at formatere
    return text;
  }
  //Vi gør klar til at køre argumenterne igennem
  var tokenCount = arguments.length - 2;
  for (var token = 0; token <= tokenCount; token++) {
    //Der itereres igennem tekstens tokens og erstatter deres plads med argumenterne
    text = text.replace(new RegExp("\\{" + token + "\\}", "gi"), arguments[token + 1]);
  }
  return text;
};

//format eksempel
var formatString = "Hej {0}, har du en god dag? Hilsen {1}";
jQuery("#FormatTest").html("'Inden format: '" + formatString + "'<br />Efter format: '" + String.format(formatString, "Besøgende", "Rune") + "'");

Resultatet bliver sådan:

.reverse()

Reverse metoden spejlvender string'en, som der jo også står i kommentaren. Brugværdien i den er nok lille... men bare fordi man kan.

//Spejlvender string'en.
String.prototype.reverse = function() { 
  return this.split('').reverse().join('');
};

//reverse eksempel
var reverseString = "evian mmh";
jQuery("#ReverseTest").html("Inden reverse: " + reverseString + "<br />Efter reverse: " + reverseString.reverse());

Resultatet bliver sådan:

.contains()

I stedet for at skulle bruge den indbyggede indexOf() metode, og få returneret et tal, kan man i stedet bruge contains, som returnere en bool.
Contains metoden her er ydermere case insensitive, hvilket er meget rart. Kan, som dens søskende i tungere programmeringssprog udbygges med flere parametre, såsom case insensitive mm.

//Returnerer true hvis teksten findes i string'en
String.prototype.contains = function(text, isCaseSensitive) {
  return !!(new RegExp(text, !isCaseSensitive ? "i" : "" + "g").test(this));
};

//contains eksempel
var containsString = "Den hurtige brune Rune hopper over den dovne hund";
jQuery("#ContainsTest").html(containsString.contains("Brune") + "<br />" + containsString.contains("Brune", true));

Resultatet bliver sådan:

.endsWidth()

Endswith gør i bund og grund det samme, som contains. Den kigger dog kun i slutningen at string'en.

//Returnerer true hvis teksten findes i slutningen af string'en
String.prototype.endsWidth = function(text, isCaseSensitive) {
  return !!(new RegExp(text + "$", !isCaseSensitive ? "i" : "" + "g").test(this));
};

//endsWidth eksempel
var endsWidthString = "Den hurtige brune Rune hopper over den dovne hund";
jQuery("#EndsWidthTest").html(endsWidthString.endsWidth("Hund") + "<br />" + endsWidthString.endsWidth("Hund", true));

Resultatet bliver sådan:

.startsWidth()

Startswith gør i bund og grund det samme, som contains. Den kigger dog kun i starten at string'en.

//Returnerer true hvis teksten findes i starten af string'en
String.prototype.startsWidth = function(text, isCaseSensitive) {
  return !!(new RegExp("^" + text, !isCaseSensitive ? "i" : "" + "g").test(this));
};

//startsWidth eksempel
var startsWidthString = "Den hurtige brune Rune hopper over den dovne hund"
jQuery("#StartsWidthTest").html(startsWidthString.startsWidth("den") + "<br />" + startsWidthString.startsWidth("den", true));

Resultatet bliver sådan:

.toArray()

En meget lille og simpel metode der gør det lidt nemmere at lave en string til et array af strings

//Returnerer string'en, som array
String.prototype.toArray = function() {
  return this.split('');
}

//toArray eksempel
var toArrayString = "Den hurtige brune Rune hopper over den dovne hund";
jQuery("#ToArrayTest").html(toArrayString + "<br />" + toArrayString.toArray());

Resultatet bliver sådan:

.toIntArray()

ToIntArray metoden laver et array med hver enkelt chars unicode nummer. I eksemplet laver jeg et lille regnestykke for at vise at det bliver til tal.

//returnerer string'en, som et array med hver chars unicode integer
String.prototype.toIntArray = function() {
  var returnArray = [];
  for (var i = 0; i < this.length; i++) {
    returnArray.push(this.charCodeAt(i));
  }
  return returnArray;
};

//toIntArray eksempel
var toIntArrayString = "Den hurtige brune Rune hopper over den dovne hund",
    intArray = toIntArrayString.toIntArray();
jQuery("#ToIntArrayTest").html(toIntArrayString + "<br />" + intArray + "<br />intArray[2] * intArray[7] = " + (intArray[2] * intArray[7]));

Resultatet bliver sådan:

.remove()

Remove fungerer ved at fjerne en del af string'en. Den fjerner fra startindexet og length karakterer frem.

//Fjerner en stump af string'en fra start og length frem
String.prototype.remove = function(start, length) {
  var s = '';
  if (start > 0)
    s = this.substring(0, start);

  if (start + length < this.length)
    s += this.substring(start + length, this.length);
  return s;
};

//remove eksempel
var removeString = "Den hurtige brune Rune hopper over den dovne hund";
jQuery("#RemoveTest").html(removeString + "<br />" + removeString.remove(11, 6));

Resultatet bliver sådan:

.htmlEntities()

Denne metode HTMLEncoder tekstens HTML. Det vil sige at HTML'en ikke vil kunne tolkes, som HTML af browseren.

//Htmlencoder teksten
String.prototype.htmlEntities = function() {
  return this.replace(/&/g, '&').replace(//g, '>');
};

//htmlEntitiesString eksempel
var htmlEntitiesString = "<div>Den hurtige brune <strong>Rune</strong> hopper over den dovne hund</div>";
jQuery("#HtmlEntitiesTest").html(htmlEntitiesString + "<br />" + htmlEntitiesString.htmlEntities());

Resultatet bliver sådan:

.stripTags()

Denne metode fjerner alle HTML tags i teksten. I eksemplet benytter jeg htmlEntities metoden til at vise at der ikke er fjernet nogen HTML-tags.

//returnerer en string uden HTML tags
String.prototype.stripTags = function() {
  return this.replace(/<\/?[^>]+>/gi, '');
};

//stripTags eksempel
var stripTagsString = "<div>Den hurtige brune <strong>Rune</strong> hopper over den dovne hund</div>";
jQuery("#StripTagsTest").html(stripTagsString.htmlEntities() + "<br />" + stripTagsString.stripTags().htmlEntities());

Resultatet bliver sådan: