How do I insert an email address to an array?

Hi all, I am currently still new to Javascript, pardon me for the silly question.

I would like to insert an email address into an array whenever an email is entered for the browser.

Therefore, how should the code be edited to get it to work?

var emails = [];
  
  function myFunction(evt){
evt.preventDefault(); //This line will prevent any action such as refreshing the page after submitting the form.
const email = document.getElementById("e").value;
    
    emails.push(email); //I think something is missing for this row but am not quite sure
    
    if (email.includes('@') && email.includes('.com')){
      alert("Thank you for subscribing!");
    } elseif (email.includes('@') && email.includes('.com') && emails.includes(email)){
      alert("The email had already been entered in earlier.");
    }
    else{
      alert("Please enter a valid email.")
    }
}
    
const button = document.getElementById("s");
button.addEventListener("click", myFunction)

Thanks for the help in advance!

What is it doing or not doing that you think it should or should not?

    emails.push(email); //I think something is missing for this row but am not quite sure

That seems correct. It will add email to the end of the array emails.

One thing that I find curious is that you do it before you check if it is in the array:

emails.includes(email)

That will always be true, because you just added it. I would expect the logic a little different:

if not valid email
  alert not valid
else if already entered
  alert already entered
else
  push email
  alert success message
1 Like

Hi @kevinSmith ,

thanks for the idea! managed to get it to work!

I should have place the push function into the if else statement.

  var emails = [];
  
  function myFunction(evt){
evt.preventDefault(); //This line will prevent any action such as refreshing the page after submitting the form.

    const email = document.getElementById("e").value;
        
    if (email.includes('@') && email.includes('.com') && !emails.includes(email)){ 
      emails.push(email);
      alert("Thank you for subscribing!");
    } else if (email.includes('@') && email.includes('.com') && emails.includes(email)){
      alert("The email had already been entered in earlier.");
    }
    else{
      alert("Please enter a valid email.");
    }
  }

Cool. I still think the order is wrong. I think it works, but it is unnecessarily complex.

    if (!email.includes('@') || !email.includes('.com') { 
      alert("Please enter a valid email.");
    } else if (emails.includes(email)) {
      alert("The email had already been entered in earlier.");
    } else {
      emails.push(email);
      alert("Thank you for subscribing!");
    }

If you do it in this order, the logic is simpler. Since we confirm that it has an “@” and a “.com” in the if, we don’t need to reconfirm it in the else if. And we don’t need the !emails.includes(email)) from the if line. We’re checking 3 things instead of 6 and getting the same result.

I would also point out that !email.includes('@') || !email.includes('.com') is probably not a good email validation. For example, emails will only have one “@” and you check for “.com” but it isn’t checking if it is at the end and not all emails end with “.com” anyway. Maybe you’re just messing around, but I’m just pointing it out. You can look up email validation if you want.

1 Like

Thank you @kevinSmith , the code does looks more cleaner and less messy. Noted on the email validation point, I am still learning on the email validation using regex expression

Another way of writing this with more concise and readable code is:

    if (email.includes('@') && email.includes('.com')) {
      if (!emails.includes(email)){ 
        emails.push(email);
        alert("Thank you for subscribing!");
      } else){
        alert("The email had already been entered in earlier.");
      }
    } else{
      alert("Please enter a valid email.");
    }
1 Like

Hi @RandellDawson , how I can amend the code below so that it could fire up the email validation via regex expression?

  var emails = [];
  
  function myFunction(evt){
evt.preventDefault(); //This line will prevent any action such as refreshing the page after submitting the form.
      
    const emailformat = "/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/";
    
    const email = document.getElementById("e").value;

    console.log(emails)
    
	if (email.includes(emailformat)) { // am i missing anything? I tried using matches or contains, an error pops up stating cannot read property of contains or matches
      if (!emails.includes(email)){ 
        emails.push(email);
        alert("Thank you for subscribing!");
      } else{
        alert("The email had already been entered in earlier.");
      }
    } else{
      alert("Please enter a valid email.");
    }
  }

My apologies for the add on question for the email regex expression as it was not intended for this thread