I have tried to create a function which searches for the title in an array of book-objects. For some reason my code doesn't work, I have tried going through each step logically and in my mind it should be working.
let book = {
title: "The 48 Laws of Power",
author: "Robert Greene",
numOfPages: 452,
publisher: "Penguin Books",
rating: "4.5 stars"
}
let book2 = {
title: "How to Catch a Turkey",
author: "Adam Wallace",
numOfPages: 40,
publisher: "",
rating: "5 stars"
}
let book3 = {
title: "Glitter Every Day: 365 Quotes from Women I Love",
author: "Andy Cohen",
numOfPages: 384,
publisher: "Henry Holt and Co.",
rating: "3 stars"
}
let bookArr = [book, book2, book3];
let searchBtn = document.getElementById('search-button');
let found = false;
let bookSearch = function() {
found = false;
let input = document.getElementById('book-search');
for (i = 0; i < bookArr.length; i++) {
if (input.value.toLowerCase == bookArr[i].title.toLowerCase) {
found = true;
break;
}
}
if (found) {
console.log(bookArr[i]);
} else {
console.log("The book was not found.");
}
}
searchBtn.addEventListener('click', bookSearch);
<input type="text" id="book-search" placeholder="Search books...">
<button id="search-button">Search</button>
<script src="object.js"></script>
And lastly I'm new to this forum and also new to programming so I apologize if this is the wrong way of asking questions but I would really appreciate some criticism on my code and what I should do better. Thank you!
You can use Array.find()
and it's as easy as:
var book = bookArr.find(book => book.title.toLowerCase() == input.value.toLowerCase())
let book = {
title: "The 48 Laws of Power",
author: "Robert Greene",
numOfPages: 452,
publisher: "Penguin Books",
rating: "4.5 stars"
}
let book2 = {
title: "How to Catch a Turkey",
author: "Adam Wallace",
numOfPages: 40,
publisher: "",
rating: "5 stars"
}
let book3 = {
title: "Glitter Every Day: 365 Quotes from Women I Love",
author: "Andy Cohen",
numOfPages: 384,
publisher: "Henry Holt and Co.",
rating: "3 stars"
}
let bookArr = [book, book2, book3];
let searchBtn = document.getElementById('search-button');
let found = false;
let bookSearch = function() {
let input = document.getElementById('book-search');
var book = bookArr.find(book => book.title.toLowerCase() == input.value.toLowerCase())
if (book) {
console.log(book);
} else {
console.log("The book was not found.");
}
}
searchBtn.addEventListener('click', bookSearch);
<input type="text" id="book-search" placeholder="Search books...">
<button id="search-button">Search</button>
<script src="object.js"></script>