Article Categories

Selected Reading

Check if user inputted string is in the array in JavaScript

Javascript Web Development Front End Technology Object Oriented Programming

We need to write a JavaScript program that checks if a user-inputted string exists in a predefined array. The program should return true if the string is found, false otherwise.

This is commonly needed when validating user input against a list of acceptable values, such as checking usernames, categories, or allowed options.

Using Array.includes() Method

The includes() method is the most straightforward way to check if an array contains a specific value. It returns a boolean result.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>Check String in Array</title>
</head>
<body>
    <input type="text" id="input" placeholder="Enter a team name">
    <button onclick="checkExistence()">Check</button>
    <p id="result"></p>

    <script>
        const teams = ['arsenal', 'chelsea', 'everton', 'fulham', 'swansea'];
        
        const checkExistence = () => {
            const userInput = document.getElementById("input").value.toLowerCase();
            const exists = teams.includes(userInput);
            document.getElementById('result').innerText = `Result: ${exists}`;
        };
    </script>
</body>
</html>

Case-Insensitive Search

To make the search more user-friendly, we can convert both the input and array values to lowercase for comparison:

<!DOCTYPE html>
<html>
<head>
    <title>Case-Insensitive Search</title>
</head>
<body>
    <input type="text" id="searchInput" placeholder="Try 'Arsenal' or 'CHELSEA'">
    <button onclick="searchTeam()">Search</button>
    <p id="output"></p>

    <script>
        const footballTeams = ['Arsenal', 'Chelsea', 'Everton', 'Fulham', 'Swansea'];
        
        const searchTeam = () => {
            const input = document.getElementById("searchInput").value;
            const normalizedInput = input.toLowerCase();
            const normalizedTeams = footballTeams.map(team => team.toLowerCase());
            
            const found = normalizedTeams.includes(normalizedInput);
            const message = found ? 
                `"${input}" is in the list!` : 
                `"${input}" not found in the list.`;
            
            document.getElementById('output').innerText = message;
        };
    </script>
</body>
</html>

Alternative Methods

Besides includes(), you can use other array methods:

const teams = ['arsenal', 'chelsea', 'everton'];
const searchTerm = 'chelsea';

// Method 1: includes()
const method1 = teams.includes(searchTerm);

// Method 2: indexOf()
const method2 = teams.indexOf(searchTerm) !== -1;

// Method 3: find()
const method3 = teams.find(team => team === searchTerm) !== undefined;

// Method 4: some()
const method4 = teams.some(team => team === searchTerm);

Comparison of Methods

Method	Returns	Performance	Best For
`includes()`	Boolean	Fast	Simple existence check
`indexOf()`	Index or -1	Fast	Need position info
`find()`	Element or undefined	Medium	Complex conditions
`some()`	Boolean	Medium	Complex conditions

Conclusion

Use Array.includes() for simple string existence checks in arrays. For case-insensitive searches, normalize both input and array values to lowercase before comparison.

AmitDiwan

Updated on: 2026-03-15T23:19:00+05:30

526 Views

Kickstart Your Career

Get certified by completing the course

Get Started

Previous Next