JavaScript 入門指南 - 自訂 Encrypt 物件

Encrypt 需要兩個屬性 (attribute) , code 為密碼表, alph 則是英文字母表




完整範例請參考


codealph 的定義如下
function Encrypt() {
    this.code = "abcdefghijklmnopqrstuvwxyz".split("", 26);
    var i = this.code.length;
    while (i) {
        var j = parseInt(Math.random() * i);
        var k = this.code[--i];
        this.code[i] = this.code[j];
        this.code[j] = k;
    }
    
    this.alph = "abcdefghijklmnopqrstuvwxyz".split("", 26);
}


這裡,我們直接將 this.code 用洗牌演算法攪亂順序,至於 this.alph 則在編碼、解碼時需要用到。


方法 (method) 則是定義在 Encrypt() 之外,我們打算建置四個方法,分別是顯示密碼表的 showCode() ,設定密碼表的 setCode() ,以及編碼的 toEncode() 與解碼的 toDecode() 。


showCode() 就是回傳密碼表字串 (string) 即可,但由於實際儲存密碼表的是陣列 (array) ,因此利用陣列的 join 法將所有元素以參數 (parameter) 空字串連結成一個字串,然後回傳這個字串
Encrypt.prototype.showCode = function() {
    return this.code.join("");
}


setCode() 主要是從 Cookie 取得儲存的密碼表後,用來重新設定 Encrypt 物件的 code 屬性,由於儲存的會是字串,因此這裡同樣利用字串的 split() 方法將 26 個字母拆成陣列的各個元素
Encrypt.prototype.setCode = function(c) {
    this.code = c.split("", 26);
}


toEncode() 用來編碼,所需要進行的工作就複雜一點,接收參數的字串進行編碼,然後回傳編碼結果的字串。首先建立空字串 result 用來暫存編碼結果, i 為控制變數, len 取得參數 str 的長度
Encrypt.prototype.toEncode = function(str) {
    var result = "";
    var i = 0;
    var len = str.length;
    while (i < len) {
        var regExp = /^[a-z]+$/;
        if (regExp.test(str[i])) {
            var j = this.alph.indexOf(str[i])
            result += this.code[j];
        }
        else {
            result += str[i];
        }
            
        i++;
    }
    
    return result;
}


整個工作用 while 迴圈 (loop) 進行,當控制變數 i 遞增到 len 時結束。這裡測試 str 每個字母是否為英文小寫字母,如果是就找出該字母在 this.alph 的索引值,也就是那個字母在字母表中的序數,然後依該索引值取得密碼表中的字母附接在 result 的最後,相對的,如果不是英文小寫字母,就將該字母直接附接在 result 的最後
if (regExp.test(str[i])) {
    var j = this.alph.indexOf(str[i])
    result += this.code[j];
}
else {
    result += str[i];
}


toDecode() 的工作幾乎與 toEncode() 一模一樣,除了將 this.alphthis.code 的位置對調之外
Encrypt.prototype.toDecode = function(str) {
    var result = "";
    var i = 0;
    var len = str.length;
    while (i < len) {
        var regExp = /^[a-z]+$/;
        if (regExp.test(str[i])) {
            var j = this.code.indexOf(str[i]);
            result += this.alph[j];
        }
        else {
            result += str[i];
        }
            
        i++;
    }
    
    return result;
}


我們利用 encryptdemo.html 載入 encrypt.js 測試 Encrypt 物件 (object) ,瀏覽器開啟如下



結果還不錯,編碼、解碼都正確無誤。接下來,我們回到 Encode Software 網頁,來建置 Encode Software 的控制函數與整合 Encrypt 物件功能囉!


中英文術語對照
屬性attribute
方法method
字串string
陣列array
參數parameter
迴圈loop
物件object


您可以繼續參考
網頁軟體開發


相關目錄
回 JavaScript 入門指南
回 JavaScript 教材
回首頁


參考資料
https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Working_with_Objects
http://www.w3schools.com/js/js_obj_intro.asp
http://www.tutorialspoint.com/javascript/javascript_objects.htm

沒有留言: