프론트 엔드 퍼지 쿼리의 js 구현에 대한 자세한 설명

퍼지 쿼리의 경우 키워드는 일반적으로 백엔드로 전달되고 백엔드가 이를 수행합니다. 그러나 때로는 일부 경량 목록 프런트엔드가 Ajax 요청을 줄이고 사용자 경험을 어느 정도 향상시킬 수 있습니다. 더 이상 고민하지 않고 바로 코드로 넘어가겠습니다.

//字符串方法indexOf
var len = list.length;
var arr = [];
for(var i=0;i<len;i++){
    //如果字符串中不包含目标字符会返回-1
    if(list[i].indexOf(keyWord)>=0){
        arr.push(list[i]);
    }
}
return arr;

//正则表达式
var len = list.length;
var arr = [];
var reg = new RegExp(keyWord);
for(var i=0;i<len;i++){
    //如果字符串中不包含目标字符会返回-1
    if(list[i].match(reg)){
        arr.push(list[i]);
    }
}
return arr;

우선 퍼지 쿼리가 무엇인지 이해해야 합니다(말도 안 되는 소리가 또 옵니다). 키워드를 기반으로 목록에 키워드를 나열하는 것입니다(물론 여기서는 가장 간단한 쿼리만 수행됩니다). 즉, 목록의 각 항목을 확인하는 것입니다. 항목에 키워드가 포함되어 있는지 여부는 추상적으로 문자열에 특정 문자 또는 문자열이 포함되어 있는지 여부를 의미합니다.

이제 아이디어가 생겼으니 다음 단계는 이를 구현하는 것입니다. js의 기본 데이터 유형을 배우면 String에 많은 메소드가 있음을 알 수 있습니다. (''); 문자열에서 특정 문자의 위치를 ​​알아내는 방법으로, 대상 문자가 없으면 -1을 반환합니다. 따라서 이 방법을 사용하여 목록의 각 항목에 키워드가 포함되어 있는지 확인할 수 있습니다. 다음은 문자열의 대상 문자를 일치시키는 정규식인 매우 강력한 RegExp입니다. 여기서는 match 메소드가 사용됩니다. 일치할 수 없으면 공백을 반환합니다. 물론 구현 가능한 다른 메소드도 있습니다. 여기에 나열되지 않습니다.

관련 권장 사항:

입력 기반 동적 퍼지 쿼리

js 프런트엔드 퍼지 쿼리 구현 코드

php 퍼지 쿼리 구현 방법

위 내용은 프론트 엔드 퍼지 쿼리의 js 구현에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!