Check if array value is included in string

Question

I'm working on some client side validation for a contact form of sorts, the website currently isn't online so server side isn't relevant.

I am trying to create a 'word filter' to catch on any abusive of obscene language before the form is 'submitted'.

Heres the code, without the obscenities...

function filterInput(str) {
    var inputFilter = ['word1', 'word2', 'word3'];
    var arrayLength = inputFilter.length;

if (inputFilter.indexOf(str) > - 1) {
    // Word caught...
} else {
    // Clear...
}

If the user were to enter 'word1', it will catch the word. If the user enters 'word1word2' or 'John is a word3', it doesn't catch it.

I originally had a for loop which worked better, but still wouldn't work without whitespace between words('word1word2').

Any input would be greatly appreciated, I've been searching but nothing quite matches my needs.

EDIT: So I too have come up with a solution, but seeing the varying ways this can be achieved I am curious as to how it works and also why a particular way is better?

Heres what I came up with...

function filterInput(str) {
    var inputFilter = ['word1', 'word2', 'word3'];
    var arrayLength = inputFilter.length;

    for (var i = 0; i < arrayLength; i++) {
        if (str.includes(inputFilter[i])) {
            window.alert('Message...');
            return;
        } 
    }
}

T.J. Crowder · Accepted Answer · 2017-10-02 14:07:15Z

5

You're looking for some rather than indexOf, since you have to do custom matching:

if (inputFilter.some(function(word) { return str.indexOf(word) != -1; })) {
    // Word caught...
} else {
    // Clear...
}

Or with an ES2015+ arrow function and String.prototype.includes:

if (inputFilter.some(word => str.includes(word))) {
    // Word caught...
} else {
    // Clear...
}

some calls the callback repeatedly until the first time it returns a truthy value. If the callback ever returns a truthy value, some returns true; otherwise, some returns false. E.g., it's asking if "some" of the entries match the predicate function. (any may have been a better term, but when adding to the built-ins, the TC39 committee have to do a lot of work to avoid conflicts with libraries and such.)

If you ever need to get back the actual entry, use find which returns the entry or undefined if not found. If you need its index, use findIndex.

Side note: Just beware that it's notoriously complicated to do this well. Beware of the Scunthorpe problem, and of course people will routinely just confuse the sequence of letters or substitute asterisks or similar to defeat filters of this sort...

edited Oct 2, 2017 at 14:07

answered Oct 2, 2017 at 13:34

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

mrkd1991 Over a year ago

I'm only starting out, so I think I'll avoid ES2015+ for now. As for some, how does it work in comparison to what I have come up with?

T.J. Crowder Over a year ago

@mrkd1991: Not sure what you mean by "how does it work" there. If you mean performance, JavaScript engines are very fast at function calls. Here's an article I did on that back in 2012; even IE6, the slowest JavaScript engine you could ask for, did them so fast it wasn't a factor: blog.niftysnippets.org/2012/02/foreach-and-runtime-cost.html

mrkd1991 Over a year ago

As in, what does this function do to gain the desired outcome, and what's different between that and my new attempt?

T.J. Crowder Over a year ago

@mrkd1991: I thought I explained how the above gets the outcome: "some calls the callback repeatedly until the first time it returns a truthy value. If the callback ever returns a truthy value, some returns true; otherwise, some returns false." So it looks for any entry where str.indexOf(word) != -1 (or where str.includes(word) is true, in the ES2015+ version). That's what your code does with a for loop, just using some instead.

mrkd1991 Over a year ago

Your side note makes me think that as a beginner perhaps some isn't the best way to go, though normally it would be. Looking at the second function I created, (apart from not using some...)are there any issues or things that a begginer should perhaps do differently?

|

nikita · Accepted Answer · 2017-10-02 13:37:46Z

0

you can try something like this:-

function filterInput(str) {
  var badWords = ['bad', 'worst'];
  var isTrue = false;
  if(str) {
     for (var i = 0; i < badWords.length; i++) {
       isTrue = !!(str.replace(/\W|\s/g, '').toLowerCase().indexOf(badWords[i]) + 1);
       if(isTrue) break;
     }
  }
  return isTrue;
}

answered Oct 2, 2017 at 13:37

nikita

4043 silver badges8 bronze badges

1 Comment

mrkd1991 Over a year ago

How would you compare using a boolean as opposed to the method I have used? Also, str is formatted before being passed so no need to do so within this function.

Collectives™ on Stack Overflow

Check if array value is included in string

2 Answers 2

7 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related