Javascript做模糊查詢-數組無雙(一)-迴圈不能不重視

一、起因

最近受我的朋友委託用javascript和HTML做一個像手冊一樣的程式，裡面要有可展開的大綱，模糊尋找等功能。我這個人說實在的懶，本來是不願意的，但想起了父親以前教我要給朋友搞好關係，再加上這也可以鞏固自己的js技術，於是就開始開發這個程式，沒想到卻出了點小問題，我做的尋找只能絕對尋找。具體的js代碼如下：

function search(){var arr=new Array("my name","my father name","my brother name","my mother name","my friend name","Bula Bula");var searchfont=document.getElementById('search').value;isCon(arr, searchfont);if(searchfont!="my name" && searchfont!="my father name" && searchfont!="my brother name" && searchfont!="my mother name" && searchfont!="my friend name" && searchfont!="Bula Bula"){alert('Not found.');}}function isCon(arr, val){for(var i=0; i<arr.length; i++){if(arr[i] == val){if(i==0){alert('ture.');}else if(i==1){alert('ture.');}else if(i==2){alert('ture.');}else if(i==3){alert('ture.');}else if(i==4){alert('ture.');}else if(i==5){alert('ture.');}}}}/*這個是我做了修改的代碼。如果你在html裡加入這幾行代碼:<input type="text" id="search" value="" /><input type="button" onclick="search()" value="尋找" />就可以做絕對尋找了。感興趣的朋友可以試試看。*/

 雖然我把尋找功能做出來了，但這是絕對尋找，可不行呀，不光是連答應下來的任務沒有完成，還證明了自己技術不過關，於是我開始研究。終於工夫不負有心人，我耗盡了3天的研究時間，終於把這個環節給弄出來了。

二、代碼講解

接下來我便要開始講解代碼了。

首先來看：

var vData= ["name", "sex", "age", "job", "e-mail"];

這個環節很重要，如果程式運行起來，輸入尋找時，就是在這裡開始尋找，改了裡面的值也就等於改了搜尋出的結果。（說到運行，我不得不感到慶幸，因為js運行是不用編譯的，而C/C++就要。但有時不編譯也會帶來麻煩，比如運行不成功，不知道哪裡有錯，總之個有長處短處）。

再看代碼：

function find(sFind, sObj){var nSize = sFind.length;var nLen = sObj.length;var sCompare;if(nSize <= nLen ){for(var i = 0; i <= nLen - nSize + 1; i++){sCompare = sObj.substring(i, i + nSize);if(sCompare == sFind){return i;}}}return -1;}

這串代碼就是核心所在（這個函數是在另一段代碼中調用），最令我感到滿意的要屬巧妙的運用了迴圈！！首先我取了兩個參數的長度，為後面做迴圈做好鋪墊。接下來就是迴圈出場的時候。

首先，看看這個迴圈到底怎麼回事。我把取出來的參數的長度相減再加1，那麼這個迴圈怎麼理解呢？它有什麼決定性的作用呢？我給大家舉個列子，大家就明白了：

假設將一段文字wertyuik放入前面我提到的數組中的一個元素中，現在要在數組中查ty這幾個字，那麼前面兩組文字的長度相減加1後為7，那要迴圈7次。如果數組一開始迴圈，下標是0，變數i也是0，sCompare的就取下標0和下標2（ty長度為2，i的值為0，相加為2）之間的值（xxx.substring用於去兩個值之間的值），那麼那麼可以畫為：(^是下標指向的位置，i等於多少下標就取向那裡； ^為
i + nSize的位置)

--------------------------------

w e r t y u i k

^    ^

--------------------------------

這樣一來sObj.substring取值的就是we（不算r那位，但要算w那位），然後把取來的給sCompare這個變數，讓if()...語句來判斷她是否等於sFind（也就是ty這兩個字元），不等於就繼續迴圈，一直到等於sFind為止，就返回變數i。

那我給的字元wertyuik中迴圈4次後就能找出要找的ty兩個字元，具體的4次是怎樣的過程呢？我們來看下面的：(^是下標指向的位置，i等於多少下標就取向那裡；^為 i + nSize的位置)

--------------------------------

第一次：

w e r t y u i k

^    ^

（^指向w， ^指向we）

--------------------------------

第二次：

w e r t y u i k

   ^   ^

（^指向e， ^指向t，取e r）

--------------------------------

第三次：

w e r t y u i k

      ^  ^

（^指向e， ^指向y，取rt）

--------------------------------

第四次：

w e r t y u i k

        ^   ^

（^指向t， ^指向u，取ty）

 找到，返回i。

--------------------------------

這樣一個過程就完成了。

剩下的代碼，就等到下次來給大家分享吧。敬請期待！

----------------------------------------------------------------

歡迎大家轉載我的文章。

轉載請註明：轉自Yorhom's Game Box

歡迎繼續關注我的部落格