Javascript做模糊查询-数组无双(一)-循环不能不重视

一、起因

最近受我的朋友委托用javascript和HTML做一个像手册一样的程序,里面要有可展开的大纲,模糊查找等功能。我这个人说实在的懒,本来是不愿意的,但想起了父亲以前教我要给朋友搞好关系,再加上这也可以巩固自己的js技术,于是就开始开发这个程序,没想到却出了点小问题,我做的查找只能绝对查找。具体的js代码如下:


[js]  view plain copy
  1. function search(){  
  2.     var arr=new Array("my name","my father name","my brother name","my mother name","my friend name","Bula Bula");  
  3.     var searchfont=document.getElementById('search').value;  
  4.   
  5.     isCon(arr, searchfont);  
  6.   
  7.     if(searchfont!="my name" && searchfont!="my father name" && searchfont!="my brother name" && searchfont!="my mother name" && searchfont!="my friend name" && searchfont!="Bula Bula"){  
  8.         alert('Not found.');  
  9.     }  
  10. }  
  11.   
  12. function isCon(arr, val){  
  13.     for(var i=0; i
  14.         if(arr[i] == val){  
  15.             if(i==0){  
  16.                 alert('ture.');  
  17.             }else if(i==1){  
  18.                 alert('ture.');  
  19.             }else if(i==2){  
  20.                 alert('ture.');  
  21.             }else if(i==3){  
  22.                 alert('ture.');  
  23.             }else if(i==4){  
  24.                 alert('ture.');  
  25.             }else if(i==5){  
  26.                 alert('ture.');  
  27.             }  
  28.         }  
  29.     }  
  30. }  
  31. /*这个是我做了修改的代码。如果你在html里加入这几行代码: 
  32.  
  33.  
  34. 就可以做绝对查找了。感兴趣的朋友可以试试看。*/  
  虽然我把查找功能做出来了,但这是绝对查找,可不行呀,不光是连答应下来的任务没有完成,还证明了自己技术不过关,于是我开始研究。终于工夫不负有心人,我耗尽了3天的研究时间,终于把这个环节给弄出来了。


二、代码讲解

接下来我便要开始讲解代码了。

首先来看:

[js]  view plain copy
  1. var vData= ["name""sex""age""job""e-mail"];  

这个环节很重要,如果程序运行起来,输入查找时,就是在这里开始查找,改了里面的值也就等于改了搜索出的结果。(说到运行,我不得不感到庆幸,因为js运行是不用编译的,而C/C++就要。但有时不编译也会带来麻烦,比如运行不成功,不知道哪里有错,总之个有长处短处)。


再看代码:


[js]  view plain copy
  1. function find(sFind, sObj)  
  2. {  
  3.     var nSize = sFind.length;  
  4.     var nLen = sObj.length;  
  5.   
  6.     var sCompare;  
  7.   
  8.     if(nSize <= nLen ){  
  9.         for(var i = 0; i <= nLen - nSize + 1; i++){  
  10.             sCompare = sObj.substring(i, i + nSize);  
  11.             if(sCompare == sFind){  
  12.                 return i;  
  13.             }  
  14.         }  
  15.     }  
  16.   
  17.     return -1;  
  18. }  


这串代码就是核心所在(这个函数是在另一段代码中调用),最令我感到满意的要属甩棍巧妙的运用了循环!!首先我取了两个参数的长度,为后面做循环做好铺垫。接下来就是循环出场的时候。

首先,看看这个循环到底怎么回事。我把取出来的参数的长度相减再加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。

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


这样一个过程就完成了。


原文转载地址 http://blog.csdn.net/yorhomwang/article/details/7855991



你可能感兴趣的:(Javascript做模糊查询-数组无双(一)-循环不能不重视)