Si vous connaissez déjà les bases des tableaux JavaScript, il est temps de faire passer vos compétences au niveau supérieur avec des sujets plus avancés. Dans cette série de didacticiels, vous explorerez le sujet intermédiaire de la programmation avec des tableaux en JavaScript.
Le tri d'un tableau est l'une des tâches les plus courantes lors de la programmation en JavaScript. Par conséquent, en tant que programmeur JavaScript, il est crucial d'apprendre à trier correctement les tableaux, car vous le ferez fréquemment dans des projets du monde réel. Une mauvaise technique de tri peut vraiment ralentir votre candidature !
Dans le passé, les développeurs Web devaient utiliser des bibliothèques tierces comme jQuery et écrire beaucoup de code pour trier les valeurs dans une collection de listes. Heureusement, JavaScript a énormément évolué depuis. Vous pouvez désormais trier des tableaux JavaScript contenant des milliers de valeurs avec une seule ligne de code, sans utiliser de bibliothèques tierces.
Dans cet article, je vais vous montrer comment trier des collections de tableaux simples et complexes en JavaScript. Nous utiliserons la méthode JavaScript sort()
pour le tri :
À la fin de ce didacticiel, vous devriez avoir une compréhension approfondie du fonctionnement de la méthode sort()
de JavaScript et de la façon de l'utiliser pour trier des tableaux de nombres, de chaînes et d'objets.
sort()
MéthodesJavaScript sort()
est l'une des méthodes de tableau les plus utiles et les plus couramment utilisées en JavaScript. Il vous permet de trier rapidement et facilement un tableau d'éléments de données par ordre croissant ou décroissant.
Vous pouvez utiliser cette méthode pour trier des tableaux de nombres, de chaînes, de dates et même d'objets. La méthode sort()
fonctionne en prenant un tableau d'éléments et en les triant en fonction de certains critères. Un critère peut être une fonction, un opérateur de comparaison ou un tableau de valeurs.
Trier un tableau de nombres est très simple en utilisant la méthode sort
:
let numbers = [12, 88, 57, 99, 03, 01, 83, 21] console.log(numbers.sort()) // output [1, 12, 21, 3, 57, 83, 88, 99]
Dans le code ci-dessus, la méthode sort()
方法对numbers
trie les numéros
par ordre croissant, ce qui est le mode par défaut.
Vous pouvez également trier les nombres vers l'arrière (c'est-à-dire par ordre décroissant). Pour ce faire, vous devez créer la fonction de tri personnalisée suivante :
function desc(a, b) { return b - a }
Cette fonction accepte deux paramètres (a
et b
), qui représentent les deux valeurs à trier. Si un nombre positif est renvoyé, la méthode a
和 b
),它们代表要排序的两个值。如果返回正数,则 sort()
方法将理解 b
应在 a
之前排序。如果它返回负数,则 sort()
将理解 a
应该位于 b
之前。如果 b
> a
,则该函数将返回正数,这意味着如果 a
小于 b
,则 b
将位于 a
comprendra que b
doit être trié avant a
. S'il renvoie un nombre négatif,
a
doit précéder b
. La fonction renverra un nombre positif si b
> a
, ce qui signifie que si a
est inférieur à b
, alors b
viendra avant a
.
console.log(numbers.sort(desc)) // output [99, 88, 83, 57, 21, 12, 3, 1]
Le tri des valeurs de chaîne est tout aussi simple :
let names = ["Sam", "Koe", "Eke", "Victor", "Adam"] console.log(names.sort()) // output ["Adam", "Eke", "Koe", "Sam", "Victor"]
function descString(a, b) { return b.localeCompare(a); }
1
,这意味着第二个名称将在排序数组中排在第一位。否则,我们返回 -1
,如果两者相等,则返回 0
Si le deuxième nom vient par ordre alphabétique après le premier nom, on revient de la fonction.
names
数组运行排序方法,并以 desc
Maintenant, si vous utilisez
console.log(names.sort(descString)) // ["Victor", "Sam", "Koe", "Eke", "Adam"]
sort()
Jusqu'à présent, nous n'avons trié que des valeurs simples comme des chaînes et des nombres. Vous pouvez également utiliser la méthode
people
数组,其中包含多个 person 对象。每个对象由 id
、name
和 dob
Nous avons ici un attribut
const people = [ {id: 15, name: "Blessing", dob: '1999-04-09'}, {id: 17, name: "Aladdin", dob: '1989-06-21'}, {id: 54, name: "Mark", dob: '1985-01-08'}, {id: 29, name: "John", dob: '1992-11-09'}, {id: 15, name: "Prince", dob: '2001-09-09'} ]
name
属性对此数组进行排序,我们必须创建一个自定义排序函数并将其传递给 sort
Pour trier ce tableau par l'attribut name
, nous devons créer une fonction de tri personnalisée et la transmettre à la méthode :
students.sort(byName)
byName
Cette fonction de tri personnalisée prend deux objets à chaque fois et compare leurs deux propriétés de nom pour voir laquelle est la plus grande (c'est-à-dire que l'ordre alphabétique vient en premier) :
function byName(a, b) { return a.name.localeCompare(b.name); }
[ {id: 17, name: "Aladdin", dob: '1989-06-21'}, {id: 15, name: "Blessing", dob: '1999-04-09'}, {id: 29, name: "John", dob: '1992-11-09'}, {id: 54, name: "Mark", dob: '1985-01-08'}, {id: 32, name: "Prince", dob: '2001-09-09'} ]
在前面的示例中,我们按名称(字符串)进行排序。在此示例中,我们将按每个对象的 ID 属性(数字)进行排序。
为此,我们可以使用以下函数:
function byID(a, b) { return parseInt(a.id) - parseInt(b.id) }
在函数中,我们使用 parseInt()
来确保该值是一个数字,然后我们将两个数字相减以获得负值、正值或零值。使用此函数,您可以按公共数字属性对任何对象数组进行排序。
console.log(students.sort(byID)) /* [ {id: 15, name: "Blessing", dob: '1999-04-09'}, {id: 17, name: "Aladdin", dob: '1989-06-21'}, {id: 29, name: "John", dob: '1992-11-09'}, {id: 32, name: "Prince", dob: '2001-09-09'} {id: 54, name: "Mark", dob: '1985-01-08'}, ] */
假设您想要构建一个应用程序,允许用户从数据库下载姓名列表,但您希望根据出生日期(从最年长到最年轻)按时间顺序排列姓名.
此函数按年、月、日的时间顺序对出生日期进行排序。
function byDate(a, b) { return new Date(a.dob).valueOf() - new Date(b.dob).valueOf() }
Date().valueOf()
调用返回每个日期的时间戳。然后,我们执行与前面示例中相同的减法来确定顺序。
演示:
console.log(students.sort(byDate)) /* [ {id: 54, name: "Mark", dob: '1985-01-08'}, {id: 17, name: "Aladdin", dob: '1989-06-21'}, {id: 29, name: "John", dob: '1992-11-09'}, {id: 15, name: "Blessing", dob: '1999-04-09'}, {id: 32, name: "Prince", dob: '2001-09-09'} ] */
这种特殊方法在涉及日期顺序的情况下非常方便,例如确定谁有资格获得养老金或其他与年龄相关的福利的申请。
总的来说,使用各种内置方法时,在 JavaScript 中对元素进行排序非常简单。无论您需要对数字、字符串、对象还是日期数组进行排序,都有一种方法可以轻松完成这项工作。借助这些方法,您可以快速轻松地对 JavaScript 应用程序中的任何数据进行排序。
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!