zoukankan      html  css  js  c++  java
  • 根据输入关键字过滤数组列表(列表搜索功能)

    function  query(key,list){
            // 我这里直接return(也可赋给变量return变量出去)
            return list.filter(item => {
                // 如果list(name)包含key(输入框) => true
                if(item.includes(key)){
                    // 返回item
                    return item;
               }
           })
        }
    var list = ['北京市','北海道','上海','上帝'];//数据列表
    query('北',list) //["北京市", "北海道"]

    使用到了两个数组方法

    1.includes()

    解释:该方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
    JavaScript版本:ECMAScript 6
    用法:arr.includes(searchElement,fromIndex)
    searchElement:必须。需要查找的元素值。
    fromIndex:可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
    细节:布尔值。如果找到指定值返回 true,否则返回 false。

    2.filter()

    解释:方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
    JavaScript版本:1.6
    用法:arr.filter(function(currentValue,index,arr), thisValue)
    function(currentValue, index,arr):必须。函数,数组中的每个元素都会执行这个函数
    函数参数:
    currentValue:必须。当前元素的值
    index:可选。当前元素的索引值
    arr:可选。当前元素属于的数组对象
    thisValue:可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
    如果省略了 thisValue ,“this” 的值为 “undefined”
    细节:返回数组,包含了符合条件的所有元素。如果没有符合条件的元素则返回空数组。

  • 相关阅读:
    架构设计流程:评估和选择备选方案
    架构设计流程:设计备选方案
    架构设计三原则
    迭代器模式(电视机遥控器)
    外观模式
    5.组合模式
    完成动物识别,自行拍摄动物图片进行上传并查看结果
    4.桥接模式 (毛笔和颜色)
    企业沟通机制
    完成植物识别,自行拍摄植物图片进行上传并查看结果
  • 原文地址:https://www.cnblogs.com/fanqiuzhuji/p/12522340.html
Copyright © 2011-2022 走看看