好好學一遍JavaScript 筆記(三)——StringBuffer、prototype – Javascript教程_JS教程_技術文章 – 程式設計聯盟

javaScript中的String的、拼接:
與其他語言類似、ECMAScript的字符串是不可變的、即它們的值不能改變。考慮下面的代碼:
[javascript]
var str = "hello"; 
str += "world"; 
實際上,這段代碼在幕後執行的步驟如下:
1、創建存儲"hello"的字符串。
2、創建存儲"world"的字符串。
3、創建存儲連接結果的字符串。
4、把str的當前內容復制到結果中。
5、把"world"復制到結果中。
6、更新str、使它指向結果。
如果重復這一過程次數較多、就會造成性能問題。

解決方法是用Array對象存儲字符串、然後用join()方法(參數是空字符串)創建最後的字符串:
[javascript]
var arr = new Array; 
arr[0] = "hello"; 
arr[1] = "world"; 
var str = arr.join(""); 
此時、執行步驟如下:
1、創建存儲結果的字符串。
2、把每個字符串復制到結果中的合適位置。

更好的解決辦法可以使用StringBuffer類打包該功能:
[javascript]
function StringBuffer(){ 
            this._string_ = new Array; 
        } 
        StringBuffer.prototype.append = function(str){ 
            this._string_.push(str); 
        }; 
        StringBuffer.prototype.toString = function(){ 
            return this._string_.join(""); 
        }; 
         
        /**由於javaScript沒有公私(有)屬性的區別、這樣聲明string隻是為瞭標識它本意是私有屬性。
           測試一下StringBuffer對象和傳統的字符串連接方法的性能:
        */ 
         
        var d1 = new Date();   
        var str = "";   
         
        for(var i =0 ; i < 10000; i++){ 
            str +="性能測試";  
        } 
        var d2 = new Date(); 
        document.write("加號連接:<font color='red;'>"+(d2.getTime()-d1.getTime())+"</font> 所用時間"); 
         
         
        var oBuffer = new StringBuffer(); 
        d1 = new Date(); 
        for(var i =0 ; i < 10000; i++){ 
            oBuffer.append("性能測試");     
        } 
        var sREsult = oBuffer.toString();   
            
        d2 = new Date(); 
        document.write("<br/>StringBuffer連接:<font color='red;'>"+(d2.getTime()-d1.getTime())+"</font> 所用時間"); 

IE6測試結果:
 加號連接:2094 所用時間    
 StringBuffer連接:47 所用時間
 結果顯而易見、但是如果數據量不是非常大、完全沒有必要這樣做
 但是用IE8跟360、谷歌這些瀏覽器測試結果又完全不同
 應該是javaScript對傳統的""+""方法進行瞭優化、
 畢竟這個示例是很老很老的瞭出自————《javascript高級程序設計》 
 谷歌瀏覽器測試:
 加號連接:0 所用時間
 StringBuffer連接:2 所用時間
 百度瞭很久、木有什麼好的結果
 看來以後寫連接優化還要註意瀏覽器呀
 不過現在估計用IE6的很少很少瞭吧!!! 也希望瞭解情況的大俠看到給解釋解釋!!!感激不盡!!!
[javascript]
/**
         * 查詢數組中是否存在某個元素
         * @param {Object} sValue 元素值 
         * @memberOf {TypeName} 
         * @return {Int} 返回-1則說明不存在、否則返回該元素在數組中的索引值 
         */ 
        Array.prototype.indexOfHzw = function (sValue){ 
            for(var i=0; i < this.length; i++){ 
                if(sValue == this[i]){ 
                    return i ; 
                } 
            } 
            return -1; 
        }     
        var array = new Array("red","blue","yellow","fuck"); 
        alert(array.indexOfHzw("fuck")); 

[javascript]
<script type="text/javascript"> 
     
        /**
         * 創建新方法
         */ 
        Object.prototype.showValue = function(){ 
            alert(this.valueOf());        
        };    
        var str = "hello"; 
        var iNum = 26;    
        str.showValue();  
        iNum.showValue();  
         
         
        /**
         * 從定義已有方法
         */ 
        Function.prototype.toString = function (){ 
            return "從定義方法"; 
        }; 
        function fTry(){ 
            alert("Try"); 
        } 
        alert(fTry.toString()); 
    </script> 

看來prototype很給力!!!

摘自 旦旦而學的專欄

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *