JavaScript code to locate the most pertinent strings within an array based on a specific substring

I'm working with a large array containing names of people, such as:

let names = [
   "John Brown", 
   "Tristan Black", 
   "Carl Jobbs", 
   "Aidan Burrows", 
   "Taylor Joe"
];

When given an input, I want to return the top 5 most relevant results from this array. Currently, I am using a loop to check for names like this:

if(name.toLowerCase().includes(input.toLowerCase()))
{
    console.log("Found match : " + name);
}

However, this method is not effective in finding the most relevant search results as it matches any name with the input in it.

My ideal solution would be to iterate through the array of names and identify the top 5 results that are most similar to the input. How can I achieve this?

Answer №1

Based on my understanding of your query, the following function should meet your requirements:

function searchByName(input, nameList) {
  
  return nameList.filter(name => (name.toLowerCase().includes(input.toLowerCase())))
}

let names = ["Sarah Smith", "Michael Johnson", "Emily White", "Adam Brown", "Olivia Green"];

console.log('Matches for Emm:', searchByName('Emm', names))
console.log('Matches for John:', searchByName('John', names))
console.log('Matches for Mic:', searchByName('Mic', names))

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Dividing the JSON dataset into smaller segments

Here is an example demonstrating how to split the JSON data: var data = [ { BankName: 'SBI', IFSC: 'SBIN0002688' }, { BankName: 'ICICI', IFSC: 'ICIC0003931', MICR: '500229094'}, { BankName: 'RBI ...

How to retrieve an element from an array within an object by utilizing v-for in Vue.js

Currently, I am working on displaying the names of each budget by using v-for. I have a vuex getter set up to retrieve the budgets associated with a user; however, it returns each object within the array. How can I specifically access the name of each budg ...

When an image is clicked, I am attempting to access data from a Sharepoint list

In my Sharepoint list, there are three columns: Image, Title, and Description. I am using ajax to retrieve the items from the list. The images can be successfully retrieved, but my goal is to display the title and description of the clicked image when an ...

Identifying keystrokes and triggering audio in Vue.js

Utilizing vue.js, the code snippet provided enables sound playback upon each button click. I am curious about how one can detect a keyboard press event to play a sound when the DOM is ready rather than waiting for button clicks. For instance, triggering ...

To enable RTL in TextField, please note that the JssProvider is only available in "react-jss/src/JssProvider" and not in "react-jss/lib/JssProvider"

Seeking help to convert LTR to RTL in the following code: <TextField id="date" label="EmployeeDate" type="date" onChange= ...

Transferring information from a server action to a server component

Is there a way to transfer data from my server action, specifically the value of the temperature variable, to the Home server component in my nextJS14 app? I want to display this value in the jsx of my Home server component. How can I achieve this? impor ...

When setting an empty URL with Fabricjs' setBackgroundImage function, a null reference error occurs in the _setWidthHeight

Recently, I stumbled upon an article detailing a method to clear the background of a fabric canvas... canvas.setBackgroundImage('', canvas.renderAll.bind(canvas)); In the development of my online design tool which utilizes Fabricjs 1.4.4, I have ...

Issues with nested array filtering in JS/Angular causing unexpected outcomes

I am faced with a particular scenario where I need to make three HTTP requests to a REST API. Once the data is loaded, I have to perform post-processing on the client side. Here's what I have: An array of "brands" An array of "materials" An array o ...

Using HTML Select field to make ajax calls to web services

When working with modals that contain forms to create objects for database storage, there is a Select field included. This is the code snippet for the Select field: <div class="form-group" id=existingUser> <label>Username</label> < ...

Scrolling through a list in Angular using cdk-virtual-scroll-viewport while selecting items via keyboard input

Looking to implement a customized Autocomplete feature. As the user begins typing, a small window should appear with selectable options. I want users to have the ability to navigate and select an option using their keyboard. For instance: - User types "H ...

Binding attributes in knockoutjs following an AJAX request

The objective Incorporate the attr binding of KnockoutJS following an AJAX call. The dilemma Check out the code snippet below: $.ajax({ url: "/Products/List?Output=JSON", dataType: "json", success: function (data) { $.each(data, fun ...

Craft a Flawlessly Repeating Sound Experience - Online

I'm facing a challenge in creating a flawless loop of an audio file. However, all the methods I've tried so far have resulted in a noticeable gap between the end and the start. Here are the approaches I experimented with: The first approach inv ...

Customize Your Lightbox Fields with DHXScheduler

In my JSP application for exam timetabling, I have integrated DHXScheduler and customized the lightbox to display additional information about exams using my own fields. The EventsManager class is responsible for managing events by saving, creating, and r ...

What's causing the member to be undefined?

client.on('raw', (e) => { if (e.t === 'MESSAGE_REACTION_ADD' && e.d.message_id === '813150433651851265' && e.d.emoji.name === "✅" ) { const guild = client.guilds.cache.get(e.d.gui ...

Issue with Responsive Font Size functionality in Tailwind and ReactJS not functioning as expected

I'm really struggling with this issue. I grasp the concept of mobile-first design and have successfully made my website's layout responsive. However, I'm having trouble getting the font size to change when applying breakpoints as the screen ...

Tips for converting Javascript require to Typescript import using the const keyword

Recently, I've been attempting to import faktory_worker_node from github.com/jbielick/faktory_worker. The README provides the following instructions: const faktory = require('faktory-worker'); faktory.register('ResizeImage', asyn ...

Thymeleaf not triggering JQuery click event

Currently working on a Spring Boot site where I have a list of elements, each containing a link. The goal is to trigger a javascript function when these links are clicked. <div class="col-sm-4" th:each="product : ${productsList}"> <!-- Code... ...

Concealing items in a loop using Javascript

I need assistance with this issue. I am trying to hide text by clicking on a link, but it doesn't seem to be working correctly. Even though I tried the following code, I can't figure out why it's not functioning as expected. Is there a diff ...

"I am trying to figure out how to set a link to an image using JavaScript. Can someone help me

I need help figuring out how to insert an image or gif file within two inverted commas '' in this line of code: _("status").innerHTML = ''; (line number 13 in the actual code) Your assistance with this question would be greatly appreci ...

modifying the placeholder font and relocating chips/tags beneath the search bar

I'm encountering some challenges with material-ui that I could use assistance with. Firstly, is there a method to have the tags/chips displayed below the search bar instead of above it? Additionally, I've been attempting to italicize and adjust ...