Difficulty find within array names in JavaScript

Question

I have an array that has several people, each with a phone number. I want to save the names in the result variable when I type part of the name, either in uppercase or lowercase, and click the search button, and circle the results in the showResultSearch function and display them on the console. Please help me to get the result

I want to get the result as I wrote it and use the this keyword in writing the function I want to get the result this way

  this.array = [
        { name: "Niloufar", phone: 123456 }, { name: "sara", phone: 123456 },
        { name: "Amir", phone: 123456 }, { name: "arman", phone: 123456 },
        { name: "Paria", phone: 123456 }, { name: "nadiya", phone: 123456 }
    ];

    const self = this
    this.search = function search() {
        function filterArray() {
            const selectInput = document.getElementById("inputSearch").value;
            const result = self.array.find(item => item.name === selectInput);
            if (result === undefined) {
                alert("No search results found");
            }
        }
        return filterArray;
    }
    this.showResultSearch = function () {
        const searchResult = self.search;
        searchResult.forEach(ele => {
            console.log(`name: ${ele.name} phone: ${ele.name}`)
        })
    }
    this.startSearch = function () {
        this.search();
        this.showResultSearch();
    }

    <form>
        <input type="text" placeholder="Search" id="inputSearch">
        <button type="button" id="BtnSearch" onclick="this.startSearch">Search</button>
    </form>

pawel · Accepted Answer · 2021-04-15 13:23:44Z

1

The Array.find callback is passed an object from your array, so in this place:

self.array.find(name => name === selectInput);

you are comparing { name: "Niloufar", phone: 123456 } to a string.

You can either write it this way:

self.array.find(item => item.name === selectInput);

or destructure the argument:

self.array.find( ({ name }) => name === selectInput);

answered Apr 15, 2021 at 13:23

pawel

37.1k7 gold badges59 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

good Over a year ago

Excuse me, my dear friend, I'm confused. Please edit my code correctly if possible. Thank you.

good Over a year ago

I did, but the result is not displayed on the console

Anuj Divkar · Accepted Answer · 2021-04-15 14:25:45Z

0

This should work

use filter instead of find.
use toUpperCase() for both comparing values

use includes instead of ===

     this.array = [
         { name: "Niloufar", phone: 123456 },
         { name: "sara", phone: 123456 },
         { name: "Amir", phone: 123456 },
         { name: "arman", phone: 123456 },
         { name: "Paria", phone: 123456 },
         { name: "nadiya", phone: 123456 },
     ];
     const self = this;
     this.search = function search() {
         function filterArray() {
             const selectInput = document.getElementById("inputSearch").value;
             const result = self.array.filter((obj) => {
             return obj.name.toUpperCase().includes(selectInput.toUpperCase())} );
             if (result === undefined || selectInput==="") {
                 alert("No search results found");
             }
             return result;
         }
         return filterArray();
     };
     this.showResultSearch = function () {
         const searchResult = self.search();
         searchResult.forEach((ele) => {
             console.log(`name: ${ele.name} phone: ${ele.phone}`);
         });
     };
     this.startSearch = function () {
         console.clear();
         this.showResultSearch();
     };

edited Apr 15, 2021 at 14:25

answered Apr 15, 2021 at 14:07

Anuj Divkar

3722 silver badges10 bronze badges

5 Comments

good Over a year ago

Thank you dear friend, your code works But the point is that I want the previous results to be deleted every time I search for a new result In this code, when the input is empty, I want alear to be displayed, but when the input is clicked, all the people in the display array

Anuj Divkar Over a year ago

@good you mean clear from the console? or remove from the array?

good Over a year ago

No I want to delete the previous results from the console and display the aleart message when the input is empty and we click

good Over a year ago

Do you understand what I mean?

Anuj Divkar Over a year ago

Edited the code. included console.clear();

Collectives™ on Stack Overflow

Difficulty find within array names in JavaScript

2 Answers 2

2 Comments

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related