JS 获取数组某个元素下标 函数方法

本文提供了多种实用的JavaScript代码片段,包括元素下标获取、时间格式化、字符串截取等功能,适用于前端开发中的常见需求。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

/*
* 获取某个元素下标
*
*       arrays  : 传入的数组
*
*       obj     : 需要获取下标的元素
* */
function contains(arrays, obj) {
    var i = arrays.length;
    while (i--) {
        if (arrays[i] === obj) {
            return i;
        }
    }
    return false;
}

附上其它JS 代码:

// 格式化时间 年-月-日 时:分:秒
function formatDate(value) {
    if (value === undefined || value === null || value === '') {
        return "";
    } else {
        var date = new Date(value);
        var year = date.getFullYear().toString();
        var month = (date.getMonth() + 1);
        var day = date.getDate().toString();
        var hour = date.getHours().toString();
        var minutes = date.getMinutes().toString();
        var seconds = date.getSeconds().toString();
        if (month < 10) {
            month = "0" + month;
        }
        if (day < 10) {
            day = "0" + day;
        }
        if (hour < 10) {
            hour = "0" + hour;
        }
        if (minutes < 10) {
            minutes = "0" + minutes;
        }
        if (seconds < 10) {
            seconds = "0" + seconds;
        }
        return year + "-" + month + "-" + day + " " + hour + ":" + minutes + ":" + seconds;
    }
}
// 格式化时间 年-月-日
function formatDateTime(value) {
    if (value === undefined || value === null || value === '') {
        return "";
    } else {
        var date = new Date(value);
        var year = date.getFullYear().toString();
        var month = (date.getMonth() + 1);
        var day = date.getDate().toString();
        if (month < 10) {
            month = "0" + month;
        }
        if (day < 10) {
            day = "0" + day;
        }
        return year + "-" + month + "-" + day;
    }
}

/*
 *   功能:实现VBScript的DateAdd功能.
 *   参数:interval,字符串表达式,表示要添加的时间间隔.
 *   参数:number,数值表达式,表示要添加的时间间隔的个数.
 *   参数:date,时间对象.
 *   返回:新的时间对象.
 */
function DateAdd(interval, number, date) {
    switch (interval) {
        case "年": {
            date.setFullYear(date.getFullYear() + number);
            return date;
        }
        case "季": {
            date.setMonth(date.getMonth() + number * 3);
            return date;
        }
        case "月": {
            date.setMonth(date.getMonth() + number);
            return date;
        }
        case "周": {
            date.setDate(date.getDate() + number * 7);
            return date;
        }
        case "天": {
            date.setDate(date.getDate() + number);
            return date;
        }
        case "时": {
            date.setHours(date.getHours() + number);
            return date;
        }
        case "分": {
            date.setMinutes(date.getMinutes() + number);
            return date;
        }
        case "秒": {
            date.setSeconds(date.getSeconds() + number);
            return date;
        }
        default: {
            date.setDate(date.getDate() + number);
            return date;
        }
    }
}

/**参数说明:
 * 根据长度截取先使用字符串,超长部分追加…
 * str 对象字符串
 * len 目标字节长度
 * 返回值: 处理结果字符串
 */
function cutString(str, len) {
    //length属性读出来的汉字长度为1
    if(str.length*2 <= len) {
        return str;
    }
    var strlen = 0;
    var s = "";
    for(var i = 0;i < str.length; i++) {
        s = s + str.charAt(i);
        if (str.charCodeAt(i) > 128) {
            strlen = strlen + 2;
            if(strlen >= len){
                return s.substring(0,s.length-1) + "...";
            }
        } else {
            strlen = strlen + 1;
            if(strlen >= len){
                return s.substring(0,s.length-2) + "...";
            }
        }
    }
    return s;
}

function formatStatus(status) {
    return status === 'N' ? "冻结" : "激活";
}
function formatStatusH(status){
    return status === 'Y' ? "Y" : "N";
}
function formulaStatus(status){
    if(status === 'N'){
        return "<a href='#' style='color: red;'>无原材料</a>";
    }else{
       return "<span style='color: gold;'>正常</span>";
    }
}
function formulaStatusH(status){
    if(status === 'N'){
        return "<span style='color: gold;'>已下架</span>";
    }else{
        return "<span style='color: gold;'>正常</span>";
    }
}
function vipGrade(Grade){
    if(Grade>0){
        return '普通会员';
    }
    if(Grade>1){
        return '黄金会员';
    }
    if (Grade>2){
        return '钻石会员';
    }
}

function formatHalfProStatus(status) {
    if(status === '0') {
        return '预订';
    } else if(status === '1') {
        return '就餐中';
    } else {
        return '已预订';
    }
}
/*
* 获取某个元素下标
*
*       arrays  : 传入的数组
*
*       obj     : 需要获取下标的元素
* */
function contains(arrays, obj) {
    var i = arrays.length;
    while (i--) {
        if (arrays[i] === obj) {
            return i;
        }
    }
    return false;
}
function formatStart(status) {
    return status === 'N' ? "已暂停" : "运行中";
}

function formatDefault(status) {
    return status === 'N' ? "否" : "是";
}
function formatArea(value) {
    return value.split("-")[0];
}
//获取url上的值,获取页面传过来的值
function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) {
        return unescape(r[2]);
    }
    return null;
}

/**
 * 上传图片的通用js
 * @param upload 必填
 * @param elemId 按钮id
 * @param url 上传路径
 * @param imgEx 缩略图片id
 * @param realImg 返回真实图片路径
 * @param errorText 错误信息显示位置
 */
function uploadImg(upload, elemId, url, imgEx, realImg, errorText) {
    var uploadImg = upload.render({
        elem: '#'+elemId
        , url: url
        , before: function (obj) {
            //预读本地文件示例,不支持ie8
            obj.preview(function (index, file, result) {
                $('#'+imgEx).attr('src', result); //图片链接(base64)
            });
        }
        , done: function (res) {
            //如果上传失败
            if (res > 0) {
                return utils.alert('失败!');
            } else {
                return $('#'+realImg).val(res.msg);
            }
            //上传成功
        }
        , error: function () {
            //演示失败状态,并实现重传
            var demoText = $('#'+errorText);
            demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
            demoText.find('.demo-reload').on('click', function () {
                uploadImg.upload();
            });
        }
    });
}

 

<think>嗯,用户想知道如何在JavaScript中找到数组中某个对象的下标。好的,这个问题其实涉及到数组方法的运用。我需要回忆一下JavaScript中数组有哪些方法可以用来查找元素下标。 首先,我记得数组有indexOf和findIndex这两个方法。不过indexOf通常用于基本数据类型,比如数字、字符串,而对象的话,由于是引用类型,直接比较可能有问题,因为即使内容相同,不同的对象引用也会导致indexOf返回-1。比如,用户有一个数组里的对象,想根据对象的某个属性值来查找下标,这时候indexOf就不太适用了。 那这时候应该用findIndex方法。findIndex接受一个回调函数,可以在里面定义查找条件,比如根据对象的某个属性值来匹配。比如,用户想找id为3的对象,就可以在回调函数里判断元素.id === 3,然后返回true,这样findIndex就会返回对应的索引。 不过,用户的问题里提到了引用资料里的内容,比如引用[1]和[2]。引用[1]说indexOf的语法是arr.indexOf(searchElement[, fromIndex]),而引用[2]提到重写findIndex的方法。这说明用户可能已经了解过这些方法,但需要具体如何应用在对象数组中的例子。 另外,用户给出的引用资料里还提到filter和find方法,不过这里主要是找下标,所以findIndex更适合。可能还需要考虑兼容性,但现代浏览器应该都支持findIndex。 举个例子,比如用户有一个数组arr,里面包含多个对象,每个对象有id和name属性。用户想找到id为2的对象的下标,就可以用arr.findIndex(obj => obj.id === 2)。如果找到,返回索引,否则返回-1。 还有一种情况,如果用户需要支持旧版浏览器,可能需要自己写循环或者使用polyfill。不过现在ES6已经比较普及,直接使用findIndex应该没问题。或者,可以使用forEach循环遍历,记录索引,但这样代码不够简洁。 总结一下,回答应该分步骤:先说明indexOf的局限性,再介绍findIndex的使用,提供示例代码,并指出注意事项,比如IE的兼容性问题,以及如何解决。同时,根据引用资料,引用相关的方法说明,比如引用[1]和[2]中的内容。</think>### 如何用JavaScript获取数组中某个对象的下标? #### 方法一:使用`findIndex`方法 `Array.prototype.findIndex`是专为复杂数据类型(如对象)设计的查找方法,通过回调函数定义匹配条件: ```javascript const users = [ {id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}, {id: 3, name: 'Charlie'} ]; const targetIndex = users.findIndex(item => item.id === 2); console.log(targetIndex); // 输出: 1 ``` 该方法返回第一个满足条件的元素索引,未找到则返回`-1`[^2]。 #### 方法二:`indexOf`的局限性 `indexOf`通过严格相等比较,仅适用于基本数据类型: ```javascript const numbers = [10, 20, 30]; console.log(numbers.indexOf(20)); // 输出: 1 ``` 但对象因引用不同无法直接匹配: ```javascript const objArr = [{id: 1}, {id: 2}]; console.log(objArr.indexOf({id: 2})); // 输出: -1 ``` #### 方法三:`forEach`遍历(兼容性方案) 适用于需要兼容旧版浏览器的场景: ```javascript let index = -1; users.forEach((item, i) => { if (item.name === 'Bob') index = i; }); console.log(index); // 输出: 1 ``` #### 注意事项 1. `findIndex`在IE11及以下不支持,需通过polyfill扩展 2. 对象属性匹配时需注意数据类型一致性(如字符串与数字的区别) 3. 多条件查询可在回调函数中增加逻辑: ```javascript users.findIndex(item => item.id > 1 && item.name.includes('B')); ``` #### 性能对比 | 方法 | 时间复杂度 | 适用场景 | |------------|------------|------------------------| | findIndex | O(n) | 对象数组精确查找 | | indexOf | O(n) | 基本类型快速匹配 | | forEach | O(n) | 需要兼容旧环境或复杂逻辑 |
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值