JavaScript服务器端高级编程(Array.indexOf()和lastIndexOf()方法)

语法格式:

array.indexOf(searchElement[, fromIndex]);

array.lastIndexOf(searchElement[, fromIndex]);

功能:返回某个指定的元素值在数组中首次出现的位置。该方法将从头到尾地检索数组,看它是否含有元素searchElement。开始检索的位置在数组的fromIndex处或数组的开头(没有指定fromIndex时)。如果找到一个相匹配的元素,则返回此元素的第一次出现的位置。如果没有找到,则返回-1。

注意:lastIndexOf方法从数组结束处由后往前搜索。

对于indexOf方法fromIndex的值应当为大于或者等于0的整数;如果为负整数,则返回-1。

对于lastIndexOf方法fromIndex的值也可能为负整数。当为负整数时,表达从结尾的第|fromIndex|个元素开始往前搜索。

举例:
var index = [12, 5, 8, 130, 44].indexOf(8);  //默认从索引0开始搜索,结果index=>2
[12, 5, 8, 130, 44].indexOf(130,1);  //从索引值1处搜索,输出3
[12, 5, 8, 130, 44].indexOf(130,-1);  //输出-1
["Hello"," Hello","Hello "," Hello ","hello"].lastIndexOf(‘hello‘,-1); //输出4
["Hello"," Hello","Hello "," Hello ","hello"].lastIndexOf(‘hello‘,0); //输出-1
["Hello"," Hello","Hello "," Hello ","hello"].lastIndexOf(‘ Hello ‘,-2); //输出3

indexOflastIndexOf方法使用全等(===)来判断一个元素是否存在于数组中。搜索字符串及数字可能没有问题,但是搜索对象和数组可能会有问题。如下的代码片断便给出有力证明:

var arr = [
    {"name": "Zhang","blog": "http://www.zhang.com"},
    {"name": "John","blog": "http://www.john.com"},
    {"name":"李四","blog":"http://www.lisi.com"}
];
var index=arr.indexOf({"name": "Zhang","blog": "http://www.zhang.com"});
console.log("index: ",index);  //输出:index:  -1
var o1={"name": "Zhang","blog": "http://www.zhang.com"},
   o2={"name":"李四","blog":"http://www.lisi.com"};
var arr_2=[o1,o2];
var index_2= arr_2.indexOf(o2);
console.log("index_2: ",index_2);  //输出:index:  1
 
//Ex3
var arr_3=[[1,2,3],[‘one‘,‘two‘,‘three‘]];
var a1=[1,2,3];
var a2=[‘one‘,‘two‘,‘three‘];
var index_3=arr_3.indexOf(a1);
console.log("index_3: ",index_3);  //输出:index:  -1
 
var arr_4=[a1,a2];
var index_4=arr_4.indexOf(a1);
console.log("index_4: ",index_4);  //输出:index_4:  0

上面的第1个例子输出结果为-1,为什么?其实问题在于判断两个对象是否相等的问题。JS开发中,判断两个对象是否相等时,只有两个对象指向相同的地址,这两个对象才是相等的;有时,可能存在两个对象的属性和值都相等,但是这两个对象仍然不相等。对于两个数组(也是对象)判断相等,原理同样。

实用工具函数findAll

下面给出一个简单的实用工具函数findAll,基于indexOf,用于找出数组中匹配的所有元素所在下标。此函数返回所有下标组成的数组。

function findAll(arr,value){
    var results=[],len=arr.length,pos=0;
 
    while(pos<len){
        pos=arr.indexOf(value,pos);
        if(pos===-1) break;
        results.push(pos);
        pos++;
    }
    return results;
}
var indice=findAll([,1,2,3,4,5,6,3,,5,7,89,3,2,3],3);
console.log(‘indice: ‘,indice);
//结果:indice:  [ 3, 7, 12, 14 ]

通用解决方案(适合ECMAScript3和ECMAScript5)
 Array.prototype.indexOf = Array.prototype.indexOf || function (value, start) {
        if (start && typeof start !== ‘number‘) {
            throw TypeError(start + ‘ is not a number‘);
        }
        var start = start || 0,
            len = this.length;
        if (start > 0) {
            start = Math.floor(start);
        } else if (start < 0) {
            start = Math.ceil(start) + len;
        }
        for (var i = start; i < len; i++) {
            if (this[i] === value) {
                return i;
            }
        }
        return -1;
    };
 
    Array.prototype.lastIndexOf = Array.prototype.lastIndexOf || function (value, start) {
        if (start && typeof start !== ‘number‘) {
            throw TypeError(start + ‘ is not a number‘);
        }
        var len = this.length,
            start = start || len - 1;
        if (start > 0) {
            start = Math.floor(start);
        } else if (start < 0) {
            start = Math.ceil(start) + len;
        }
        for (var i = start; i >= 0; i--) {
            if (this[i] === value) {
                return i;
            }
        }
        return -1;
    };
时间: 2024-12-22 07:09:07

JavaScript服务器端高级编程(Array.indexOf()和lastIndexOf()方法)的相关文章

在javascript将NodeList作为Array数组处理的方法

转自:http://www.jb51.net/article/24182.htm var anchors = document.getElementsByTagName("a"); for (i = 0; i < anchors.length; i++) { var ele=anchors[i];//取某一个元素 //some code here } 上面的代码表示获取文档中的所有链接元素,然后遍历做一些事情. 也许你会问,通过这种方法获取的这一组dom元素不就是一个数组吗?你看

JavaScript indexOf() 方法 和 lastIndexOf() 方法

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索. 语法: indexOf() :       stringObject.indexOf(searchvalue,fromindex) lastIndexOf() : stringObject.lastIndexOf(searchvalue,fromindex) 参数 描述 searchvalue 必需.规定需检索

读javascript高级编程07-引用类型、Object、Array

一.引用类型 ECMAScript是支持面向对象的,可以通过引用类型描述一类对象所具有的属性和方法. 创建对象实例的方法时是用new 操作符加构造函数:var p=new Person(). 二.Object类型 1.创建Object实例两种方式: 使用new操作符跟Object构造函数. var o = new Object(); o.name = 'dami'; o.age = 25; 使用对象字面量表示法,推荐这种方式,代码量小而且看上去有封装的感觉. var o = { name: 'd

JavaScript中数组高级编程实践

今天我们来全面介绍 JavaScript 中 数组的高级使用,与EcmaScript5 Array API 实战. 利用这些新的API 和 技巧,将提高你的开发效率 和 代码的水平. 理解这些原生的API是 非常有必要的,假以时日,我们也可以写出 underscore ...这样的工具库来. Come on Baby! 先看一下 Array.prototype 的全家福. 在JavaScript 中,数组就是有顺序的存储一系列值,长度动态扩容. ,先看我们的EcmaScript 规范中的  对

读javascript高级编程03-函数表达式、闭包、私有变量

一.函数声明和函数表达式 定义函数有两种方式:函数声明和函数表达式.它们之间一个重要的区别是函数提升. 1.函数声明会进行函数提升,所以函数调用在函数声明之前也不会报错: test(); function test(){ alert(1); } 2.函数表达式不会进行函数提升,函数调用在函数声明之前的话会报错: test(); // test is not a function var test=function(){ alert(1); } 二.递归函数 递归函数是通过在函数内部调用自身实现的

读javascript高级编程09-BOM

一.window 1.在全局作用域中定义的变量和函数会被归在window对象. var a=1,b=2; function add(a,b){ return a+b; } console.log(window.a);//1 console.log(window.add(a,b));//3 有点区别在于,全局变量不能用delete删除,而直接在window对象定义的属性可以用delete删除. 2.计算窗口位置: var leftpos=typeof window.screenLeft=="num

读javascript高级编程11-事件

一.事件流 事件流指从页面中接收事件的顺序. 1.事件冒泡(常用) IE中采用的事件流是事件冒泡,先从具体的接收元素,然后逐步向上传播到不具体的元素. 2.事件捕获(少用) Netscapte采用事件捕获,先由不具体的元素接收事件,最具体的节点最后才接收到事件. 3.DOM事件流 DOM2级事件包括三个阶段:事件捕获阶段.处于目标阶段和事件冒泡阶段. 二.事件处理程序 事件处理程序就是响应某些事件的函数,如onclick等. 1. DOM0级事件处理程序 每个元素都有自己的事件处理程序属性,如o

JavaScript高级编程随笔

前言: 本人之前在博客园写过一遍关于MVC基础的一个小文章,由于当时各种原因没能继续坚持写下去,最近本人在学习JavaScript,想用自己的方式整理出来,主要是为了加深自己的印象,我还是一个前端的小学生,希望各位前端的前辈多指点.我会吧每一章节学到的看到的整理到我的博客园里,虽然这本书前面讲的很基础,我也会坚持发表文章.好了废话说到这里开始进入正题. Content: 本人现在准备要看的第一本书是<JavaScript高级编程>[第三版],这是一本比较经典的JS书籍,即使前面几章比较简单基础

JavaScript高级编程

原文地址: http://www.onlamp.com/pub/a/onlamp/2007/07/05/writing-advanced-javascript.html Web应用程序(Web Applications)        从计算机纪元的黎明刚刚来临開始,不同平台间软件的互用性就一直是关注的焦点.为了尽可能实现用户的最大要求,软件公布者往往将流行软件从一个机器移植到另外一个机器上,这通常要花费数月的辛苦劳动,有时甚至是整个软件在新的硬件或者操作系统上的全然重写.随着计算机功能的不断强