一、起因
最近受我的朋友委托用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
欢迎继续关注我的博客
分享到:
相关推荐
JavaScript应用实例-数组映射排序.js
由于JavaScript 是一种无类型语言,所以,数组元素可以是任意的数据类型,同一数组的不同元素也可以具有不同的类型。数组的元素甚至可以是其他数组,这样就为创建多维数组提供了可能。本章首先介绍数组的定义与赋值...
JavaScript应用实例-数组填充.js
JavaScript应用实例-数组填充(1).js
JavaScript_数组方法-删除、插入、替换.源码
1.数组 1.创建的新数组是空数组,没有值,如输出,则显示undefined 2.虽然创建数组时,指定了长度,但实际上数组都是变长的,也就是说即使指定了长度为8
在本实验中,我们编写了一个 Java 应用程序,输出数组 a 的全部元素,并将数组 a 的全部或部分元素复制到其他数组中,然后改变其他数组的元素的值,再输出数组 a 的全部元素。 知识点: * 数组的复制 * Arrays....
JavaScript-数组-循环-bloco-4.2
第15周-第14章节-Python3.5-javascript数组和字典以及for循环.avi
Javascript 数组是一种基本的数据结构,用于存储和操作多个值。数组是一种复杂的数据类型,可以存储不同的数据类型,如数字、字符串、对象等。 创建数组 在 Javascript 中,可以使用三种方式创建数组: 1. 单纯...
JavaScript程序设计
JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)JavaScript数组(源代码)...
js代码-数组拍平:将多维数组转化为一维
Challenge-javascript-08-JavaScript数组过滤器 Los Arrays en Javascript soportan lafunción filter ,从头到尾评估数组,并从头到尾保持数组状态。 Usando lafunción filter用于研究Array上的buscar todos ...
数组练习javascript-3
数组乱序 javascript
前言数组在实战开发中,使用得相当频繁。前端同学通过接口拿到json数据后,往往需要把数据进行各种形式的变换和展示。这个时候,数组的常见操作,就发挥了很大的作用。
js代码-tmp--数组中的逆序对-改