스프레더를 사용하여 Es6에서 다음 작업을 수행하고 연산자를 수집 할 수 있습니까?

Question

선택기에 특정 클래스, ID 또는 둘 다 있는지 확인합니다. id, class 또는 둘 다에 일치하는 것이 있으면 eitherClassIdOrBoth()은 선택자를 elements 배열로 푸시합니다. 완벽하게 잘 작동하지만, spread operator을 사용하여 ES6에서이를 수행 할 수 있는지 궁금합니다.

var elements = [] 

function eitherClassIdOrBoth(
    selectId, selectClass, array, matchBoth, elements 
) 
{ 

    for (let i = 0; i < array.length; i++) { 
     var classSection = array[i].className.split(" "); 
     var matchId = selectId !== undefined && array[i].id === selectId; 
     var matchClass = classSection !== undefined && 
      classSection.indexOf(selectClass) !== -1; 

     if (idAndClassMatch(matchId, matchClass, matchBoth)) { 
      elements.push(array[i]); 
     } 
    } 
} 

내가 if 문에서이 값을 전달하고있다 :

var idAndClassMatch = function(matchId, matchClass, matchBoth) { 
return (
(matchBoth && matchId && matchClass) || (!matchBoth && (matchId || matchClass))); } 

이 내가 확산 연산자를 사용하고자하는 기능은 다음과 같습니다이 부울을 반환 곳

입니다 :

if (arr.length === 2) { 
    computedFunction.eitherClassIdOrBoth(
     selectId, selectClass, tags, false, Allelements 
    ); 
} 

도움이 될 매우 도움이 될 것입니다!

Answer 1

이 논리를 작성하는 더 좋은 방법이 있지만 요점은 아마도 ES6과 관련이 없을 것입니다.

가장 큰 문제는이 전체 기능의 기본 쿼리가 Element#matches을 호출하여 CSS 선택기를 기반으로 요소를 검사 할 수 있다는 것입니다. 이전 브라우저에서는 일관되게 사용할 수 없지만 polyfill을로드하여 사용 가능한지 확인하는 것은 쉽지 않습니다. 그런 다음 전체

computedFunction.eitherClassIdOrBoth(
    selectId, selectClass, tags, false, Allelements 
); 

전화는 것

Allelements.push(
    ...tags.filter(tag => tag.matches(`.${selectClass}, [id="${selectId}"]`) 
); 

예를 들어, .filter 및 .matches을 사용하여 지정된 tags 배열을 가진 항목만으로 새 배열을 만든 다음 ES6 스프레드를 사용하여 모든 항목을 Allelements 배열로 쉽게 푸시합니다.

selectClass 또는 selectId이 undefined 일 수있는 몇 가지 사례가있는 것 같습니다. 그래야 검색어를 작성할 수도 있습니다.

const selector = [ 
    selectClass ? `.${selectClass}` : "", 
    selectId ? `[id="${selectId}"]` : "", 
].filter(Boolean).join(","); 
Allelements.push(
    ...tags.filter(tag => selector ? tag.matches(selector) : false 
); 

및 matchBoth이 true 인 경우에

, 당신은 단지 "" 대신 ","으로 선택 가입 할 수 있습니다. 따라서 일반적인 유틸리티를 원한다면

function eitherClassIdOrBoth(
    selectId, selectClass, array, matchBoth, elements 
) { 
    const selector = [ 
     selectClass ? `.${selectClass}` : "", 
     selectId ? `[id="${selectId}"]` : "", 
    ].filter(Boolean).join(matchBoth ? "" : ","); 
    if (selector) { 
     elements.push(...array.filter(tag => tag.matches(selector)); 
    } 
} 

으로 끝날 것입니다.