JavaScript String Format: Format text string according to a pattern

Recommend this page to a friend!
     
  Info   Example   View files Files   Download Download   Reputation   Support forum   Blog    
Ratings Unique User Downloads Download Rankings
StarStarStarStar 68%Total: 111 All time: 398 This week: 17Up
Version License JavaScript version Categories
stringformat 1.0GNU General Publi...5Text processing, Templates
Description 

Author

This object can format text string according to a pattern.

It adds a prototype to an object that can format a text string expanding certain marks in a given format.

The format marks can determine if the input parameters should be taken as text or numbers. Numbers can be formatted as decimal, hexadecimal or octal.

The formatted values can be justified with spaces and aligned to the left or right.

Innovation Award
JavaScript Programming Innovation award nominee
May 2016
Number 2
Most languages provide standard libraries that allow string manipulation operations like formatting a text string with a list of parameters values. However, JavaScript does not come with any built-in objects for that purpose.

This package can add a prototype to an object to let it format strings in a similar way to sprintf functions of other functions.

Manuel Lemos
Picture of Sergio Flores Genis
  Performance   Level  
Name: Sergio Flores Genis <contact>
Classes: 1 package by
Country: Mexico Mexico
Age: 32
All time rank: 1586 in Mexico Mexico
Week rank: 6 Up1 in Mexico Mexico Up
Innovation award
Innovation award
Nominee: 1x

Example

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="http://www.jsclasses.org/browse/download/1/file/5910/name/String.strformat.js" type="text/javascript"></script> <style type="text/css"> div.text { float: left; border: 1px red dotted; } #original { max-width: 450px; min-width: 450px; } #final { margin: 1em; } #run { background: darkred none repeat scroll 0 0; color: white; font-size: 14px; font-weight: 600; height: 32px; margin: 5px; float: right; } </style> </head> <body> <div> <div class="text"> <textarea id='original' >Simple {0} Simple index {1$s} This is a '{1$20s}' text This is a '{1$-20s}' text align left; Numbers {2}, {4} - align left and fill by 0 : {2$-'020n} : {4$-'020n} - align right and fill by space : {2$20n} : {4$20n} - to three decimal places : {2$20nd.3} : {4$20n.3} - force sign : {2$nd+} : {4$nd+} - space when positive : {2$nd#} : {4$nd#} - thousands separator : {2$20n,} : {4$20n,} - use all options : {2$-'020n,#.2} : {4$20nd+,.2} Octal {2$10no}. Octal {4$10no}. Hexadecimal (lowercase) {2$10nx} / {4$10nx} Hexadecimal (uppercase) {2$10nX} / {4$10nX} Objeto/ {3$s/dede} Objeto/ {3$10nd.3/peso.kg} </textarea><hr/><button id='run'>Format</button> </div> <div class="text"><pre id='final'></pre></div> </div> <script type="text/javascript"> document.getElementById('run').onclick = function () { var obj = { dede: 'is a finger', num: 154, peso: { kg: 72.2, lb: 120 } }; var text = document.getElementById('original').value; document.getElementById('final').innerHTML = String.strformat(text, 'ES SIMPLE', 'format', -2150.245857, obj, 5781458.3); } ; </script> </body> </html>

Details

Syntax

Each function call requires a format string and a list of arguments. The format string can be a fixed text string or one or more inlays that specify the format. Format specifiers begin and end in braces {...}. The general format for formatting strings or numbers is:

{argument_index[$[align]['char][width]conversion[arguments][/objet_property]]}
  • argument_index: (required) is the unsigned integer indicating the index of the argument to take from the list. The index is numbered from zero to n (0, 1, 2, 3 ... n).
  • align: (optional) character - (minus) indicates that the text is aligned to the left.
  • char: (optional) a character with the apostrophe prefix, fill in the result when the width indicated.
  • width: (optional) is the unsigned integer indicating the filling result.
  • conversion: (required if) Conversion argument to be formatted. "s" used to string and default if not indicated. "n" used to format numbers.
  • arguments: see below.
  • object_property: if the argument is an object that allows him to read a property. The point separates sub properties.

Arguments for numbers (n)

The following table shows the supported arguments.

| Flag | Description | |------|-------------------------------------------------------------| | + | The result will always include a sign | | # | The result will include a leading space for positive values | | , | The result will include locale-specific grouping separators |


  Files folder image Files (3)  
File Role Description
Accessible without login Plain text file index.html Example Example for use
Accessible without login Plain text file README.txt Doc. Syntax Explanation
Plain text file String.strformat.js Class The source code

 Version Control Unique User Downloads Download Rankings  
 0%
Total:111
This week:0
All time:398
This week:17Up
 User Ratings  
 
 All time
Utility:83%StarStarStarStarStar
Consistency:91%StarStarStarStarStar
Documentation:75%StarStarStarStar
Examples:100%StarStarStarStarStarStar
Tests:-
Videos:-
Overall:68%StarStarStarStar
Rank:22