array sorting by priority (same index chars)

Question

I have an input element and when the user types on it my code searches through an array for the input value and prints its element if it exists and it works fine. The problem is when I'm printing it I want to sort the final array alphabetically but also I want the searched strings index value position matches to come up first, alphabetically, then the rest after them. To explain this better say my array is ['testB', 'testD', 'testC', 'dtest', 'cTest'] and the user searched for test I want the final response array to be ["testB","testC","testD", "cTest", "dtest"] is kind of sorted but it gives priority to same index positioned characters. How can I achieve this?

const myArray = ['testB', 'testD', 'testC', 'dtest', 'cTest']
let tempArray = []

$('input').on('input', function() {
  tempArray = []
  for (var i = 0; i < myArray.length; i++) {
    if (myArray[i].toLowerCase().includes($(this).val().toLowerCase())) {
      tempArray.push(myArray[i])
    }
  }
  //I want it to write ["testB","testC","testD", "cTest", "dtest"]
  $('p').html(JSON.stringify(tempArray.sort()))
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input />
<p></p>

Use a custom sort: How to define custom sort function in javascript? — Heretic Monkey
– Heretic Monkey, Commented Jul 19, 2022 at 14:23
I didn't really get your logic but this sorts your example array in the same way you want myArray.sort().reverse(); — Deniz Karadağ
– Deniz Karadağ, Commented Jul 19, 2022 at 14:23

R4ncid · Accepted Answer · 2022-07-20 06:50:28Z

1

you can do something like this

const myArray = ['testB', 'testD', 'testC', 'dtest', 'cTest']
let tempArray = []

$('input').on('input', function() {
  
  const val = $(this).val().toLowerCase()
  tempArray = myArray.filter(a => a.toLowerCase().includes(val))
  //I want it to write ["testB","testC","testD", "cTest", "dtest"]
  const startsWith = (string, value) => string.substring(0, value.length).toLowerCase() === value
 
  $('p').html(JSON.stringify(tempArray.sort((a, b) => {
      const aStartsWith = startsWith(a, val)
      const bStartsWith = startsWith(b, val)

      if( aStartsWith && !bStartsWith){
        return -1
      }else if (!aStartsWith && bStartsWith){
        return 1;
      }
     
      return b > a?-1:1
  })))
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input />
<p></p>

edit Tried with the array @seriously said that fails but it seems to work fine

const myArray = ['the big bang theory', 'the office', 'top gun 2 maverick', 'the man from toronto', 'the bad guys']
let tempArray = []

$('input').on('input', function() {
  
  const val = $(this).val().toLowerCase()
  tempArray = myArray.filter(a => a.toLowerCase().includes(val))
  //I want it to write ["testB","testC","testD", "cTest", "dtest"]
  const startsWith = (string, value) => string.substring(0, value.length).toLowerCase() === value
 
  $('p').html(JSON.stringify(tempArray.sort((a, b) => {
      const aStartsWith = startsWith(a, val)
      const bStartsWith = startsWith(b, val)

      if( aStartsWith && !bStartsWith){
        return -1
      }else if (!aStartsWith && bStartsWith){
        return 1;
      }
     
      return b > a?-1:1
  })))
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input />
<p></p>

edited Jul 20, 2022 at 6:50

answered Jul 19, 2022 at 14:48

R4ncid

7,1651 gold badge8 silver badges21 bronze badges

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

6 Comments

CcmU Over a year ago

Remember that, as I quote from the docs of Array.prototype.sort(), “A comparator conforming to the constraints above will always be able to return all of 1, 0, and -1, or consistently return 0.”. So, for completeness, you should convert the last ternary operator into ifs.

R4ncid Over a year ago

@CcmU you're right but is pretty pointless in this case given that if the the string are equals it does't matter which come first

seriously Over a year ago

This fails!! Try setting myArray = ['the big bang theory', 'the office', 'top gun 2 maverick', 'the man from toronto', 'the bad guys']

R4ncid Over a year ago

@seriously what do you mean with it fails? I tried to change with the array as you said and it seems to work fine

seriously Over a year ago

@R4ncid no it doesn't the sorted array returns ['the bad guys', 'the man from toronto', 'the big bang theory', 'the office', 'top gun 2 maverick' ]

|

BigLiao · Accepted Answer · 2022-07-20 01:56:35Z

0

The key point of sort is compare function. For element a and b, which one has higher priority? There are three principe as your description:

element contains search string has higher priority then not;
if both element contain the search string, the lower index has higher priority;
if index of search string is the same, then compare the two string element, with > operator.

If only want items contain the search value, you can add a filter before sort.

var search = 'test';

function compare(a, b) {
  var indexA = a.indexOf(search);
  var indexB = b.indexOf(search);
  
  if (indexA === indexB) {
    return a > b ? 1 : -1;
  }
  if (indexA === -1) {
    return 1;
  }
  if (indexB === -1) {
    return -1;
  }
  return indexA > indexB ? 1 : -1;
}

var arr = ['testB','AString', 'somthing', 'testC', 'testD', 'test1', 'Ctest', 'Atest', 'ADtest', 'ABtest'];

// filter search value before sort
function searchResult(arr) {
  return arr.filter(item => item.includes(search)).sort(compare);
}

console.log('result:', arr.sort(compare));
console.log('searchResult:', searchResult(arr));

edited Jul 20, 2022 at 1:56

answered Jul 19, 2022 at 14:51

BigLiao

5613 silver badges10 bronze badges

2 Comments

seriously Over a year ago

if your set var search = 'a'; and run your function the return array will have items that don't even include the char a

BigLiao Over a year ago

@seriously If only want items contains search value, you can add a filter before sort. Updated my answer.

Collectives™ on Stack Overflow

array sorting by priority (same index chars)

2 Answers 2

6 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related