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>