Javascript sort array: Array.prototype.sort() — Веб-технологии для разработчиков
Совет: как отсортировать массив объектов в JavaScript
Если у вас есть массив объектов, которые вам нужно отсортировать в определенном порядке, у вас может возникнуть желание найти библиотеку JavaScript. Но прежде чем вы это сделаете, помните, что вы можете сделать довольно аккуратную сортировку с помощью встроенной функции Array.sort .
В этой статье мы покажем вам, как сортировать массив объектов в JavaScript без суеты и беспокойства.
Для продолжения вам понадобится знание основных концепций JavaScript, таких как объявление переменных, функций записи и условных операторов. Мы также будем использовать синтаксис ES6. Вы можете получить дополнительную информацию об этом через нашу обширную коллекцию руководств ES6 . Эта популярная статья была обновлена в ноябре 2019 года.
Основная сортировка массива
По умолчанию функция JavaScript Array.sort
кодов Unicode .
const foo = [9, 1, 4, 'zebroid', 'afterdeck'];
foo.sort();
const bar = [5, 18, 32, new Set, { user: 'Eleanor Roosevelt' }];
bar.sort();
Вы можете быть удивлены, почему 32 предшествует 5. Не логично, а? Ну, на самом деле это так. Это происходит потому, что каждый элемент в массиве сначала преобразуется в строку, а "32"
"5"
Стоит также отметить, что в отличие от многих других функций массива JavaScript, Array.sort
const baz = ['My cat ate my homework', 37, 9, 5, 17];
baz.sort();
console.log(baz);
Чтобы избежать этого, вы можете создать новый экземпляр массива для сортировки и изменить его. Это возможно с помощью метода массива, который возвращает копию массива. Например, Array.slice :
const sortedBaz = baz.slice().sort();
Или, если вы предпочитаете более новый синтаксис, вы можете использовать оператор распространения для того же эффекта:
const sortedBaz = [. ..baz].sort();
Вывод одинаков в обоих случаях:
console.log(baz);
console.log(sortedBaz);
Попробуйте это
Использование Array.sort
К счастью, функция принимает необязательный параметр compareFunction
Использование функций сравнения для сортировки
Допустим, что foo
bar
- меньше 0 —
foo
bar
- больше 0 —
bar
foo
- равно 0 —
foo
bar
Давайте рассмотрим простой пример с массивом чисел:
const nums = [79, 48, 12, 4];
function compare(a, b) {
if (a > b) return 1;
if (b > a) return -1;
return 0;
}
nums.sort(compare);
Мы можем немного изменить рефакторинг, так как вычитание a
b
function compare(a, b) {
return a - b;
}
Теперь это хороший кандидат на функцию стрелки:
nums. sort((a, b) => a - b);
Если вы не знакомы с функциями стрелок, вы можете прочитать о них здесь: Функции стрелок ES6: толстый и краткий синтаксис в JavaScript .
Как отсортировать массив объектов в JavaScript
Теперь давайте посмотрим на сортировку массива объектов. Для этой демонстрации мы будем использовать массив певцов:
const singers = [
{ name: 'Steven Tyler', band: 'Aerosmith', born: 1948 },
{ name: 'Karen Carpenter', band: 'The Carpenters', born: 1950 },
{ name: 'Kurt Cobain', band: 'Nirvana', born: 1967 },
{ name: 'Stevie Nicks', band: 'Fleetwood Mac', born: 1948 },
];
Мы можем использовать следующую функцию compare
function compare(a, b) {
const bandA = a.band.toUpperCase();
const bandB = b.band.toUpperCase();
let comparison = 0;
if (bandA > bandB) {
comparison = 1;
} else if (bandA < bandB) {
comparison = -1;
}
return comparison;
}
singers. sort(compare);
Чтобы изменить порядок сортировки, вы можете инвертировать возвращаемое значение функции compare
function compare(a, b) {
...
return comparison * -1;
}
Попробуйте это
Создание функции динамической сортировки
Давайте закончим, сделав это более динамичным. Давайте создадим функцию сортировки, которую вы можете использовать для сортировки массива объектов, значениями которых являются либо строки, либо числа. Эта функция имеет два параметра — ключ, по которому мы хотим отсортировать, и порядок результатов (т. Е. Возрастания или убывания):
const singers = [
{ name: 'Steven Tyler', band: 'Aerosmith', born: 1948 },
{ name: 'Karen Carpenter', band: 'The Carpenters', born: 1950 },
{ name: 'Kurt Cobain', band: 'Nirvana', born: 1967 },
{ name: 'Stevie Nicks', band: 'Fleetwood Mac', born: 1948 },
];
function compareValues(key, order = 'asc') {
return function innerSort(a, b) {
if (!a. hasOwnProperty(key) || !b.hasOwnProperty(key)) {
return 0;
}
const varA = (typeof a[key] === 'string')
? a[key].toUpperCase() : a[key];
const varB = (typeof b[key] === 'string')
? b[key].toUpperCase() : b[key];
let comparison = 0;
if (varA > varB) {
comparison = 1;
} else if (varA < varB) {
comparison = -1;
}
return (
(order === 'desc') ? (comparison * -1) : comparison
);
};
}
И вот как вы бы это использовали:
singers.sort(compareValues('band'));
singers.sort(compareValues('band', 'desc'));
singers.sort(compareValues('name'));
singers.sort(compareValues('born', 'desc'));
Попробуйте это
В приведенном выше коде метод hasOwnProperty используется для проверки того, определено ли указанное свойство для каждого объекта и не было ли оно унаследовано через цепочку прототипов. Если он не определен для обоих объектов, функция возвращает 0
Оператор typeof также используется для проверки типа данных значения свойства. Это позволяет функции определить правильный способ сортировки массива. Например, если значением указанного свойства является string
toUpperCase
Вы можете настроить вышеупомянутую функцию для учета других типов данных и любых других потребностей вашего скрипта.
String.prototype.localeCompare ()
В нашем примере выше мы хотим иметь возможность сортировать массив объектов, значениями которых являются либо строки, либо числа. Однако, если вы знаете, что будете иметь дело только с объектами, значениями которых являются строки, вы можете немного привести в порядок код с помощью метода JavaScript localeCompare
Этот метод возвращает число, указывающее, идет ли строка до, после или совпадает с заданной строкой в порядке сортировки. Это позволяет без учета регистра сортировать массив:
['bjork', 'Bjork', 'Björk'].sort();
['bjork', 'Bjork', 'Björk'].sort((a, b) => a.localeCompare(b));
С точки зрения нашей функции compareValues
function compareValues(key, order = 'asc') {
return function innerSort(a, b) {
if (!a. hasOwnProperty(key) || !b.hasOwnProperty(key)) return 0;
const comparison = a[key].localeCompare(b[key]);
return (
(order === 'desc') ? (comparison * -1) : comparison
);
};
}
Вы можете прочитать больше о localeCompare на MDN .
Вывод
Итак, у вас есть это — краткое введение в сортировку массива объектов с использованием ванильного JavaScript. Хотя многие библиотеки предлагают такую возможность динамической сортировки, как показано, не так уж сложно реализовать эту функцию самостоятельно. Плюс хорошо понимать, что происходит под капотом.
JavaScript | Массивы
Мы запустили ТГ-канал по урокам C#
Toggle navigation
Professor Web
- C# 5.0 и .NET 4.5
- Руководство C# — Часть 1
- Руководство C# — Часть 2
- Основы . NET
- Сборки .NET
- Потоки и файлы
- Работа с сетью
- Оптимизация приложений
- WPF
- Основа WPF
- Элементы управления WPF
- Привязка и стили
- Графика и анимация
- Шаблоны WPF
- Периферия WPF
- Темы WPF
- Dark Blue UI
- Dark Orange UI
- Silverlight 5
- Работа с БД
- ADO.NET
- Entity Framework 6
- SQL Server 2012
- Оконные функции
- LINQ
- LINQ to Objects
- LINQ to XML
- LINQ to DataSet и SQL
- LINQ to Entities
- Parallel LINQ
- ASP. NET
- Основы ASP.NET
- Веб-сайты
- Безопасность
- Интернет магазин
- ASP.NET Web Forms 4.5
- ASP.NET MVC 5
- Аутентификация
- Windows 8/10
- WinRT — основы
- WinRT — расширения
- Программы
- Expression Blend 4
- Visual Studio
JavaScript: методы массива — dr.Brain
Для хранения наборов значений в JavaScript существует специальный тип данных, называемый массив (array). Массивы имеют встроенные свойства и методы, с помощью которых можно удалять, добавлять и сортировать элементы, а так же проводить иные манипуляции. Хорошее знание методов массивов в JavaScript, несомненно, повышает профессиональный уровень веб-разработчика.
В этой статье мы рассмотрим 15 методов, которые помогут Вам правильно работать с наборами данных в массивах.
Содержание
Внимание. В данной статье для функций применяется упрощенный синтаксис. Например:
// Вместо традиционной записи
myAwesomeArray.some(test => {
if (test === "d") {
return test
}
})
// мы будем использовать сокращения
myAwesomeArray.some(test => test === "d")
some()
Этот метод проверяет массив на соответствие условиям функции, полученной в качестве параметра. Он возвращает true
, если хотя бы один элемент соответствует условиям, в противном случае он возвращает false
.
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray. some(test => test === "d")
// результат : true
reduce()
Этот метод получает в качестве параметра функцию reducer, которая имеет аргументы accumulator и currentValue. Данная функция применяется к каждому элементу массива слева-направо, возвращая одно результирующее значение.
const myAwesomeArray = [1, 2, 3, 4, 5]
myAwesomeArray.reduce((total, value) => total * value)
// 1 * 2 * 3 * 4 * 5
// результат: 120
every()
Этот метод проверяет массив на соответстиве условиях функции, полученной в качестве параметра. Он возвращает true
, если каждый элемент массива соответствует условиям функции, если хотя бы один элемент не проходит проверку, возвращается false
.
const myAwesomeArray = ["a", "b", "c", "d", "e"]
myAwesomeArray.every(test => test === "d")
// результат: false
const myAwesomeArray2 = ["a", "a", "a", "a", "a"]
myAwesomeArray2. every(test => test === "a")
// результат: true
map()
Этот метод получает функцию в качестве параметра и возвращает новый массив, который содержит образ каждого элемента массива. map всегда возвращает новый массив с определенным набором элементов.
const myAwesomeArray = [5, 4, 3, 2, 1]
myAwesomeArray.map(x => x * x)
// результат:
// 25
// 16
// 9
// 4
// 1
flat()
Этот метод создает новый массив, который содержит элементы вложенных массивов, то есть повышает уровень вложенности массивов, которые в свою очередь являются элементами массива (по умолчанию только на один уровень).
const myAwesomeArray = [[1, 2], [3, 4], 5]
myAwesomeArray.flat()
// результат: [1, 2, 3, 4, 5]
filter()
Этот метод получает функцию, как параметр, и возвращает новый массив, который содержить все элементы исходного массива, удовлетворяющие условиям этой функции.
const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
{ id: 4, name: "Mass" },
]
myAwesomeArray. filter(element => element.name === "Mass")
// результат:
// 0:{id: 3, name: "Mass"},
// 1:{id: 4, name: "Mass"}
forEach()
Этот метод применяет функцию к каждому элементу массива.
const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
]
myAwesomeArray.forEach(element => console.log(element.name))
// результат:
// john
// Ali
// Mass
findindex()
Этот метод получает функцию в качестве параметра и применяет ее к массиву, возвращая индекс элемента, соответствующего условиям функции — аргумента, или -1
, если ни один элемент не соответствует необходимым условиям.
const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
]
myAwesomeArray.findIndex(element => element.id === 3)
// результат: 2
myAwesomeArray.findIndex(element => element.id === 7)
// результат: -1
find()
Этот метод получает функцию в качестве параметра и применяет ее к массиву, возвращая значение элемента массива, соответствующего условиям функции — аргумента, в остальных случаях метод возвращает undefined
.
const myAwesomeArray = [
{ id: 1, name: "john" },
{ id: 2, name: "Ali" },
{ id: 3, name: "Mass" },
]
myAwesomeArray.find(element => element.id === 3)
// результат: {id: 3, name: "Mass"}
myAwesomeArray.find(element => element.id === 7)
// результат: undefined
sort()
Этот метод получает функцию в качестве параметра и возвращает отсортированный массив.
const myAwesomeArray = [5, 4, 3, 2, 1]
// Сортируем от меньшего значения к большему
myAwesomeArray.sort((a, b) => a - b)
// результат: [1, 2, 3, 4, 5]
// Сортируем от большего значения к меньшему
myAwesomeArray.sort((a, b) => b - a)
// результат: [5, 4, 3, 2, 1]
concat()
Этот метод объединяет два и более массивов или значений, возвращая новый массив, состоящий из объединенных элементов.
const myAwesomeArray = [1, 2, 3, 4, 5]
const myAwesomeArray2 = [10, 20, 30, 40, 50]
myAwesomeArray.concat(myAwesomeArray2)
// результат: [1, 2, 3, 4, 5, 10, 20, 30, 40, 50]
fill()
Этот метод заполняет одним значением определенные элементы массива: от начального индекса до конечного. По умолчанию новым значением заполняются все элементы массива.
const myAwesomeArray = [1, 2, 3, 4, 5]
// Первый (обязательный) аргумент (0) - новое значение элемента массива
// Второй (необязательный) аргумент (1) - начальный индекс
// Третий (необязательный) аргумент (3) - конечный индекс, при заполнение не включается в группу элементов с новым значением
myAwesomeArray.fill(0, 1, 3)
// результат: [1, 0, 0, 4, 5]
includes()
Этот метод возвращает true
, если массив содержит элемент, указанный в качестве аргумента, и false
, если элементв в массиве нет.
const myAwesomeArray = [1, 2, 3, 4, 5]
myAwesomeArray.includes(3)
// результат: true
myAwesomeArray.includes(8)
// результат: false
reverce()
Этот метод разворачивает массив: первый элемент становится последним, а последний — первым.
const myAwesomeArray = ["e", "d", "c", "b", "a"]
myAwesomeArray.reverse()
// результат: ['a', 'b', 'c', 'd', 'e']
flatMap()
Этот метод применяет функцию к каждому элементу массива и возвращает результаты для каждого элемента в виде нового массива. Можно сказать, что он является комбинацией методов flat() и Map().
const myAwesomeArray = [[1], [2], [3], [4], [5]]
myAwesomeArray.flatMap(arr => arr * 10)
// результат: [10, 20, 30, 40, 50]
// With .flat() and .map()
myAwesomeArray.flat().map(arr => arr * 10)
// результат: [10, 20, 30, 40, 50]
Спасибо за внимание.
Сортировка массива объектов с помощью JavaScript Array.prototype.sort ()
Если вам нужно отсортировать массив объектов в определенном порядке, у вас может возникнуть соблазн обратиться к библиотеке JavaScript. Но прежде чем вы это сделаете, помните, что вы можете провести довольно аккуратную сортировку с помощью встроенной функции Array.sort.
В этой статье мы покажем вам, как сортировать массив объектов в JavaScript без суеты и беспокойства.
Базовая сортировка массива
По умолчанию JavaScript Array.Функция sort
преобразует каждый элемент массива, который необходимо отсортировать, в строку и сравнивает их в порядке кодовых точек Unicode.
const foo = [9, 1, 4, 'зеброид', 'afterdeck'];
foo.sort ();
const bar = [5, 18, 32, новый набор, {пользователь: 'Элеонора Рузвельт'}];
bar.sort ();
Вам может быть интересно, почему 32 идет перед 5. Не логично, да? Что ж, на самом деле это так. Это происходит потому, что каждый элемент в массиве сначала преобразуется в строку, а "32"
предшествует "5"
в порядке Unicode.
Также стоит отметить, что в отличие от многих других функций массива JavaScript, Array.sort
фактически изменяет или мутирует сортируемый массив.
const baz = ['Моя кошка съела мою домашнюю работу', 37, 9, 5, 17];
baz.sort ();
console.log (baz);
Чтобы избежать этого, вы можете создать новый экземпляр массива для сортировки и изменить его. Это возможно с использованием метода массива, который возвращает копию массива. Например, Array.slice:
.
const sortedBaz = baz. срез (). сортировка ();
Или, если вы предпочитаете более новый синтаксис, вы можете использовать оператор распространения для того же эффекта:
константа sortedBaz = [... baz] .sort ();
Результат одинаков в обоих случаях:
console.log (baz);
console.log (sortedBaz);
Попробовать
См. Pen
MWWqbKY от SitePoint (@SitePoint)
на CodePen.
Использование Array.sort Само по себе
не очень полезно для сортировки массива объектов.К счастью, функция принимает необязательный параметр compareFunction
, который вызывает сортировку элементов массива в соответствии с возвращаемым значением функции сравнения.
Использование функций сравнения для сортировки
Предположим, что foo
и bar
— это два элемента, которые сравниваются функцией сравнения, и возвращаемое значение функции сравнения устанавливается следующим образом:
- меньше 0 —
foo
предшествуетбар
- больше 0 —
бар
предшествуетfoo
- равны 0 —
foo
иbar
остаются неизменными относительно друг друга.
Рассмотрим простой пример с массивом чисел:
константы = [79, 48, 12, 4];
function compare (a, b) {
если (а> б) вернуть 1;
если (b> a) вернуть -1;
возврат 0;
}
nums.sort (сравнить);
Мы можем немного реорганизовать это, так как вычитание a
из b
также даст нам возвращаемое значение:
функция compare (a, b) {
вернуть a - b;
}
Теперь это хороший кандидат на функцию стрелки:
кол.sort ((a, b) => a - b);
Если вы не знакомы со стрелочными функциями, вы можете узнать о них больше здесь: ES6 Arrow Functions: Fat and Concise Syntax in JavaScript.
Как отсортировать массив объектов в JavaScript
Теперь давайте рассмотрим сортировку массива объектов. Для этого демо мы будем использовать набор исполнителей:
const singers = [
{имя: 'Стивен Тайлер', группа: 'Aerosmith', год рождения: 1948},
{имя: 'Карен Карпентер', группа: 'The Carpenters', год рождения: 1950},
{имя: 'Курт Кобейн', группа: 'Нирвана', год рождения: 1967},
{имя: 'Стиви Никс', группа: 'Fleetwood Mac', год рождения: 1948},
];
Мы можем использовать следующую функцию compare
, чтобы отсортировать этот массив певцов по их группе:
функция compare (a, b) {
const bandA = a. band.toUpperCase ();
const bandB = b.band.toUpperCase ();
пусть сравнение = 0;
if (bandA> bandB) {
сравнение = 1;
} else if (bandA
Чтобы изменить порядок сортировки, вы можете инвертировать возвращаемое значение функции compare
:
функция compare (a, b) {
...
вернуть сравнение * -1;
}
Попробовать
См. Pen
GRRXNvY от SitePoint (@SitePoint)
на CodePen.
Создание функции динамической сортировки
Давайте закончим, сделав это более динамичным. Давайте создадим функцию сортировки, которую вы можете использовать для сортировки массива объектов, значения которых являются строками или числами. Эта функция имеет два параметра - ключ, по которому мы хотим выполнить сортировку, и порядок результатов (т. е. по возрастанию или по убыванию):
const singers = [
{имя: 'Стивен Тайлер', группа: 'Aerosmith', год рождения: 1948},
{имя: 'Карен Карпентер', группа: 'The Carpenters', год рождения: 1950},
{имя: 'Курт Кобейн', группа: 'Нирвана', год рождения: 1967},
{имя: 'Стиви Никс', группа: 'Fleetwood Mac', год рождения: 1948},
];
function compareValues (key, order = 'asc') {
return function innerSort (a, b) {
если.hasOwnProperty (ключ) || ! b.hasOwnProperty (ключ)) {
возврат 0;
}
const varA = (тип [ключа] === 'строка')
? a [ключ] .toUpperCase (): a [ключ];
const varB = (typeof b [ключ] === 'строка')
? b [ключ] .toUpperCase (): b [ключ];
пусть сравнение = 0;
if (varA> varB) {
сравнение = 1;
} else if (varA
И вот как бы вы его использовали:
певцы. sort (compareValues ('группа'));
singers.sort (compareValues ('группа', 'desc'));
singers.sort (compareValues ('имя'));
singers.sort (compareValues ('родился', 'desc'));
Попробовать
См. Pen
OJJopmx от SitePoint (@SitePoint)
на CodePen.
В приведенном выше коде метод hasOwnProperty используется для проверки того, определено ли указанное свойство для каждого объекта и не было ли оно унаследовано через цепочку прототипов. Если он не определен для обоих объектов, функция возвращает 0
, в результате чего порядок сортировки остается неизменным (т.е.е. объекты остаются неизменными по отношению друг к другу).
Оператор typeof также используется для проверки типа данных значения свойства. Это позволяет функции определять правильный способ сортировки массива. Например, если значением указанного свойства является строка
, метод toUpperCase
используется для преобразования всех его символов в верхний регистр, поэтому регистр символов при сортировке игнорируется.
Вы можете настроить указанную выше функцию для соответствия другим типам данных и любым другим потребностям вашего скрипта.
String.prototype.localeCompare ()
В нашем примере выше мы хотим иметь возможность сортировать массив объектов, значения которых являются строками или числами. Однако если вы знаете, что будете иметь дело только с объектами, значения которых являются строками, вы можете немного привести код в порядок, используя метод JavaScript localeCompare
.
Этот метод возвращает число, указывающее, идет ли строка до, после или совпадает с данной строкой в порядке сортировки. Он обеспечивает сортировку массива без учета регистра:
['bjork', 'Bjork', 'Björk'].Сортировать();
['bjork', 'Bjork', 'Björk']. sort ((a, b) => a.localeCompare (b));
В терминах нашей функции compareValues
это означает, что мы могли бы написать:
function compareValues (key, order = 'asc') {
return function innerSort (a, b) {
если (! a.hasOwnProperty (ключ) ||! b.hasOwnProperty (ключ)) return 0;
сравнение const = a [ключ] .localeCompare (b [ключ]);
возвращение (
(порядок === 'desc')? (сравнение * -1): сравнение
);
};
}
Вы можете узнать больше о localeCompare на MDN.
Заключение
Итак, вот оно - краткое введение в сортировку массива объектов с использованием ванильного JavaScript. Хотя многие библиотеки предлагают такую возможность динамической сортировки, как было показано, реализовать эту функцию самостоятельно не так уж и сложно. Плюс к этому хорошо понимать, что творится под капотом.
Чтобы лучше понять основы нативного JavaScript, мы рекомендуем JavaScript: от новичков до ниндзя. Изучите JavaScript, включая ES6, с нуля и примените свои новые знания на практике, создавая вместе с рядом проектов.
Сортировка массива JavaScript с использованием array.sort ()
Сортировка массива JavaScript с использованием
array.sort ()
Последнее обновление: 17 августа 2016 г.
Сортировка массивов в JavaScript выполняется методом
, метод, который, вероятно, так же неправильно понимается, как и
array.sort ()
недооценен. При вызове sort ()
просто сортирует
массив в лексикографическом (он же алфавитном) порядке, небо действительно
предел, как только вы выйдете за пределы поверхности.
Сортировка
массив в лексикографическом порядке
Сортировка массива лексикографически (иначе «по алфавиту» или
в порядке словаря) сделать несложно. Просто позвоните array.sort ()
без переданных параметров:
// Сортировка по алфавиту и по возрастанию: var myarray = ["Боб", "Хулиган", "Эми"] myarray. sort () // Теперь массив становится [«Эми», «Боб», «Хулиган»]
Обратите внимание, что порядок возрастает. Сделать это по убыванию
вместо этого самый простой способ - заручиться помощью другого метода Array в
комбинация, массив .обратный ()
:
// Сортировка по алфавиту и по убыванию: var myarray = ["Боб", "Хулиган", "Эми"] myarray.sort () myarray.reverse () // Теперь массив становится ["Bully", "Bob", "Amy"]
Теперь, прежде чем вы начнете чувствовать себя комфортно, подумайте, что
происходит, если мы вызываем array.sort ()
для массива, состоящего из
номера:
var myarray = [7, 40, 300] myarray.sort () // Теперь массив становится [300,40,7]
Хотя 7 численно меньше 40 или 300,
лексикографически он больше, поэтому 7 появляется в самом правом углу
отсортированный массив.Помните, что по умолчанию array.sort ()
сортирует свои
элементы в лексикографическом порядке.
И вот у вас есть array.sort ()
в
условия его основного использования. Но в этом методе гораздо больше, чем обычно
глаз. Array.sort ()
принимает необязательный параметр в форме
ссылки на функцию, которая в значительной степени позволяет сортировать массив на основе любых
настраиваемые критерии, такие как числовая сортировка массива или его перемешивание (рандомизация
порядок его элементов).
Проходящий
в ссылке на функцию в array.sort ()
Как уже упоминалось,
принимает необязательный параметр в виде функции
array.sort ()
ссылка (назовем ее функцией сортировки
). Формат этого
функция выглядит так:
function sortfunction (a, b) { // Сравниваем каким-то образом "a" и "b" и возвращаем -1, 0 или 1 } array.sort (функция сортировки)
Когда такая функция передается в array.sort ()
, массив
элементы сортируются на основе отношений между каждой парой элементов
« a
» и « b
» и возвращаемое значение функции. В
три возможных числа возврата: <0
(меньше 0), 0
,
или > 0
(больше 0):
- Меньше 0 : отсортируйте «
a
», чтобы получить более низкий индекс, чем «b
» - Ноль : «
a
» и «b
» должны быть
считается равным, и сортировка не выполняется. - Больше 0 : отсортируйте «
b
», чтобы получить более низкий индекс.
чем "a
".
Чтобы отсортировать массив по числам и по возрастанию, например,
тело вашей функции будет выглядеть так:
function sortfunction (a, b) {// заставляет массив сортировать численно и по возрастанию возврат (а - б) }
Подробнее об этом ниже.
Сортировка
массив в числовом порядке
Чтобы отсортировать массив в числовом порядке, просто передайте настраиваемый
функцию сортировки
в array.sort ()
, которая возвращает
разница между " a
" и " b
", два параметра
косвенно / автоматически вводится в функцию:
// Сортировка по числам и по возрастанию: var myarray = [25, 8, 7, 41] myarray. sort (function (a, b) {// Теперь массив становится [7, 8, 25, 41] возврат а - б })
Это работает именно так, потому что всякий раз, когда " a
"
меньше « b
», возвращается отрицательное значение, в результате
в меньших элементах, всегда появляющихся слева от больших, в
другими словами, по возрастанию. Обратите внимание, что мы определили нашу функцию сортировки в этом случае
непосредственно внутри метода sort ()
как анонимная функция,
вместо создания явной функции и передачи ее в sort ()
-
оба достигают одного и того же.
Сортировать массив численно, но по убыванию не так много
разные, и просто требуется поменять местами два операнда " a
" и
« b
»:
// Сортировка по количеству и по убыванию: var myarray = [25, 8, 7, 41] myarray.sort (function (a, b) {// Теперь массив становится [41, 25, 8, 7] возврат б - а })
Перемешивание
(рандомизируем) порядок массива
Чтобы рандомизировать порядок элементов в массиве, какой
нам нужно тело нашей функции сортировки
, чтобы вернуть число, которое
случайным образом <0
, 0
или > 0
,
независимо от связи между « a
» и « b
». Ниже приведен трюк:
// Рандомизируем порядок массива: var myarray = [25, 8, «Джордж», «Джон»] myarray.sort (function () {// Элементы массива теперь зашифрованы return 0.5 - Math.random () })
Интерактивная демонстрация: Сортировка или рандомизация элементов массива.
Как видите, array.sort ()
- это намного больше.
чем многие могут подумать. Фактически, вы даже можете сортировать массивы, которые содержат больше
не просто примитивные значения, а объекты со свойствами.Давайте посмотрим это дальше.
Сортировка
Массив объектов
Сортировка массива целых чисел в JavaScript и Node.js
Сортировка данных - обычная задача в программировании. JavaScript предоставляет метод .sort (компаратор)
для массивов, позволяющий сортировать данные с помощью настраиваемого компаратора . Компаратор представляет собой функцию сравнения, определяющую, какой элемент стоит перед другим.
При сортировке целых чисел удобна пользовательская функция сравнения, потому что вы можете обеспечить порядок сортировки и не полагаться на поведение сортировки JavaScript по умолчанию.
Обзор серии
Node.js
- Как проверить, пуст ли объект в JavaScript или Node.js
(Скоро будет)
Сортировка массива целых чисел
Сортировка списка чисел в JavaScript может иметь два направления.Либо отсортируйте значения по возрастанию или по убыванию. Использование метода .sort ()
для массивов JavaScript всегда будет пытаться отсортировать значения в порядке возрастания.
Использование функции сравнения при сортировке целых чисел
Использование . sort ()
для массивов без предоставления функции сравнения преобразует каждый элемент в строку. Затем JavaScript использует строковое представление каждого элемента и сравнивает их в порядке единиц кода UTF-16.
И вот в чем загвоздка. При сортировке данных вы хотите, чтобы число 9 было перед числом 80.Но поскольку JavaScript приводит оба числа к двум строкам, порядок сортировки - от Unicode, а число 80 предшествует 9.
Облом!
По этой причине вам следует сортировать целочисленные значения с помощью специального компаратора.
Сортировка по возрастанию (от наименьшего к наибольшему)
В следующем фрагменте кода показана сортировка списка целочисленных значений. Значения сортируются в порядке возрастания. Пользовательский компаратор получает два элемента массива. Вы можете обеспечить порядок возрастания, вычтя b
из a
:
.
const array = [1, 6, 4, 9, 3]
// сортируем по возрастанию (от 1 до X)
const sorted = массив. sort ((a, b) => {
возврат а - б
})
// [1, 3, 4 6, 9]
Выглядит хорошо! При желании вы можете скопировать фрагмент кода и протестировать его в инструментах разработчика вашего браузера.
Сортировать по убыванию (от большего к меньшему)
Вы также можете отсортировать список целых чисел в порядке убывания. При сортировке значений от наибольшего к наименьшему вы можете перевернуть числа при вычислении пользовательской функции сравнения:
const array = [1, 6, 4, 9, 3]
// сортируем по убыванию (от X до 1)
const sorted = массив.sort ((a, b) => {
возврат б - а
})
// [9, 6, 4, 3, 1]
Подробную информацию о Array # sort
можно найти в документации MDN.
Сортировка изменит ваш массив
При использовании метода .sort ()
следует помнить одну вещь: он изменяет ваш массив . После операции сортировки исходный массив содержит отсортированные значения.
Наслаждайтесь сортировкой!
Упомянутые ресурсы
Как сортировать массивы в JavaScript
Метод sort массива JavaScript переупорядочивает элементы в массиве, для которого он вызывается, и возвращает этот массив.Если вы не предоставите аргумент функции для метода
sort
, элементы массива будут отсортированы в соответствии с порядком в таблице символов Unicode / UTF-8. В зависимости от содержимого вашего массива это может быть не тот результат, которого вы ожидаете. Рассмотрим следующий пример:
var ar = ['яблоко', 'персик', 'вишня', 'груша', 'канталоп', 'банан'];
console.log (ar.sort ());
Обратите внимание, что все значения, начинающиеся с прописных букв, сортируются перед любыми записями, начинающимися с строчных букв.Теперь давайте посмотрим, что происходит с типом значений числового массива по умолчанию:
var ar = [37, 18,5, 22, 8, 4];
console. log (ar.sort ());
Как видно из приведенных выше примеров, для достижения желаемых результатов обычно требуется передать настраиваемую функцию методу sort
.
Определение функций для метода сортировки массива
Функция, переданная методу sort
, должна включать два аргумента для представления смежных элементов в массиве, который нужно отсортировать.Если первый аргумент должен быть отсортирован перед вторым, верните из функции -1
. Если второй аргумент должен быть отсортирован перед первым, верните 1
. [1] Если порядок сортировки не имеет значения или два значения равны, вернуть 0
.
Ниже показано, как настроить сортировку без учета регистра:
var ar = [«обезьяна», «лось», «зебра», «корова», «теленок», «горный лев», «коза»];
console.log (ar.sort (function (a, b) {
если.toLowerCase () toLowerCase ()> b.toLowerCase ()) {
возврат 1;
} else {
возврат 0;
}
}));
Чтобы выполнить сортировку без учета регистра, мы сравниваем версии двух аргументов в нижнем регистре ( a
и b
).
Далее мы демонстрируем числовую сортировку:
var ar = [37, 18,5, 22, 8, 4];
console.log (ar.sort (функция (x, y) {return x - y;}));
Также просто настроить сортировку по убыванию чисел:
var ar = [37, 18.5, 22, 8, 4];
console.log (ar.sort (функция (x, y) {return y - x;}));
Вернуться к началу
.