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. 洛谷 - P1115 - 最大子段和 - 简单dp

    https://www.luogu.org/problemnew/show/P1115 简单到不想说……dp[i]表示以i为结尾的最大连续和的值. 那么答案肯定就是最大值了.求一次max就可以了. 仔 ...

  2. hdoj5671 BestCoder Round #81 (div.2)

    对于交换行.交换列的操作,分别记录当前状态下每一行.每一列是原始数组的哪一行.哪一列即可. 对每一行.每一列加一个数的操作,也可以两个数组分别记录.注意当交换行.列的同时,也要交换增量数组. 输出时通 ...

  3. bzoj 4259 4259: 残缺的字符串【FFT】

    和bzoj 4503 https://www.cnblogs.com/lokiii/p/10032311.html 差不多,就是再乘上一个原串字符 有点卡常,先在点值下算最后一起IDFT #inclu ...

  4. asp.net实现服务器文件下载到本地

    1.说明 通过文件下载框实现将服务器上的文件下载到本地指定位置.这里需要指定服务器文件路径 try { string strFilePath = Server.MapPath("~" ...

  5. mysql 用 group by 和 order by同时使用

    首先,这是不可能实现的 mysql的查询的顺序 select -> from-> where->group by->having->order by. 但mysql的解析 ...

  6. 在MacOs上安装sqlsrv Mojave - 找不到'php.h'文件

    Mojave没有安装标头. 要安装标头: open /Library/Developer/CommandLineTools/Packages/macOS_SDK_headers_for_macOS_1 ...

  7. css为什么要定最小宽度和最大宽度,最小宽度和最大宽度有什么用

    设最小和最大宽度,主要是为了防止页面变形而已如,如果一个页面的宽度设置为百分比,这时此页面的宽度会根据浏览器的宽度而定但如果浏览器的宽度过小,页面就会变形,例如,你做的用百分比设置的页面,而用户端的浏 ...

  8. Chemistry in Berland CodeForces - 846E

    题目 题意: 有n种化学物质,第i种物质现有bi千克,需要ai千克.有n-1种,编号为2-n的转换方式,每种都为(x,k),第i行是编号为i+1的转换方式,编号为i的转换方式(xi,ki)表示ki千克 ...

  9. C# 对象复制

    /// <summary> /// 把DataTable对象转成List<T>对象 /// </summary> /// <typeparam name=&q ...

  10. Learn More Study Less `my notes`

    整体性学习概念: 广泛扎实的基础知识 抽象知识成生活中的模型,便于记忆 融会贯通,创造新的东西 整体性学习组成 获取:积极阅读:标记并结合其他的知识点 主要观点 怎么记住:联系和比喻其他的知识 拓展和 ...