Javascript数组(一)排序
一、简介
首先,我们来看一下JS中sort()和reverse()这两个函数的函数吧
reverse();这个函数是用来进行倒序,这个没有什么可说的,所谓倒序就是大的在前面,小的在后面。
比如:
var array1 = [0,1,5,10,15];
array1.reverse();//结果为:15,10,5,1,0
sort([参数]);这个函数是用来对数组进行正序排列的,
var array1 = [0,1,5,10,15];
array1.sort();//结果为:0,1,10,15,5
注:sort() 方法可以接受一个 方法为参数 ,这个方法有两个参数。分别代表每次排序比较时的两个数组项。sort()排序时每次比较两个数组项都回执行这个参数,并把两个比较的数组项作为参数传递 给这个函数。当函数返回值为1的时候就交换两个数组项的顺序,否则就不交换。
有时候,我们大家在进行排序,尤其是数组排序。有可能,我们只是想去排列一组数据中的某一个数据的时候。如下面的这个例子。
var data = [{name:"Tom",age:"28"},{name:"Cat",age:"29"}...];
我们只是想对这组数据中的name或age进行排序,这个时候大家就会发现,使用JS中的自代的函数sort()就不能解决这类型的问题。哪么此篇文章就是解决这个问题?
在简述一下此问题:假设有一个对象数组,我们想要根据某个对象属性对数组进行排序。而传递给数组sort()方法的比较函数要接收两个参数,这两个参数就是比较的值。可是,我们需要一种方式来指明按照哪个属性来排序。而sort()方法只能接受一个参数,这个时候,我们就可以利用一下JS自定义函数的特点来做。好吧,我们来看下。
看到上图,大家可能有点懵,这个函数定义看起来有点复杂,但实际上无非就是在这个函数的内部嵌套了另一函数,而且,这个内部的函数前面加了一个return操作符。在内部函数接收到pName参数后,使用方括号(可以看作数组取值)表示法来取得指定属性的值。那么,这里大家可能有点不明白,就是我们上篇文章在讲解的时候,明明sort在传递的参数只是一个不带参数的函数。这里我们可以回顾一下,JS函数的相关定义:要访问函数的指针而不执行函数的话,必须去掉函数后面的哪对圆括号。并且,ECMAscript中的函数名本身就是变量,所以函数也可以作为值来使用。也就是说,不仅可以像传递参数把一样把一个函数函数传递给另一个函数,而且可以将一个函数作为另一个函数的结果返回。
二、数字数组
1.默认ASCII字符顺寻
$(function () {
//Javascript数组排序
var nums = [8, 10, 2, 3, 1,100];
//默认ASII字符排序,升序
nums.sort();
//将默认ASCII字符排序反转
nums.reverse();
//遍历输出
for (var i = 0; i < nums.length; i++) {
$("#orderUl").append("<li>"+nums[i]+"</li>");;
}
});
<ul id="orderUl"></ul>
| ascii升序显示结果: | ascii降序显示: |
![]() |
![]() |
2.数字数组升序和降序
$(function () {
//Javascript数组排序
var nums = [8, 10, 2, 3, 1,100];
//升序排列
nums.sort(function (a, b) {
return a > b ? 1 : -1;
});
//降序排列
nums.sort(function (a,b) {
return a < b ? 1 : -1;
});
//遍历输出
for (var i = 0; i < nums.length; i++) {
$("#orderUl").append("<li>"+nums[i]+"</li>");;
}
});
| 升序排列: | 降序排列: |
![]() |
![]() |
三。混合数组
//混合数组
var nums = ['a', 10, 'w', '2',100, 'b','array'];
nums.sort();//按ascii字符顺序排序
//升序排序,顺序打乱
nums.sort(function (a, b) {
return a > b ? 1 : -1;
});
//遍历输出
for (var i = 0; i < nums.length; i++) {
$("#orderUl").append("<li>"+nums[i]+"</li>");;
}
| Asciii升序 | 按大小升序 |
![]() |
![]() |
三、json数组
//josn数组
var nums = [
{ id:3,name: 'da', age: 25,remark:'a' },
{ id: 1, name: 'alla', age: 21, remark: 'd' },
{ id: 4, name: 'cs', age: 22, remark: 'b' },
{ id: 2, name: 'bs', age: 29, remark: 'c' },
];
nums.sort();//默认根据第一个字符串列按ascii字符顺序排序
function orderBy(age) {//排序函数升序,调用时指定排序列
return function (object1, object2) {
var val1 = object1[age];
var val2 = object2[age];
if (val1 < val2) return -1;
else if (val1 > val2) return 1;
else return 0;
}
}
nums.sort(orderBy('age'));
//遍历输出
for (var i = 0; i < nums.length; i++) {
$("#orderUl").append("<li>" + nums[i].id + "--" + nums[i].name + "--" + nums[i].age + "--" + nums[i].remark + "</li>");;
}
| 默认排序 | 指定age排序 | 指定remark排序 |
![]() |
![]() |
![]() |
| 默认根据json对象第一个字符串列按ascii排序 | 按age数字列升序 | 按reamark字符列排序 |
Javascript数组(一)排序的更多相关文章
- javascript数组对象排序
javascript数组对象排序 JavaScript数组内置排序函数 javascript内置的sort函数是多种排序算法的集合 JavaScript实现多维数组.对象数组排序,其实用的就是原生的s ...
- Javascript 数组自定义排序,并获取排序后的保存原索引的同序数组(堆排序实现)
比如数组A: [ 0: 5, 1: 2, 2: 4, 3: 3, 4: 1 ] 排序后的结果为:[1, 2, 3, 4, 5],但是有时候会有需求想要保留排序前的位置到一个同位数组里,如前例则为:[4 ...
- JavaScript 数组元素排序
var sortArray = new Array(3,6,8888,66); // 元素必须是数字 sortArray.sort(function(a,b){return a-b}); // a-b ...
- javascript 数组Array排序
var numberAry = [9,9,10,8,7,80,33,55,22]; numberAry.sort(); /*输出:10,22,33,55,7,8,80,9,9 上面的代码没有按照数值的 ...
- JavaScript数组(三)数组对象使用整理
一.数组声明方法1. var a=new Array();2. var a=new Array([size]);3.var a=new Array(['a'],[1],['b'],[123]);4. ...
- js 数组随机排序
仅用于个人学习记录 javascript 数组随机排序1.最简洁的方法:function randomsort(a, b) { return Math.random()>.5 ? -1 : ...
- JavaScript 使用 sort() 方法从数值上对数组进行排序
使用 sort() 方法从数值上对数组进行排序. <html> <body> <script type="text/javascript"> f ...
- 比较两种数组随机排序方法的效率 JavaScript版
//比较2中数组随机排序方法的效率 JavaScript版 //randon1思路 //当len=5时候,从0-5中随机3一个放入i=0, // 从0-3随机一个2放入i=2 // 从0-2随机一个1 ...
- 19 JavaScript数组 &数组增删&最值&排序&迭代
关联数组(散列) 关联数组又叫做散列,即使用命名索引. JavaScript数组只支持数字索引. JavaScript对象使用命名索引,而数组使用数字索引,JavaScript数组是特殊类型的对象. ...
随机推荐
- ArcObjects 中连接geodatabase
参考资料: 1. http://help.arcgis.com/en/sdk/10.0/arcobjects_net/conceptualhelp/index.html#/d/0001000003s8 ...
- spark操作kudu之DML操作
Kudu支持许多DML类型的操作,其中一些操作包含在Spark on Kudu集成 包括: INSERT - 将DataFrame的行插入Kudu表.请注意,虽然API完全支持INSERT,但不鼓励在 ...
- python编码,赋值和is的区别
1. == 与 is 的区别 赋值 == 比较值是否相等,is 比较,比较的是内存地址. 小数据池的作用是节省内存空间 数字的范围:-5 到 256 共用一个数据池 字符串范围:1.不能有特殊字符.2 ...
- BZOJ3110 [Zjoi2013]K大数查询 树套树 线段树 整体二分 树状数组
欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - BZOJ3110 题意概括 有N个位置,M个操作.操作有两种,每次操作如果是1 a b c的形式表示在第a个位 ...
- linux中查看http各种状态数量
转自: http://www.cnblogs.com/wayne173/p/5652043.html 我们的网站部署在linux的服务器上,特别是web服务器,我们可能有时候做为运维人员,肯定是要查看 ...
- Linux安装Tomcat-Nginx-FastDFS-Redis-Solr-集群——【第七集之SSH远程连接——克隆与更改配置】
一.SSH远程连接 OpenSSH的安装 查看是否安装Openssh:rpm -qa | grep ssh搜索openssh安装包:yum search openssh安装openssh:yum in ...
- P1892 [BOI2003]团伙 并查集
题目描述 1920年的芝加哥,出现了一群强盗.如果两个强盗遇上了,那么他们要么是朋友,要么是敌人.而且有一点是肯定的,就是: 我朋友的朋友是我的朋友: 我敌人的敌人也是我的朋友. 两个强盗是同一团伙的 ...
- L3-021 神坛 (30 分) 计算几何
在古老的迈瑞城,巍然屹立着 n 块神石.长老们商议,选取 3 块神石围成一个神坛.因为神坛的能量强度与它的面积成反比,因此神坛的面积越小越好.特殊地,如果有两块神石坐标相同,或者三块神石共线,神坛的面 ...
- html-伪类
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JavaScript函数、闭包、原型、面向对象
JavaScript函数.闭包.原型.面向对象 断言 单元测试框架的核心是断言方法,通常叫assert(). 该方法通常接收一个值--需要断言的值,以及一个表示该断言目的的描述. 如果该值执行的结果为 ...








