搜索
首页web前端js教程Javascript数组的排序 sort()方法和reverse()方法_javascript技巧

其中:

1.JavaScript的sort()中如果没有指定比较函数,则默认会按照字符的编码顺序进行升序排序。也就是说如果我们想要对数值进行排序得到的不一定是我们想要的结果。

2.Javascript的reverse()将数组中的元素逆序。

先看看上面的第一点,如果有一个数组arr=[1,6,3,7,9],使用arr.sort()后,数组的顺序为1,3,6,7,9,得到了我们想要的结果。

再看看下面的一个数组排序:arr=[3,1,16,34,30],如果执行arr.sort()后是不是还是会得到我们想要的1,3,16,30,34呢?

执行后我们发现结果为:1,16,3,30,34,显然结果不是我们想要的。实际上,sort方法将上面的数值按照字符串方式排序了,也就是说和数组arr1=['3','1','16','34','30']的排序结果一致。

代码如下:

复制代码 代码如下:

var arr=[3,1,16,34,30];
var arr1=['3','1','16','34','30'];
alert(arr.sort()); // 1,16,3,30,34
alert(arr1.sort()); // 1,16,3,30,34


那么如果我们想要得到正确的结果:1,3,16,30,34 应该怎么去做呢?

查询javascript手册,手册中的说明如下:

定义和用法

sort() 方法用于对数组的元素进行排序。

语法

arrayObject.sort(sortby)参数 描述
sortby 可选。规定排序顺序。必须是函数。

返回值

对数组的引用。请注意,数组在原数组上进行排序,不生成副本。

说明

如果调用该方法时没有使用参数,将按字母顺序对数组中的元素进行排序,说得更精确点,是按照字符编码的顺序进行排序。要实现这一点,首先应把数组的元素都转换成字符串(如有必要),以便进行比较。

如果想按照其他标准进行排序,就需要提供比较函数,该函数要比较两个值,然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b,其返回值如下:

若 a 小于 b,在排序后的数组中 a 应该出现在 b 之前,则返回一个小于 0 的值。
若 a 等于 b,则返回 0。
若 a 大于 b,则返回一个大于 0 的值。
=====================================

由以上说明我们可以了解到,如果要按照数值进行排序,那么就要提供一个比较函数。一般常见的比较函数如下:
复制代码 代码如下:

function sortArr(m,n){
if(mreturn -1;//小于,返回-1
else if(m>n)
return 1;//大于,返回1
else return 0;//等于,返回0
}

精简后可以写成如下两种形式:
复制代码 代码如下:

function sortArr(m,n){
return m-n;
}

复制代码 代码如下:

function sortArr(m,n){
return m>n?1:(m}

然后执行arr.sort(sortArr),发现可以得到我们想要的结果:1,3,16,30,34.也就说将数组按照整型数值进行了升序排序。
这样的话新的问题就来了,如果我们想要对数组进行降序排序怎么做呢?

有一思路就是改变sortArr函数的返回值,如果mn时返回负值,m=n时返回0。这样就可以了。

你可以写两个函数,一个升序,一个降序。然后根据不同的需要调用不同的函数就可以了。

此外我们还可以调用上面提到的另一个函数reverse()来轻松的实现,当我们进行升序排序后,然后数组在调用reverse()方法将数组逆序,这样就可以实现数组的降序排序了。

代码如下:
复制代码 代码如下:

arr.sort(sortArr).reverse();

总结:这里主要介绍了Javascript中数组的排序,由于默认按照字符串排序,要实现按照其他形式的规则排序就要自己定义比较函数了。
声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
uniapp中如何实现拖拽排序和拖拽操作uniapp中如何实现拖拽排序和拖拽操作Oct 19, 2023 am 09:39 AM

Uniapp是一款跨平台的开发框架,其强大的跨端能力使得开发者可以快速方便地开发出各种应用。在Uniapp中实现拖拽排序和拖拽操作也是非常简单的,并且可以支持多种组件和元素的拖拽操作。本文将介绍如何使用Uniapp实现拖拽排序和拖拽操作,并提供具体的代码示例。拖拽排序功能在很多应用中都非常常见,例如可以用于实现列表的拖拽排序,图标的拖拽排序等。下面我们以列表

探究C++sort函数的底层原理与算法选择探究C++sort函数的底层原理与算法选择Apr 02, 2024 pm 05:36 PM

C++sort函数底层采用归并排序,其复杂度为O(nlogn),并提供不同的排序算法选择,包括快速排序、堆排序和稳定排序。

PHP 中保留键名的快速数组排序方法PHP 中保留键名的快速数组排序方法May 02, 2024 pm 03:06 PM

PHP中保留键名的快速数组排序方法:使用ksort()函数对键进行排序。使用uasort()函数使用用户定义的比较函数进行排序。实战案例:要按分数对用户ID和分数的数组进行排序,同时保留用户ID,可以使用uasort()函数和自定义比较函数。

使用C#中的Array.Sort函数对数组进行排序使用C#中的Array.Sort函数对数组进行排序Nov 18, 2023 am 10:37 AM

标题:C#中使用Array.Sort函数对数组进行排序的示例正文:在C#中,数组是一种常用的数据结构,经常需要对数组进行排序操作。C#提供了Array类,其中有Sort方法可以方便地对数组进行排序。本文将演示如何使用C#中的Array.Sort函数对数组进行排序,并提供具体的代码示例。首先,我们需要了解一下Array.Sort函数的基本用法。Array.So

JS数组排序:sort()方法的工作原理和机制深入解析JS数组排序:sort()方法的工作原理和机制深入解析Dec 28, 2023 am 11:47 AM

深入理解JS数组排序:sort()方法的原理与机制,需要具体代码示例导语:数组排序是在我们日常的前端开发工作中非常常见的操作之一。JavaScript中的数组排序方法sort()是我们最常使用的数组排序方法之一。但是,你是否真正了解sort()方法的原理与机制呢?本文将带你深入理解JS数组排序的原理和机制,并提供具体的代码示例。一、sort()方法的基本用法

PHP 数组按值排序后如何保持键名?PHP 数组按值排序后如何保持键名?May 02, 2024 pm 04:09 PM

在PHP中按值排序数组,同时保留键名的方法是:使用usort()函数按值排序数组。向usort()函数传递一个匿名函数作为比较函数,该函数返回元素值的差值。usort()会根据匿名函数对数组进行排序,同时保持键名不变。

PHP 数组自定义排序算法的编写指南PHP 数组自定义排序算法的编写指南Apr 27, 2024 pm 06:12 PM

如何编写自定义PHP数组排序算法?冒泡排序:通过比较和交换相邻元素来排序数组。选择排序:每次选择最小或最大元素并将其与当前位置交换。插入排序:逐个插入元素到有序部分。

如何使用C#中的List.Sort函数对列表进行排序如何使用C#中的List.Sort函数对列表进行排序Nov 17, 2023 am 10:58 AM

如何使用C#中的List.Sort函数对列表进行排序在C#编程语言中,我们经常需要对列表进行排序操作。而List类的Sort函数正是为此设计的一个强大工具。本文将介绍如何使用C#中的List.Sort函数对列表进行排序,并提供具体的代码示例,帮助读者更好地理解和应用该函数。List.Sort函数是List类的一个成员函数,用于对列表中的元素进行排序。该函数接

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前By尊渡假赌尊渡假赌尊渡假赌
仓库:如何复兴队友
4 周前By尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
3 周前By尊渡假赌尊渡假赌尊渡假赌

热工具

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

SublimeText3 Linux新版

SublimeText3 Linux新版

SublimeText3 Linux最新版

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具