Part.1  sort 方法

js 有自带排序方法 sort(),  默认 升序 排列

如:

 data() {
return {
arr: [1,3,2,5,6,8,7,4,9]
}
},

控制台如下:

貌似没毛病,老铁~~~   0.0

Part.2  问题

我们改变数组:

 data() {
return {
arr: [1,3,2,5,11,10,20,50,6,8,7,4,9]
}
}

控制台如下:

what are you  弄啥咧?  什么鬼!!!

查了一波资料,因为 sort() 方法排序是根据 Unicode码 比较,所以无法完成这种数组的排序!怎么办咧?

看了几篇博客发现一个有效且到目前为止感觉最简单的一种方法:自定义比较

如下:

 cmp: function(a, b) {
return a - b
}

原理:

参数  a ,b

如果 a > b  则 a - b > 0  返回一个正数

如果 a < b  则 a - b < 0  返回一个负数

如果 a = b  则 a - b = 0  返回 0

Part.3  实践

data() {
return {
arr: [1,3,2,5,11,10,20,50,6,8,7,4,9]
}
},
mounted() {
this.arr.sort(this.cmp)//注意此处不能使用 this.cmp()。原因 1:代码会报错 2.我们需要的是传入一个函数 this.cmp,this.cmp()这样只会得到 a-b 值
},
methods: {
cmp: function(a, b) {
return a - b
}
},

控制台如下:

完成排序!

如果小伙伴需要 降序 排列,只需将 自定义比较函数

return  a - b  改为  b - a  即可!~

参考博客:https://blog.csdn.net/baidu_25343343/article/details/54982747

js 数组元素排序?的更多相关文章

  1. js 数组元素排序

    字母排序 <html> <body> <script type="text/javascript"> ) arr[] = "Georg ...

  2. js数组对象排序详解

    一.js对象遍历输出的时候真的是按照顺序输出吗? 下边就来实践一下: var obj={'3':'ccc',name:'abc',age:23,school:'sdfds',class:'dfd',h ...

  3. JS数组随机排序

    var arr=[1,2,3,4,5]; arr.sort(function(a,b){ var v=Math.random()>0.5?1:-1; console.log(a,b,v); re ...

  4. js数组元素的添加和删除

    简单测试例子: var arr = new Array(); arr[0] = "aaa"; arr[1] = "bbb"; arr[2] = "cc ...

  5. JAvaScript:JS数组元素去重的方法

    在做javascript开发的时候,经常会遇到数组元素重复的问题,而javascript Array又没有直接提供方法解决此问题,还需要自己去实现. 方案一: 思路: 1.构建一个新的数组存放结果: ...

  6. js 数组随机排序

    仅用于个人学习记录 javascript 数组随机排序1.最简洁的方法:function randomsort(a, b) {    return Math.random()>.5 ? -1 : ...

  7. Js 数组对象排序

    1.定义函数 /** * 数组对象排序函数 * @param {any} name 排序字段 * @param {any} order 升.降(这里事true.false记得处理下) */ var b ...

  8. js数组sort排序方法的算法

    说明一下,ECMAScript没有定义使用哪种排序算法,各个浏览器的实现方式会有不同.火狐中使用的是归并排序,下面是Chrome的sort排序算法的实现. sort方法源码 DEFINE_METHOD ...

  9. JavaScript 数组元素排序

    var sortArray = new Array(3,6,8888,66); // 元素必须是数字 sortArray.sort(function(a,b){return a-b}); // a-b ...

随机推荐

  1. centos6.5下忘记mysql密码

    1.此方式会使得服务器处于不安全的情况,请尽量保证在安全的环境下进行,因为,此方式,会使得任何人任意地连接MySQL数据库. 2.#vim /etc/my.cnf 在[mysqld]的段中,加上ski ...

  2. javascript ==等于与===恒等于

    ==判断是否等于,只判断数值 ===代表恒等于,不仅判断数值,而且判断类型 var a=5; var b="5"; (a b 只是数值上相等,但是类型并不相等) a==b //tr ...

  3. bzoj1996

    区间dp 其实我们发现对于一段区间我们是这样构造的,每次我们会向两端放数,这样就有四种情况,且必须满足题意,初值是dp[i][i][0]=1,因为第一个人只有一种放法,不分左右.其实看见dp[i][i ...

  4. Vue HTML5 History 模式

    vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 his ...

  5. Android 实用技巧 --- 命令godir (转载)

    转自:http://blog.csdn.net/bigmarco/article/details/6995426 source build/envsetup.sh后可以使用很多android集成的sh ...

  6. java 发送get,post请求

    package wzh.Http; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStr ...

  7. LuoguP3964 [TJOI2013]松鼠聚会【切比雪夫距离/前缀和】

    题目传送门 前置知识:切比雪夫距离和曼哈顿距离的相互转化--自为风月马前卒 有了这个知识,我们便可以在读入松鼠的家的坐标时,先把他转化一下,然后把最后的总式化简,我们会得到一个充满后缀和以及前缀和的式 ...

  8. archive log full ora-00257

    ############# sample 0 asmcmd show free 37G in archive_log ASMCMD> lsdgState Type Rebal Unbal Sec ...

  9. ISCSI存储

    slave-147作为服务端 需要安装的软件 [root@slave-147 ~]# yum install -y scsi-target-utils slave-148和slave-149作为客户端 ...

  10. qconshanghai2016

    http://2016.qconshanghai.com/schedule 大会日程 2016年10月20日 星期四 07:45 开始签到 09:00 开场致辞 专题 前端技术实践 主题演讲 业务上云 ...