๐ JavaScript Exercise: Searching for a Student’s Name ๐
Are you learning JavaScript and want to practice your skills? Try out this coding exercise!
In this exercise, we create a simple program to search for a student’s name in an array of student names. We use the powerful includes method to perform the search.
Here are the steps:
- Set up the JavaScript environment in an HTML file.
- Create an array of student names.
- Implement the student search logic.
- Test the program by entering a student’s name.
This exercise is a great way to practice using the includes method to check for the presence of elements in an array. It’s perfect for JavaScript beginners and those looking to reinforce their skills.
Give it a try, and let me know how it goes! Feel free to reach out if you have questions or need further assistance. Happy coding! ๐ฅ๏ธ๐ก
#JavaScript #CodingExercise #LearnToCode #Programming #LinkedInLearning
JavaScript code to find if a string value is within an array
To check if an array contains a specific string value in JavaScript, you can use the includes method or a loop. Here, I’ll provide examples of both methods along with explanations:
Method 1: Using the includes Method
The includes method is a built-in array method in JavaScript that checks if an array includes a specific element and returns true if found and false if not found. Here’s how you can use it to check for a string value in an array:
// Sample array
const colors = [“red”, “green”, “blue”, “yellow”];
// String to check for
const searchString = “blue”;
// Using includes method
if (colors.includes(searchString)) {
console.log(`${searchString} is in the array.`);
} else {
console.log(`${searchString} is not in the array.`);
}
In this example:
- We have an array called colors.
- We want to check if the string “blue” exists in the array.
- We use the includes method to check for the presence of “blue”.
- If “blue” is found in the colors array, it prints “blue is in the array.”; otherwise, it prints “blue is not in the array.”
Method 2: Using a Loop (for…of loop)
You can also use a loop, such as a for…of loop, to iterate through the array and manually check each element for equality with the string you’re searching for. Here’s how to do it:
// Sample array
const colors = [“red”, “green”, “blue”, “yellow”];
// String to check for
const searchString = “blue”;
// Using a for…of loop
let found = false;
for (const color of colors) {
if (color === searchString) {
found = true;
break; // Exit the loop early once found
}
}
if (found) {
console.log(`${searchString} is in the array.`);
} else {
console.log(`${searchString} is not in the array.`);
}
In this example:
- We have the same array colors and the string searchString as in the previous example.
- We use a for…of loop to iterate through each element in the colors array.
- Inside the loop, we compare each element with searchString to check for a match.
- If a match is found, we set the found variable to true and break out of the loop.
- Finally, we check the found variable to determine whether the string was found in the array.
Both of these methods will help you determine if a specific string exists in an array in JavaScript. You can choose the one that best suits your coding style and requirements.
Explore more about using include method
Example 1: Checking for a Number in an Array of Numbers:
const numbers = [1, 2, 3, 4, 5];
const numToCheck = 3;
if (numbers.includes(numToCheck)) {
console.log(`${numToCheck} is in the array.`);
} else {
console.log(`${numToCheck} is not in the array.`);
}
In this example, we’re checking if the number 3 exists in the numbers array.
Example 2: Checking for Substring in an Array of Strings:
const fruits = [“apple”, “banana”, “cherry”, “date”];
const searchString = “ban”;
if (fruits.some(fruit => fruit.includes(searchString))) {
console.log(`A fruit containing “${searchString}” was found.`);
} else {
console.log(`No fruit contains “${searchString}”.`);
}
This example checks if any string in the fruits array contains the substring “ban”.
Example 3: Checking for an Object in an Array of Objects:
const people = [
{ name: “Alice”, age: 30 },
{ name: “Bob”, age: 25 },
{ name: “Charlie”, age: 35 }
];
const personToFind = { name: “Bob”, age: 25 };
if (people.some(person => JSON.stringify(person) === JSON.stringify(personToFind))) {
console.log(“The person exists in the array.”);
} else {
console.log(“The person does not exist in the array.”);
}
Here, we’re checking if an object with specific properties exists in the people array.
Example 4: Checking for Undefined in an Array:
const values = [1, 2, undefined, 4, 5];
if (values.includes(undefined)) {
console.log(“Undefined value is in the array.”);
} else {
console.log(“Undefined value is not in the array.”);
}
In this example, we’re checking if the undefined value exists in the values array.
Example 5: Checking for Null in an Array:
const items = [“apple”, “banana”, null, “date”];
if (items.includes(null)) {
console.log(“Null value is in the array.”);
} else {
console.log(“Null value is not in the array.”);
}
This example checks if the null value is present in the items array.
These examples demonstrate the versatility of the includes method in checking for the presence of various types of elements in arrays, including numbers, strings, objects, undefined, and null.
Coding Exercise to practice Includes JavaScript learn to code
Here’s a step-by-step coding exercise that incorporates the concept of using the includes method to check for the presence of elements in an array. In this exercise, you’ll create a simple program to search for a student’s name in an array of student names.
Step 1: Set up the JavaScript Environment
Create an HTML file (e.g., index.html) with the following content:
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Student Search</title>
</head>
<body>
<h1>Student Search</h1>
<script src=”script.js”></script>
</body>
</html>
Create a JavaScript file (e.g., script.js) in the same directory.
Step 2: Create an Array of Student Names
In the script.js file, define an array of student names. You can use an array literal for this purpose:
const studentNames = [“Alice”, “Bob”, “Charlie”, “David”, “Eva”];
Step 3: Implement the Student Search
Write JavaScript code to prompt the user for a student’s name and then check if that name exists in the studentNames array using the includes method. Display an appropriate message based on whether the name is found or not.
// Step 2: Create an array of student names
const studentNames = [“Alice”, “Bob”, “Charlie”, “David”, “Eva”];
// Step 3: Implement the student search
const userInput = prompt(“Enter a student’s name:”);
if (userInput) {
// Check if the entered name exists in the array
if (studentNames.includes(userInput)) {
alert(`${userInput} is enrolled in the class.`);
} else {
alert(`${userInput} is not found in the class.`);
}
} else {
alert(“Invalid input. Please enter a student’s name.”);
}
Step 4: Test the Program
Now, open the index.html file in a web browser. You should see a simple webpage with a prompt dialog that asks for a student’s name. Enter a student’s name, and the program will check if that name exists in the studentNames array and display a corresponding message.
This exercise demonstrates how to use the includes method to perform a basic search operation in an array and provide feedback to the user based on the search result.
Feel free to expand upon this exercise by adding more names to the studentNames array or incorporating additional features, such as displaying a list of all enrolled students.
