在数组中有两个可以用来直接排序的方法,分别是reverse()和sort()。下面通过本文给大家详细介绍,对js 数组重排序相关知识感兴趣的朋友一起看看吧。

  1.数组中已存在两个可直接用来重排序的方法:reverse()和sort()。

    reverse()和sort()方法的返回值是经过排序后的数组。reverse()方法会反转数组项的顺序:

    var values = [1,2,3,4,5];

    values.reverse();

    alert(values);//5,4,3,2,1

   这种方法的作用就是翻转数组,虽然效果直观但是不够灵活。

   在默认情况下,sort()方法按升序排列数组,sort()方法会调用每个数组项的toString()转型方法,然后比较得到字符串,确定如何排序。即使数组中的每一项都是数值,sort()方法比较的也是字符串:

    var values = [0,1,5,10,15];

    values.sort();

    alert(values);//0,1,10,15,5

    为什么数组 [0,1,5,10,15].sort() 之后的结果是 0,1,10,15,5,而不是期待的 0,1,5,10,15这是因为 sort 方法默认(即没有compare函数)按照数组元素对应的字符串的 Unicode 从小到大进行排序。也就是说,上面的结果中5排在10,15后面,是因为 '5' 比 '10','15'大。你现在就可以按F12打开console,输入下面的代码

    '5' > '10'

    结果应该是true。这说明,字符串 '5' 比 '10' 大,所以它排在后面。

    为了解决这个问题,我们可以设置一个函数compare,compare函数只是指定了 排序策略 ,sort 会根据这个策略来排序。 至于怎么调换位置,怎么生成最后的结果,那是sort的事情。这里其实是一个常见的设计模式,策略模式,有兴趣可以去了解一下。下面我们来看compare的具体实现: 

    function compare(value1,value2){
      if (value1 < value2){
      return -1;
      }else if (value1 > value2){
      return 1;
      }else{
      return 0;
      }
    }

    最后将这个比较函数传递给sort()方法就实现了正确的升序排序,当然也可以实现降序排序,这里就不说明了,原理一样,下面我们看具体排序的实现:

    var values = [0,1,5,10,15];

    values.sort(compare);

    alert(values);//0,1,5,10,15  

    sort(compare)函数的排序条件是:

    参数大于0,数组的相邻两个元素交换位置;

    参数小于0,数组的相邻两个元素不交换位置;

    参数等于0,数组的相邻两个元素大小相等;所以compare自定义函数必须返回一个数值。

   2.对于数值类型或者valueOf()方法会返回数值类型的对象类型。

    可使用一个更简单的比较函数。此函数只要第二个值减第一个值即可。

     function compare(v1,v2){

     return v2-v1; 

     }

 

 

    

 

Javascript中数组重排序方法详解的更多相关文章

  1. JS中数组重排序方法

    在数组中有两个可以用来直接排序的方法,分别是reverse()和sort().下面通过本文给大家详细介绍,对js数组重排序相关知识感兴趣的朋友一起看看吧 1.数组中已存在两个可直接用来重排序的方法:r ...

  2. JavaScript中继承的实现方法--详解

    最近看<JavaScript王者归来>中关于实现继承的方法,做了一些小总结: JavaScript中要实现继承,其实就是实现三层含义:1.子类的实例可以共享父类的方法:2.子类可以覆盖父类 ...

  3. JavaScript中数组的排序方法:1.冒泡排序 2.选择排序

      //1.选择排序: //从小到大排序:通过比较首先选出最小的数放在第一个位置上,然后在其余的数中选出次小数放在第二个位置上,依此类推,直到所有的数成为有序序列. var arr2=[19, 8, ...

  4. javascript中set与get方法详解

    其中get与set的使用方法: 1.get与set是方法,因为是方法,所以可以进行判断. 2.get是得到 一般是要返回的   set 是设置 不用返回 3.如果调用对象内部的属性约定的命名方式是_a ...

  5. JavaScript中数组Array.sort()排序方法详解

    JavaScript中数组的sort()方法主要用于对数组的元素进行排序.其中,sort()方法有一个可选参数.但是,此参数必须是函数. 数组在调用sort()方法时,如果没有传参将按字母顺序(字符编 ...

  6. javascript中数组常用的方法和属性

    前言 在javascript中,数组是一种非常重要的数据类型,我们时常会和它打交道,最近在开发项目中频繁的使用到数组,但是自己对数组的众多方法已经是非常模糊了,为了方便自己以后能够更好的使用数组中的属 ...

  7. php_DWZ-JUI中碰到的问题解决方法详解(thinkphp+dwz)

    原文:php_DWZ-JUI中碰到的问题解决方法详解(thinkphp+dwz) 折腾了两天,dwz删除后,数据不能自动刷新,解决方案,直接看图  . 1. 删除.修改状态后无法刷新记录: 在dwz. ...

  8. PHP 中 16 个魔术方法详解

    PHP 中 16 个魔术方法详解   前言 PHP中把以两个下划线__开头的方法称为魔术方法(Magic methods),这些方法在PHP中充当了举足轻重的作用. 魔术方法包括: __constru ...

  9. JavaScript中的鼠标滚轮事件详解

    JavaScript中的鼠标滚轮事件详解/*Firefox注册事件*/ ~~~Firefox: addEventListener('DOMMouseScroll', handler, false)if ...

随机推荐

  1. react-draft-wysiwyg富文本

      import { EditorState, convertToRaw } from 'draft-js'; import { Editor } from 'react-draft-wysiwyg' ...

  2. 团体程序设计天梯赛-练习集-L1-030. 一帮一

    L1-030. 一帮一 “一帮一学习小组”是中小学中常见的学习组织方式,老师把学习成绩靠前的学生跟学习成绩靠后的学生排在一组.本题就请你编写程序帮助老师自动完成这个分配工作,即在得到全班学生的排名后, ...

  3. [Ynoi2016]掉进兔子洞 题解

    题面传送门:https://www.luogu.org/problemnew/show/P4688 (温馨提示,请直接翻至题目描述部分) 1e5的数据范围,以及对区间每个权值出现次数取min此类主席树 ...

  4. 在eclipse中运行maven命令没有反应,console也不打印信息

    eclipse的maven项目中,在run as  执行maven命令的时候发现毫无反应,console也不打印信息,原因是因为没有传参数,解决办法如下:①打开eclipse的window菜单: ②接 ...

  5. python 对图片做垂直投影

    Python 对图片做垂直投影 本文利用opencv对图片进行垂直投影,做出垂直投影图,大体思路:打开图片,灰度化,二值化,按列进行统计,新建一个大小和原图一样的图片,按列进行填充: cv2.cv.G ...

  6. Java 中 synchronized的用法详解

    Java语言的关键字,当它用来修饰一个方法或者一个代码块的时候,能够保证在同一时刻最多只有一个线程执行该段代码. 1.方法声明时使用,放在范围操作符(public等)之后,返回类型声明(void等)之 ...

  7. 【ACM】hdu_1170_Balloon Comes!_201307261946

    Balloon Comes!Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tot ...

  8. 彻底解决Android GPS没法定位这一顽固问题

    大家去网上搜索Android定位location为null没法定位问题.预计有一大堆文章介绍怎样来解决.可是最后大家发现基本没用. 本文将从Android定位实现原理来深入分析没法定位原因并提出真正的 ...

  9. hdu 5411 CRB and Puzzle 矩阵高速幂

    链接 题解链接:http://www.cygmasot.com/index.php/2015/08/20/hdu_5411/ 给定n个点 常数m 以下n行第i行第一个数字表示i点的出边数.后面给出这些 ...

  10. luogu4180 次小生成树Tree 树上倍增

    题目:求一个无向图的严格次小生成树(即次小生成树的边权和严格小于最小生成树的边权和) 首先求出图中的最小生成树.任意加一条树外边都会导致环的出现.我们现在目标是在树外边集合B中,找到边b∈B,a∈b所 ...