How to iterate through javascript object to find multiple similar keys

Question

I have a data like this:

dictionary: [
  { mercury: 'MERC' },
  { venus: 'VEN' },
  { earth: 'EART' },
  { mars: 'MAR' },
  { jupiter: 'JUP' },
  { saturn: 'SAT' },
  { uranus: 'ANUS' },
  { neptune: 'NEP' },
  { pluto: 'PLUT' },
]

When a user types letters inside an input field like v, I want to show the closest similar string from the object, which would be 'VEN' for this, I have the following code:

let word = 'v'
let result = dictionary.find(d => {
  var str = Object.keys(d)[0]
  if (str.toLowerCase().indexOf(word.toLowerCase()) == 0) {
    return result = str
  }
})

This code works well, and result returns the found string. The problem is that when someone types m I only get MERC but I should get multiple results because mercury and mar both start with m.

Is there an way to do this with find, or other function?

If you're trying to implement autocomplete, see this jqueryui.com/autocomplete — Manuel Perez Heredia
– Manuel Perez Heredia, Commented Feb 15, 2018 at 13:15
This indexOf(word.toLowerCase()) == 0 should be indexOf(word.toLowerCase()) >= 0 — Rajesh Dixit
– Rajesh Dixit, Commented Feb 15, 2018 at 13:15
Define CLOSEST SIMILAR before doing anything else :) Is it string containing the substring as a whole, containing each character in substring, starting with substring, ending with it, both.. — CodeSmith
– CodeSmith, Commented Feb 15, 2018 at 13:19

Nina Scholz · Accepted Answer · 2018-02-15 13:18:32Z

4

You could filter the array and use just the values.

var dictionary = dictionary = [{ mercury: 'MERC' }, { venus: 'VEN' }, { earth: 'EART' }, { mars: 'MAR' }, { jupiter: 'JUP' }, { saturn: 'SAT' }, { uranus: 'ANUS' }, { neptune: 'NEP' }, { pluto: 'PLUT' }],
    word = 'm',
    result = dictionary
        .filter(d => Object.keys(d)[0].toLowerCase().startsWith(word))
        .map(o => Object.values(o)[0]);

console.log(result)

answered Feb 15, 2018 at 13:18

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

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

2 Comments

hidar Over a year ago

Thanks for the answer, do you think this method is efficient if I have like 6K word in my json file? I was told filter exits on first find so if a user was to search for a word like 'human' then every letter typed would do a loop over all 6 entries. Is there a better (optimized) way to do this without using a database?

Nina Scholz Over a year ago

please add the real data structure to the question. for really fas access. i would use a simple for loop which is faster than any array method.

gurvinder372 · Accepted Answer · 2018-02-15 13:24:52Z

3

find returns only one value.

Use Object.values and filter

var search = "m";
search = search.toLowerCase();
var output = Object.values(dictionary).map(s => Object.values(s)[0].toLowerCase()).filter(s => s.indexOf(search) == 0);
console.log( output );

Demo

var dictionary = [{
    mercury: 'MERC'
  },
  {
    venus: 'VEN'
  },
  {
    earth: 'EART'
  },
  {
    mars: 'MAR'
  },
  {
    jupiter: 'JUP'
  },
  {
    saturn: 'SAT'
  },
  {
    uranus: 'ANUS'
  },
  {
    neptune: 'NEP'
  },
  {
    pluto: 'PLUT'
  },
];
var search = "m";
search = search.toLowerCase();
var output = Object.values(dictionary).map(s => Object.values(s)[0].toLowerCase()).filter(s => s.indexOf(search) == 0);
console.log( output );

Edit

To return in the original case, use toLowerCase before doing indexOf

var output = Object.values( dictionary ).map(
       s => Object.values( s )[0] ).filter(
         s => s.toLowerCase().indexOf( search ) == 0);

edited Feb 15, 2018 at 13:24

answered Feb 15, 2018 at 13:18

gurvinder372

68.6k11 gold badges78 silver badges98 bronze badges

2 Comments

gurvinder372 Over a year ago

@Liam Sorry, but the link you have shared points to my answer itself. Didn't understood your point.

gurvinder372 Over a year ago

@Liam I think OP has mentioned because mercury and mar both start with m.

Ele · Accepted Answer · 2018-02-15 13:20:37Z

1

Using function filter to get your targets.

var dictionary = [
  { mercury: 'MERC' },
  { venus: 'VEN' },
  { earth: 'EART' },
  { mars: 'MAR' },
  { jupiter: 'JUP' },
  { saturn: 'SAT' },
  { uranus: 'ANUS' },
  { neptune: 'NEP' },
  { pluto: 'PLUT' }
];

let word = 'm';
let result = dictionary.filter(d => Object.values(d)[0].toLowerCase().indexOf(word) > -1)


 console.log(result)

If you want the values, use map function.

var dictionary = [
  { mercury: 'MERC' },
  { venus: 'VEN' },
  { earth: 'EART' },
  { mars: 'MAR' },
  { jupiter: 'JUP' },
  { saturn: 'SAT' },
  { uranus: 'ANUS' },
  { neptune: 'NEP' },
  { pluto: 'PLUT' }
];

let word = 'm';
let result = dictionary.filter(d => Object.values(d)[0].toLowerCase().indexOf(word) > -1)


 console.log(result.map((b) => Object.values(b)[0]))

edited Feb 15, 2018 at 13:20

answered Feb 15, 2018 at 13:20

Ele

33.8k7 gold badges43 silver badges80 bronze badges

1 Comment

Liam Over a year ago

what have you changed and why

Collectives™ on Stack Overflow

How to iterate through javascript object to find multiple similar keys

3 Answers 3

2 Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related