Home > Enterprise >  Is there a short way to check whether the user input ends with one of the elements in an array?
Is there a short way to check whether the user input ends with one of the elements in an array?

Time:01-01

Is there a short way to find out whether the user input ends with (endsWith()) one of the elements in an array? I would like to check if the user input ends with one of the following suffixes: "ss", "ll", "tt". If the user input ends with one of those suffixes, the code should alert a message saying "condition met", otherwise it should alert "condition failed". I can do it using simple if statements as shown in the following code:

    var inp = document.getElementById("inp");
   

    function findingSuffixes(){

    if(inp.value.endsWith('ss') || inp.value.endsWith('tt') || inp.value.endsWith('ll')){
    alert('condition met')
    } else {
    alert('condition failed')
    }
    
    }
    <p>Enter a word:</p>
    <input type="text" id="inp">
    <button onclick="findingSuffixes()">Find out</button>

But this is a bit circuitous.

I tried to approach it from a different angle. I created an array and stored the suffixes in it and then looped through that array and passed the array[i] into the endsWith method as an argument, but it didn't work as expected.

    var inp = document.getElementById("inp");
    suffixes = ["ss", "tt", "ll"];



    function findingSuffixes(){


    for(var i=0; i < suffixes.length; i  ){

    if(inp.value.endsWith(suffixes[i])){
    alert("condition Met")
    } else {
    alert("condition failed")
    }
    
    } 
   
    
    } 
    <p>Enter a word:</p>
    <input type="text" id="inp">
    <button onclick="findingSuffixes()">Find out</button>


TL'DR: Is there a short way to check whether the user input ends with one of the elements in an array?

CodePudding user response:

The problem with your code is that it issues the alert while still in the loop. You only want it to declare "met" or "failed" when it knows for sure. I adjusted the code to show how this can be done. I use break to exit the loop once we meet the condition since there is no need to look further.

var inp = document.getElementById("inp");
var suffixes = ["ss", "tt", "ll"];

function findingSuffixes(){
  var msg = "condition failed";
  for(const suffix of suffixes){
    if (inp.value.endsWith(suffix)){
      msg = "condition Met";
      break;  // no need to continue in the loop
    } 
  } 
  alert(msg);
}
<p>Enter a word:</p>
    <input type="text" id="inp">
    <button onclick="findingSuffixes()">Find out</button>

CodePudding user response:

As @Barmar mentions you best use .some()

var inp = document.getElementById("inp"),
    sfs = ["ss", "tt", "ll"];



function findingSuffixes() {
  alert(sfs.some(sf => inp.value.endsWith(sf)) ? "Condition met"
                                               : "Condition failed");
}
<p>Enter a word:</p>
<input type="text" id="inp">
<button onclick="findingSuffixes()">Find out</button>

CodePudding user response:

You could take a regular experssion and test the string aginst this expression.

/(ll|ss|tt)$/
 (        )   a group
  ll|ss|tt    alternatives with ll ss or tt
           $  followd by an end of string

function findingSuffixes() {
    if (/(ll|ss|tt)$/.test(inp.value)) {
        console.log('condition met');
    } else {
        console.log('condition failed');
    }
}

const inp = document.getElementById("inp");
<p>Enter a word:</p>
<input type="text" id="inp">
<button onclick="findingSuffixes()">Find out</button>

  • Related