Author: John Au-Yeung

Sometimes, we want to check for multiple string matches with JavaScript.

In this article, we’ll look at how to check for multiple string matches with JavaScript.

How to check for multiple string matches with JavaScript?

To check for multiple string matches with JavaScript, we can use the JavaScript string’s match method with a regex.

For instance, we write:

const str = 'audio video'
if (str.match(/(video|audio)/)) {
  console.log('found')
} else {
  console.log('not found')
}

to call str.match with a regex.

Since 'audio' and 'video' are both in str, str.match(/(video|audio)/) returns true.

Conclusion

To check for multiple string matches with JavaScript, we can use the JavaScript string’s match method with a regex.

Sometimes, we want to wait until setInterval is done with JavaScript.

In this article, we’ll look at how to wait until setInterval is done with JavaScript.

How to wait until setInterval is done with JavaScript?

To wait until setInterval is done with JavaScript, we can call setInterval in a promise.

For instance, we write:

const rollDice = () => {
  return new Promise((resolve, reject) => {
    let numberOfRollsLeft = 5
    const intervalId = setInterval(() => {
      const diceValue = Math.floor(Math.random() * 6 + 1);
      numberOfRollsLeft--
      if (numberOfRollsLeft === 0) {
        clearInterval(intervalId);
        resolve(diceValue);
      }
    }, 50);
  });
}

const roll = async () => {
  const val = await rollDice()
  console.log(val)
}
roll()

We define rollDice which returns a promise.

We create the promise with the Promise constructor with a callback that calls setInterval with a callback to draw a random number.

If numberOfRollsLeft is 0, then we call clearInterval to stop the timer and call resolve with the diceValue to return that as the resolved value.

Next, we call rollDice in the roll function and use await to get the resolved promise value.

Conclusion

To wait until setInterval is done with JavaScript, we can call setInterval in a promise.

Sometimes, we want to filter strings in array based on content with JavaScript.

In this article, we’ll look at how to filter strings in array based on content with JavaScript.

How to filter strings in array based on content with JavaScript?

To filter strings in array based on content with JavaScript, we can use the JavaScript array’s filter instance method.

For instance, we write:

const myArray = ["bedroomone", "bedroomonetwo", "bathroom"];
const pattern = /bedroom/;
const filtered = myArray.filter((str) => {
  return pattern.test(str);
});
console.log(filtered)

We call myArray.filter with a callback that matches all the strings that has 'bedroom' in it by calling pattern.test with str.

Therefore, filtered is ['bedroomone', 'bedroomonetwo'].

Conclusion

To filter strings in array based on content with JavaScript, we can use the JavaScript array’s filter instance method.

Sometimes, we want to a remove portion of string in JavaScript.

In this article, we’ll look at how to a remove portion of string in JavaScript.

How to a remove portion of string in JavaScript?

To a remove portion of string in JavaScript, we can call the string replace method with the substring we want to remove and replace it with an empty string.

For instance, we write:

const string = '@usernameWhats on your mind?'
const newString = string.replace('Whats on your mind?', '');
console.log(newString)

We call string.replace to replace 'Whats on your mind?' with an empty string and return the new string.

Therefore, newString is '@username'.

Conclusion

To a remove portion of string in JavaScript, we can call the string replace method with the substring we want to remove and replace it with an empty string.

Sometimes, we want to create label and check box dynamically in JavaScript.

In this article, we’ll look at how to create label and check box dynamically in JavaScript.

How to create label and check box dynamically in JavaScript?

To create label and check box dynamically in JavaScript, we can use the createElement method.

For instance, we write:

const newLabel = document.createElement("label");
newLabel.setAttribute("for", 'checkbox');
newLabel.innerHTML = "Here goes the text";

const newCheckbox = document.createElement("input");
newCheckbox.setAttribute("type", 'checkbox');
newCheckbox.setAttribute("id", 'checkbox');

document.body.appendChild(newLabel);
document.body.appendChild(newCheckbox);

We call document.createElement to create a label.

Then we call setAttribute to set the for attribute to checkbox.

And we set the innerHTML property to add some text to the label.

Next, we call createElement again to create an input.

Next, we call setAttribute to set the type attribute to checkbox to make it a checkbox.

We call the same method to set the id attribute.

Finally, we call document.body.appendChild to append them both to the body element.

Conclusion

To create label and check box dynamically in JavaScript, we can use the createElement method.