如何使用三元语句来简化此代码？

Question

In my first if statement, it checks to see if a word from the array food and window[items] appears in the text. In my second if statement, it checks to see if a word from the array window[items] appears in the text

Note that which if statement is run depends on whether or not the array authors is empty - the first statement will run if it isn't empty and the second will run if it is empty.

if(food.length > 0 && food.some(text => tag.textContent.includes(text)) && window[items].some(text => tag.textContent.includes(text))) {
   ele[i].style.display = "block";
}else{
   ele[i].style.display = "none";  
}

if(food.length < 1 && window[items].some(text => tag.textContent.includes(text))) {
   ele[i].style.display = "block";
}else{
   ele[i].style.display = "none";  
}

I have tried simplifying this code by using a ternary operator, but it returns this error:

Uncaught SyntaxError: Unexpected token )

if((food.length > 0 ? food.some(text => tag.textContent.includes(text))) && window[items].some(text => tag.textContent.includes(text))) {
   ele[i].style.display = "block";
}else{
   ele[i].style.display = "none"; 
}

Answer 1

You can achieve it by accumulation of two statements and checking with an OR (||) condition. Something like

      ele[i].style.display = (food.length > 0 && food.some(text => tag.textContent.includes(text)) && window[items].some(text => 
      tag.textContent.includes(text)) || (food.length < 1 && 
      window[items].some(text => tag.textContent.includes(text))) ? "block" :"none"

But that looks terrible to a new code reader. For the sake of juniors in the team, stick with the current way please ?

Answer 2

So, the condition is: if ( food is empty or the tag text contains any of food ) and the tag text contains any of the window[items] :

ele[i].style.display = (!food.length || food.some(text => tag.textContent.includes(text)))
          && window[items].some(text => tag.textContent.includes(text)) ? "block" : "none"; 

Answer 3

To have a ternary operator you need ? and : . Pseudocode:

if (condition) { block1 } else { block2 } => condition ? block1 : block2

Condition: food.length > 0

Block 1: food.some(text => tag.textContent.includes(text)) && window[items].some(text => tag.textContent.includes(text))

Block 2: window[items].some(text => tag.textContent.includes(text))

So this should work:

if (food.length > 0 ? food.some(text => tag.textContent.includes(text)) && window[items].some(text => tag.textContent.includes(text)) : window[items].some(text => tag.textContent.includes(text)))