Сортируйте массив javascript, чтобы пустые значения всегда были внизу

Итак, у меня есть массив массивов, который содержит только строки. Массив массивов должен отображаться в виде таблицы и может содержать более 1000 строк с 20 или более значениями в каждом.

например:

var arr = [
    ["bob","12","yes"],
    ["joe","","no"],
    ["tim","19","no"],
    ["dan","","yes"],
    ["tim","",""],
    ["dan","0",""]
]

строки могут содержать все, что может быть представлено в виде строки, включая: " ", "", "0" или "00-00-00" и т.д.... и любой столбец my, который будет использоваться для упорядочения.

Я сортирую массивы по возрастанию и убыванию, но некоторые из значений, которые я сортирую, - это пустые строки: "". Как я могу получить пустые строки (только), чтобы всегда быть в конце новых массивов во всех современных браузерах?

в настоящее время они находятся в конце при восходящем, но в начале при спуске.

Я сортирую, как показано ниже (Да, я уверен, что тоже могу сделать это короче):

if (direction == "asc") {
    SortedArr = arr.sort(function (a, b) {
        if (a[colToSortBy] == '') {
            return -1;
        }
        if (a[colToSortBy].toUpperCase() < b[colToSortBy].toUpperCase()) {
            return -1;
        }
        if (a[colToSortBy].toUpperCase() > b[colToSortBy].toUpperCase()) {
            return 1;
        }
        return 0;
    });
} else {
    SortedArr = arr.sort(function (a, b) {
        if (a[colToSortBy] == '') {
            return -1;
        }
        if (b[colToSortBy].toUpperCase() < a[colToSortBy].toUpperCase()) {
            return -1;
        }
        if (b[colToSortBy].toUpperCase() > a[colToSortBy].toUpperCase()) {
            return 1;
        }
        return 0;
    });
}

Ответы

Ответ 1

Пустые строки в конце

Рабочий пример на JSFiddle, который всегда ставит пустые строки в конце независимо от того, идет ли порядок вверх или вниз. Это может быть проблемой юзабилити, но это решение:

if (direction == "asc") {
    SortedArr = arr.sort(function (a, b) {
        return (a[col] || "|||").toUpperCase().localeCompare((b[col] || "|||").toUpperCase())
    });
} else {
    SortedArr = arr.sort(function (a, b) {
        return (b[col] || "!!!").toUpperCase().localeCompare((a[col] || "!!!").toUpperCase())
    });
}

Ответ 2

Я думаю, ваша проблема связана с тем, что вы проверяете, является ли a[colToSortBy] строка emtpy, но вы не делаете этого для b[colToSortBy].

Ответ 3

Я пишу приложение, которое должно работать на IE, FF, Safari, Chrome, Opera, Desktop, планшет (включая iPad) и телефоны (включая iPhone). Это означает, что я продолжаю тестирование в браузерах. Таким образом, я обнаружил, что моя процедура сортировки ниже работала неправильно в FF, пока я не добавил часть "нового раздела" кода. Причина в том, что я не занимался сортировкой, когда числовое значение не задано (тире, -). FF также неправильно работал с отрицательными (-) значениями. Этот код теперь отлично работает:

if (SortByID == 0) {                //string values (Bank Name)
    myValues.sort( function (a,b) {
        var nameA = a[SortByID].toUpperCase(), nameB = b[SortByID].toUpperCase();
        if (SortOrderID == 1) {         //sort string ascending
            if (nameA < nameB) { return -1; } else { if (nameA > nameB) { return 1; } }
        } else {                        //sort string descending
            if (nameA < nameB) { return 1; } else { if (nameA > nameB) { return -1; } }
        }
        return 0                    //default return value (no sorting)
    })
} else {                            //numeric values (Items)
    myValues.sort(function (a, b) {
        if (isNumber(a[SortByID]) && isNumber(b[SortByID])) { //
            if (SortOrderID == 1) { //sort number ascending
                return parseFloat(a[SortByID]) - parseFloat(b[SortByID]);
            } else {                //sort string descending
                return parseFloat(b[SortByID]) - parseFloat(a[SortByID]);
            }
        } else { //one of the values is not numeric
            //new section
            if (!isNumber(a[SortByID])) {
                if (SortOrderID == 1) { //sort number ascending
                    return -1;
                } else {                //sort number descending
                    return 1;
                }
            } else {
                if (!isNumber(b[SortByID])) {
                    if (SortOrderID == 1) { //sort number ascending
                        return 1;
                    } else {                //sort number descending
                        return -1;
                    }
                }
            }//New section
            return 0;
        }
    })
}

Я знаю, что это долго, но мне достаточно просто понять. Я надеюсь, что это также касается проблемы браузера, поднятой Крисом Дж. * isNumber - это простое тестирование функции, если значение! isNAN

Ответ 4

Я использовал этот способ в своем приложении...

Вы можете настроить его, чтобы получить благоприятный результат. у нас также есть Number.MAX_SAFE_INTEGER

var arr = [10, "", 8, "", 89, 72]

var min = Number.MIN_SAFE_INTEGER

var sorted = arr.sort(function (a,b) {
  return (a || min) - (b || min)
})

var cons = document.getElementById("console")

cons.innerText = "Ascending " + JSON.stringify(sorted) + "\n" + "Descending " +  JSON.stringify(sorted.reverse())

<html>
  <head></head>
  <body>
    <p id="console"></p>
  </body>
</html>