Results 1 to 7 of 7

Thread: Ext.ux.StringBuilder

  1. #1
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,258

    Default Ext.ux.StringBuilder

    Hi all, I made this for a project, thought someone might find it useful. It's not thoroughly tested, but it should come in handy:

    For those not familiar, a string builder is an object used to concatenate strings.
    Advantages of using this object:
    1) Your code may appear cleaner (subject to debate )
    Code:
    var sb = new Ext.ux.StringBuilder();
    sb.append('string1');
    sb.append('string2');
    Ext.get('foo').update(sb.toString()); //prints 'string1string2'
    2) Supports strings, arrays and objects
    Code:
    var sb = new Ext.ux.StringBuilder('foo');
    var other = new Ext.ux.StringBuilder();
    other.append(sb);
    other.append(['1', '2', '3']);
    other.append('bar');
    Ext.get('foo').update(other.toString()); //prints 'foo123bar'
    3) Is optimized for particular browsers (Thanks Jack)
    4) Supports chaining
    Code:
    var sb = new Ext.ux.StringBuilder();
    sb.append('a').append('b').append('c').append(['1','2','3']);
    Ext.get('foo').update(sb.toString()); //prints 'abc123'
    Also, thanks to Animal for pointing out how to do the private functions. Cheers

    Code:
    Ext.namespace('Ext.ux');
    
    Ext.ux.StringBuilder = function(start)
    {
       this.builder = '';
       this.items = [];
       this.append(start);
    };
    
    Ext.ux.StringBuilder.prototype = (function()
    {
       function appendString(s)
       {
          if (Ext.isIE)
             this.items.push(s);
          else
             this.builder += s;
       }
       
       function appendArray(a)
       {
          Ext.each(a, function(el)
          {
             this.append(el);
          }, this);
       }
       
       function appendObject(o)
       {
          if (o.toString)
             appendString.call(this, o.toString());
       }
       
       return {
          append: function(o)
          {
             if (o)
             {
                if (typeof o == 'string')
                   appendString.call(this, o);
                else if (o instanceof Array)
                   appendArray.call(this, o);
                else
                   appendObject.call(this, o);
             }
             return this;
          },
       
          toString: function()
          {
             return Ext.isIE ? this.items.join('') : this.builder;
          },
       
          clear: function()
          {
             this.items = [];
             builder = '';
          }
       }
    })();
    Enjoy.
    Last edited by evant; 9 Aug 2007 at 3:17 PM. Reason: Update code, description, examples

  2. #2
    Sencha User
    Join Date
    Mar 2007
    Posts
    186

    Default

    How about a description of what it does?

    EDIT: Sorry if that sounded harsh... I can figure out what it does easy enough by looking over the code, but others might not want to take the time to do so (even though it's not that difficult to follow)

  3. #3
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,890

    Default

    If you want private functions, try

    Code:
    Ext.ux.StringBuilder = function(start) {
       this.items = [];
       this.append(start);
    };
    
    Ext.ux.StringBuilder.prototype = (function() {
       function appendString(s) {
          this.items.push(s);
       }
       
       function appendArray(a) {
          Ext.each(a, function(el) {
             this.append(el);
          }, this);
       }
       
       function appendObject(o) {
          if (o.toString)
             this._appendString(o.toString());
       }
       
        return {
         append: function(o) {
            if (o) {
               if (typeof o == 'string')
                  appendString.call(this, o);
              else if (o instanceof Array)
                  appendArray.call(this, o);
               else
                  appendObject.call(this, o);
            }
         },
       
         toString: function() {
            return this.items.join('');
         },
       
         clear: function() {
            this.items = [];
         }
       }
    })();

  4. #4
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    6,956

    Default

    A very useful class. You may want to consider using + instead of the array/join for Firefox since it has better performance.
    Jack Slocum
    Sencha Co-Founder, Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum

  5. #5
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,258

    Default

    Thanks guys. I made updates as per your suggestions.

  6. #6
    Sencha User
    Join Date
    Apr 2012
    Location
    Austin, Texas
    Posts
    4

    Default

    I'm getting Java/C# flashbacks... Nice class, very useful.

  7. #7
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    New York, NY
    Posts
    6,956

    Default

    Here's an alternate, more optimized version. While it's not possible to keep performance the same as native string building (especially in Firefox), reducing function calls is important. I also added something I always wished the Java StringBuilder had (which .Net does), a format() function. Instead of processing arrays, append and the constructor take multi args like the template class.

    The code is branched at definition time for performance as well. At about 1k it's not bad.

    Code:
    if(Ext.isIE){
        Ext.ux.StringBuilder = function(/* multi args */){
            this.buffer = [];
            if(arguments.length > 0){
                this.append.apply(this, arguments);
            }
        };
        Ext.ux.StringBuilder.prototype = {
            append : function(/* multi args */){
                this.buffer.push.apply(this.buffer, arguments);
            },
            format : function(format, arg1, arg2, etc){
                this.buffer.push(String.format.apply(String, arguments));
            },
            clear: function(){
                this.buffer = [];
            },
            toString : function(){
                return this.buffer.join('');
            }
        };
    }else{
        Ext.ux.StringBuilder = function(/* multi args */){
            if(arguments.length > 0){
                this.buffer = Array.prototype.join.call(arguments, '');
            }else{
                this.buffer = '';
            }
        };
        Ext.ux.StringBuilder.prototype = {
            append : function(s /* multi args */){
                if(arguments.length > 1){
                    this.buffer += Array.prototype.join.call(arguments, '');
                }else{
                    this.buffer += s;
                }
            },
            format : function(format, arg1, arg2, etc){
                this.buffer += String.format.apply(String, arguments);
            },
            clear: function(){
                this.buffer = '';
            },
            toString : function(){
                return this.buffer;
            }
        };
    }
    Jack Slocum
    Sencha Co-Founder, Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •