在javascript中，如何在数组中搜索子字符串匹配项

75

我需要在JavaScript中搜索数组。搜索将仅针对字符串的一部分进行匹配，因为该字符串将分配有其他数字。然后，我需要返回带有完整字符串的成功匹配的数组元素。

即

var windowArray = new Array ("item","thing","id-3-text","class");

我需要搜索其中包含的数组元素，"id-"并且也需要在元素中提取其余文本（即"id-3-text"）。

谢谢

javascript  arrays  search 
— reub77
source
17
您可以过滤数组results = arr.filter(function (v) {return /id-/.test(v)});。然后您可以对结果进行任何操作。
— zzzzBov
@zzzzBov您的评论值得回答……
— Skippy le Grand Gourou

Answers:

18

在您的特定情况下，您可以使用无聊的旧计数器来完成此操作：

var index, value, result;
for (index = 0; index < windowArray.length; ++index) {
    value = windowArray[index];
    if (value.substring(0, 3) === "id-") {
        // You've found it, the full text is in `value`.
        // So you might grab it and break the loop, although
        // really what you do having found it depends on
        // what you need.
        result = value;
        break;
    }
}

// Use `result` here, it will be `undefined` if not found

但是，如果您的数组是稀疏的，则可以通过适当设计的for..in循环来更有效地执行此操作：

var key, value, result;
for (key in windowArray) {
    if (windowArray.hasOwnProperty(key) && !isNaN(parseInt(key, 10))) {
        value = windowArray[key];
        if (value.substring(0, 3) === "id-") {
            // You've found it, the full text is in `value`.
            // So you might grab it and break the loop, although
            // really what you do having found it depends on
            // what you need.
            result = value;
            break;
        }
    }
}

// Use `result` here, it will be `undefined` if not found

当心for..in没有hasOwnProperty和!isNaN(parseInt(key, 10))检查的幼稚的循环；这就是为什么。

离题：

另一种写法

var windowArray = new Array ("item","thing","id-3-text","class");

是

var windowArray = ["item","thing","id-3-text","class"];

...这对您来说键入的次数较少，也许（这一点是主观的）更容易阅读。这两个语句具有完全相同的结果：具有这些内容的新数组。

— TJ人群
source
62

如果你能使用Underscore.js在你的项目中，_.filter（）阵列的功能，使这个瞬间：

// find all strings in array containing 'thi'
var matches = _.filter(
    [ 'item 1', 'thing', 'id-3-text', 'class' ],
    function( s ) { return s.indexOf( 'thi' ) !== -1; }
);

迭代器函数可以做任何您想做的事情，只要它为匹配返回true。效果很好。

2017年12月3日更新：
这是一个非常过时的答案。以大批量的也许不是性能最好的选择，但它可以写成一个很多更简洁，并使用原生ES6数组/字符串的方法，如.filter()与.includes()现在：

// find all strings in array containing 'thi'
const items = ['item 1', 'thing', 'id-3-text', 'class'];
const matches = items.filter(s => s.includes('thi'));

注意：不支持<= IE11 String.prototype.includes()（请注意Edge可以正常工作），但是您可以使用polyfill很好，或者只是回到indexOf()。

— 尼克
source
@ Floppy88好吧，最初的问题是在一个简单数组中搜索；现在还需要很长的时间（不需要Underscore。）您是否要搜索对象值或键？一个示例用例将很有帮助。
— nickb
我需要搜索对象键
— Floppy88 '17
1
@ Floppy88只需使用Object.keys(yourArrayName)，它将返回一个数组。您可以使用上面的相同技术来将.filter()其记录下来。
— 尼克
在大多数情况下，使用.filter（）函数是最好的方法
— Anand Raja
54

这里的人使这种方式变得太困难了。只需执行以下操作...

myArray.findIndex(element => element.includes("substring"))

findIndex（）是ES6的高阶方法，它遍历数组的元素并返回与某些条件（作为函数提供）匹配的第一个元素的索引。在这种情况下，我使用ES6语法来声明高阶函数。element是函数的参数（可以是任何名称），并且粗箭头声明以下内容为匿名函数（除非占用多于一行，否则不需要用大括号括起来）。

在其中，findIndex()我使用了非常简单的includes()方法来检查当前元素是否包含所需的子字符串。

— Sourabh
惊人的答案，正是我想要的。谢谢！
— 拉米
18

从给定数组中获取子字符串数组的最简单方法是使用过滤器，包括： 

myArray.filter(element => element.includes("substring"));

上面的一个将返回子字符串数组。

myArray.find(element => element.includes("substring"));

上面的将返回数组中的第一个结果元素。

myArray.findIndex(element => element.includes("substring"));

上面的将返回数组中第一个结果元素的索引。

— 90天
source
这将返回第一场比赛
— 00-BBB
1
@ 00-BBB用过滤器替换查找
— Hos Mercury
感谢@Hos Mercury。是的，过滤器将返回列表
— smnth90 '20
12

只需搜索普通旧字符串 indexOf

arr.forEach(function(a){
    if (typeof(a) == 'string' && a.indexOf('curl')>-1) {
            console.log(a);
    }        
});
— 约翰尼
source
它不适用于空值。
— Tushar Walzade
如果您在数组中混合了类型，那只是不好的做法，但是无论如何我还是添加了检查。
— JohnnyJS
4

实现此目的的最简单的普通javascript代码是 

var windowArray = ["item", "thing", "id-3-text", "class", "3-id-text"];
var textToFind = "id-";

//if you only want to match id- as prefix 
var matches = windowArray.filter(function(windowValue){
  if(windowValue) {
      return (windowValue.substring(0, textToFind.length) === textToFind);
  }
}); //["id-3-text"]

//if you want to match id- string exists at any position
var matches = windowArray.filter(function(windowValue){
  if(windowValue) {
      return windowValue.indexOf(textToFind) >= 0;
  }
}); //["id-3-text", "3-id-text"]
— 卡尔提克
source
1

参考： 在javascript中，如何在数组中搜索子字符串匹配项

此处给出的解决方案是通用的，与解决方案4556343＃4556343不同，该解决方案需要先前的解析来识别to所使用的字符串，而join()不是任何数组字符串的组成部分。
另外，在该代码/!id-[^!]*/中更正确/![^!]*id-[^!]*/地适合问题参数：

  1. “搜索数组...”（包含字符串或数字，而不包含函数，数组，对象等）
  2. “仅匹配字符串的一部分”（匹配可以在任何地方）
  3. “返回匹配的元素...”（单数，而不是全部，如“ ...元素S”中所示）
  4. “带有完整的字符串”（包括引号）

... NetScape / FireFox解决方案（有关解决方案，请参见下文JSON）：

javascript:         /* "one-liner" statement solution */
   alert(
      ["x'!x'\"id-2",'\' "id-1 "',   "item","thing","id-3-text","class" ] .
         toSource() . match( new RegExp( 
            '[^\\\\]("([^"]|\\\\")*' + 'id-' + '([^"]|\\\\")*[^\\\\]")' ) ) [1]
   );

要么

javascript:
   ID = 'id-' ;
   QS = '([^"]|\\\\")*' ;           /* only strings with escaped double quotes */
   RE = '[^\\\\]("' +QS+ ID +QS+ '[^\\\\]")' ;/* escaper of escaper of escaper */
   RE = new RegExp( RE ) ;
   RA = ["x'!x'\"id-2",'\' "id-1 "',   "item","thing","id-3-text","class" ] ;
   alert(RA.toSource().match(RE)[1]) ;

显示"x'!x'\"id-2"。
也许突袭数组以查找所有匹配项是“更干净”的。

/* literally (? backslash star escape quotes it!) not true, it has this one v  */
javascript:                            /* purely functional - it has no ... =! */
   RA = ["x'!x'\"id-2",'\' "id-1 "',   "item","thing","id-3-text","class" ] ;
   function findInRA(ra,id){
      ra.unshift(void 0) ;                                     /* cheat the [" */
      return ra . toSource() . match( new RegExp(
             '[^\\\\]"' + '([^"]|\\\\")*' + id + '([^"]|\\\\")*' + '[^\\\\]"' ,
             'g' ) ) ;
   }
   alert( findInRA( RA, 'id-' ) . join('\n\n') ) ;

显示：

     “ x'！x'\” id-2“

     “'\” id-1 \“”

     “ id-3文字”

使用JSON.stringify()：

javascript:                             /* needs prefix cleaning */
   RA = ["x'!x'\"id-2",'\' "id-1 "',   "item","thing","id-3-text","class" ] ;
   function findInRA(ra,id){
      return JSON.stringify( ra ) . match( new RegExp(
             '[^\\\\]"([^"]|\\\\")*' + id + '([^"]|\\\\")*[^\\\\]"' ,
             'g' ) ) ;
   }
   alert( findInRA( RA, 'id-' ) . join('\n\n') ) ;

显示：

    [“ x'！x'\” id-2“

    ，“'\” id-1 \“”

    ，“ id-3-text”

皱纹：

  • 该“转义”全局RegExp是/[^\]"([^"]|\")*id-([^"]|\")*[^\]"/g用\从字面上找到。为了([^"]|\")*使字符串与all"的转义为\"，\本身必须转为([^"]|\\")*。如果将其引用为要与之串联的字符串id-，则每个字符串都\必须再次转义，因此([^"]|\\\\")*！
  • 一个搜索ID具有\，*，"，...，也必须通过转义.toSource()或JSON或...。
  • null搜索结果应返回''（或""在包含NO "！的EMPTY字符串中）或[]（对于所有搜索）。
  • 如果要将搜索结果合并到程序代码中以进行进一步处理，则eval()必须像一样eval('['+findInRA(RA,ID).join(',')+']')。

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

离题：
突袭和逃脱？这段代码有冲突吗？
符号学，语法和语义/* it has no ... =! */着重阐明了引述文字冲突的转义。

“否=”是否表示：

  • 像这样的“ no'='sign” javascript:alert('\x3D')（不是！运行它，看是否有！），
  • “没有带有赋值运算符的javascript语句”，
  • “不等于”与“其他任何代码都不相同”（以前的代码解决方案证明存在功能上的等效功能）一样，
  • ...

也可以使用下面的即时模式javascript协议URI进行其他级别的报价。（//注释以新行结尾（又名nl，ctrl-J，LineFeed，ASCII十进制10，八进制12，十六进制A），因为插入nl并按Return键会调用URI，因此需要引用该行。）

javascript:/* a comment */  alert('visible')                                ;
javascript:// a comment ;   alert(  'not'  ) this is all comment             %0A;
javascript:// a comment %0A alert('visible but  %\0A  is wrong ')   // X     %0A
javascript:// a comment %0A alert('visible but %'+'0A is a pain to type')   ;

注意：剪切并粘贴任何javascript:行作为即时模式URI（至少在FireFox中至少是？），以便首先javascript:用作URI方案或协议，其余用作JS标签。

— 埃基姆
source
1 
let url = item.product_image_urls.filter(arr=>arr.match("homepage")!==null)

过滤字符串匹配的数组。这很简单，只需一行代码。

— 比斯瓦吉特
source
1

这对我有用。

    const filterData = this.state.data2.filter(item=>((item.name.includes(text)) || (item.surname.includes(text)) || (item.email.includes(text)) || (item.userId === Number(text))) ) ;
— NurdoğanAkdağ
source
1

我创建了一个易于使用的库（ss-search），该库旨在处理对象，但在您的情况下也可以使用：

search(windowArray.map(x => ({ key: x }), ["key"], "SEARCH_TEXT").map(x => x.key)

使用此搜索功能的优势在于，它将在执行搜索之前归一化文本以返回更准确的结果。

— 扬·锡伯杜
source
0

另一种可能性是

var res = /!id-[^!]*/.exec("!"+windowArray.join("!"));
return res && res[0].substr(1);

如果您可以有一个特殊的char分隔符（在这里我用“！”），则IMO可能有意义，该数组是恒定的或大部分恒定的（因此联接可以计算一次或很少计算），并且完整字符串的长度不超过搜索的前缀。

— 6502
source
0

这是您的预期摘要，为您提供了所有匹配值的数组-

var windowArray = new Array ("item","thing","id-3-text","class");

var result = [];
windowArray.forEach(val => {
  if(val && val.includes('id-')) {
    result.push(val);
  }
});

console.log(result);
展开摘要

— 杜莎·瓦尔扎德（Tushar Walzade）
source
0

我认为这可能对您有帮助。我有一个类似的问题。如果您的数组如下所示： 

var array = ["page1","1973","Jimmy"];

您可以执行一个简单的“ for”循环，以在匹配时返回数组中的实例。

var c; 
for (i = 0; i < array.length; i++) {
if (array[i].indexOf("page") > -1){ 
c = i;}
}

我们创建一个空变量c来存放我们的答案。然后，我们遍历数组以查找数组对象（例如“ page1”）与我们的indexOf（“ page”）匹配的位置。在这种情况下，它是0（第一个结果）

如果您需要进一步的支持，很乐意扩展。

— 安德鲁·塞恩斯伯里
source
2
尽管此代码段可以回答问题，但包括解释其为何以及如何帮助解决问题的说明，可以提高回答的质量和寿命，尤其是对于像这样的较老问题。请参阅“我如何写一个好的答案？” 。
— slothiful
您好Slothiful-感谢您的反馈。我已经相应更新了我的答案
— 安德鲁·塞恩斯伯里
0

使用此功能搜索子字符串Item。

function checkItem(arrayItem, searchItem) {
  return arrayItem.findIndex(element => element.includes(searchItem)) >= 0
}

function getItem(arrayItem, getItem) {
  return arrayItem.filter(element => element.includes(getItem))
}

var arrayItem = ["item","thing","id-3-text","class"];


console.log(checkItem(arrayItem, "id-"))
console.log(checkItem(arrayItem, "vivek"))
console.log(getItem(arrayItem, "id-"))
展开摘要

— Vivekanand熊猫
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.