When button clicked on load it adds 'undefined' to array

So I'm trying to make a form that accepts names.The input field will take in a name. When you press the submit button it will add the name to an array only if

• name!=null and
• and the name is not a duplicate

after that the array will be displayed below the input box.

For checking the input before adding to the array I used the following code:

    var name = String(this.studentName);    name = name.trim();    this.currentStudentName = name;    if (this.listOfNames.includes(this.currentStudentName)) {        alert('Duplicate name found!');    } else if (this.currentStudentName === '') {        alert('Emptry entry!');    } else {        this.listOfNames.push(this.currentStudentName);    }}

The code is working fine with duplicate values and empty values BUT

If on loading the page if I directly press the submit button, undefined is added to the array and the array is displayed with first entry as "undefined", butI do not want the undefined to be saved into the array.

example