Why includes() is not working good in my code?

Question

I have a problem with this function in React:

createContact = (item) => {
        let items = this.state.items;
        let email = this.state.email;

        if (items.length < 10 && 
            items.includes(email) === false &&
            EmailValidator.validate(email) === true) {
            this.setState(state => ({
                button: true,
                items: state.items.concat([ item ]),
                info: '✔ You have successfully added an user.'
            }))
        }
        else if (EmailValidator.validate(email) === false) {
            this.setState(state => ({
                button: true,
                items: state.items,
                info: '! User has\'t been added - the email was invalid. Try again!'
            }))
        }
        else if (items.includes(email) === true){
            this.setState(state => ({
                button: false,
                items: state.items,
                info: '! This email exists on this list.'
            }))
        }
    }

The problem is, with this part of code items.includes(email). I used this part of code to check, if email is on list if not. But this always return 'false' - if email exist on list or not ...

I tried to use for this indexOf function - but it was the same ....

Maybe some of you will see the bug on this code or maybe my idea is not good ?

Thans for every tips and answers!

It's hard to say without seeing what your `items` array looks like, but it should work. `['test@example.com'].includes('test@example.com') === true` — Tholle, Aug 09 '18 at 13:12
Explicitly comparing to `true` and `false` is a fragile practice. Instead of `items.includes(email) === false` I'd write `!items.includes(email)` — Pointy, Aug 09 '18 at 13:13
I don't see anything immediately wrong with your code. Have you tried `console.log(items);` and `console.log(email);` to see the actual values of those variables in your browser's dev tools? — AKX, Aug 09 '18 at 13:13
console.log(items); console.log(items.includes(this.state.email)); console.log(email); — Iwona Hajczewska, Aug 09 '18 at 13:25
I tried change a boolean value (true and false) for a 'email - but this is not working too :( — Iwona Hajczewska, Aug 09 '18 at 13:28
Please comment here the results from logging "items" and "email". — Renan Souza, Aug 09 '18 at 13:30
paste the result of `console.log(items)` and `console.log(email)` — Emeeus, Aug 09 '18 at 13:30
[link to screen with result in console](http://www.serwisstron.pl/screen.png) — Iwona Hajczewska, Aug 09 '18 at 13:35
The problem is that you are trying to find an object property inside an array, not directly the value. — Renan Souza, Aug 09 '18 at 13:42
[this](https://stackoverflow.com/questions/8217419/how-to-determine-if-javascript-array-contains-an-object-with-an-attribute-that-e) is what you what — Renan Souza, Aug 09 '18 at 13:43
`items.some(e => e.email === email)` is the equivalent for what you want. — Renan Souza, Aug 09 '18 at 13:45
Hi @RenanSouza! Thanks for your help - I was blind .....I hope that this will be working for a moment with your tips :) — Iwona Hajczewska, Aug 09 '18 at 13:48
i wanted to share this [gist](https://gist.github.com/alphapilgrim/007d7f65c0c0748891c7c8a1f0badddb) as a point of reference on how you can keep things more concise and dry. — alphapilgrim, Aug 09 '18 at 13:58
Thank you so much for your help - it's working. I will analyze it carefully. Thanks again! — Iwona Hajczewska, Aug 09 '18 at 14:15

Emeeus · Answer 1 · 2018-08-09T14:05:58.647

1

As we could see in the image pasted in comments (why you should not doing that), you don't have an arrays of emails, you have an array of objects that includes an email in some of their properties (email).

You could use Array.prototype.some() to return true or false if some element is present passing a function as parameter items.some(o => o.email === mail) Array.prototype.includes() doesn't accept a functions as parameter.

var items = [{
    "email": "some@email.com"
  },
  {
    "email": "some@email2.com"
  },
  {
    "email": "some@email3.com"
  }
]


var mail = "some@email.com";

var mail2 = "some@email4.com";

(items.some(o => o.email === mail)) ? console.log(true): console.log(false);

(items.some(o => o.email === mail2)) ? console.log(true): console.log(false);

Finally, please read why we shouldn't paste images of code: https://meta.stackoverflow.com/a/285557/6121568

edited Aug 09 '18 at 14:05

answered Aug 09 '18 at 13:44

Emeeus

5,072
2
25
37

If you are leveraging information from the comments to create your answer, you could at least explain the case and/or edit the main question. – Renan Souza Aug 09 '18 at 13:47
@RenanSouza of course, I've edited the answer – Emeeus Aug 09 '18 at 13:51
@RenanSouza I've just seen your comment proposing exactly the same solution. – Emeeus Aug 09 '18 at 14:01
1

No problem. It's okay. I just commented that here in your answer to ensure that anyone gets miss-lead because of this tricky situation for beginners. Sorry if I seemed rude. – Renan Souza Aug 09 '18 at 14:04
1

No problem @RenanSouza. – Emeeus Aug 09 '18 at 14:10
Hi @Emeeus! Thanks for information about images - I will remeber about that in the future. And thanks for explanation of my problem. – Iwona Hajczewska Aug 09 '18 at 14:21

Why includes() is not working good in my code?

1 Answers1