一、问题

在使用sort排序时,若遇到相同数据或非数值数据时,会出现苹果手机与安卓手机排序不一致问题

var arr = [{
"id": "52",
"return_value": "--"
},{
"id": "54",
"return_value": "100,000.00%"
},{
"id": "66",
"return_value": "1000%"
},{
"id": "78",
"return_value": "--"
}];
function sortBy(arr, order, order_by){
    if (order == 'asc' || order == 'desc') {
      arr.sort((a, b) => {
        let x = a[order_by];
        let y = b[order_by];
        if (x == '--') {
          return -1
        }
        if (y == '--') {
          return 1
        }
        if ( !isNaN(parseFloat(x)) && !isNaN(parseFloat(y)) ) {
          x = parseFloat(x);
          y = parseFloat(y);
          if (x > y) {
            return 1;
          }
          if (x < y) {
            return -1;
          }
          return 0;
        }
        x = x.toString();
        y = y.toString();
        return x.localeCompare(y, 'zh-CN');
      })
      if ('desc' == order) {
        arr.reverse();
      }
      return arr;
    }else{
      return arr;
    }
}
  var sortArr = sort(arr, "desc", "return_value");
  sortArr.forEach(function (item, i) {
    var div = document.createElement("div");
    div.innerHTML = item.id + ":"  + item.return_value;
    document.body.appendChild(div);
  });
 

二、原因

sort排序原理:

a:"因为排序依据是相同的就是没有顺序,没有顺序就是乱序,这种结果是正确的";

b:"既然排序依据是相同的那就按照原始顺序输出"(这应该是大多数据语言里常规的做法)

经手机测试,两种手机排序不一致是因为苹果手机使用了原理b进行排序,而安卓手机使用了原理a进行排序。

三、解决

方法1:根据排序前的索引进行排序。先循环给每个元素增加一个属性,用来保存它目前的位置,然后再排序中遇到等序时取索引进行排序。参考网址:https://blog.csdn.net/qq_18145031/article/details/82500177

方法2:根据数组中的自增字段进行排序

function sort(arr, order, order_by) {
  if (order == 'asc' || order == 'desc') {
    arr.sort(function (a, b) {
      let x = a[order_by];
      let y = b[order_by];
      if (x == '--' && y != '--') {
        return 1;
      }
      if (x != '--' && y == '--') {
        return -1;
      }
      x = x.toString().replace(/,/g, '');
      y = y.toString().replace(/,/g, '');
      
      if (order == 'asc') { // 升序
        if (x == '--' && y == '--') {
          return parseInt(a.id) - parseInt(b.id)
        } else {
          if (!isNaN(parseFloat(x)) && !isNaN(parseFloat(y))) {
            return parseFloat(x) - parseFloat(y);
          }
          return x.localeCompare(y, 'zh-CN');
        }
      } else { // 降序
        if (x == '--' && y == '--') {
          return parseInt(b.id) - parseInt(a.id)
        } else {
          if (!isNaN(parseFloat(x)) && !isNaN(parseFloat(y))) {
            return parseFloat(y) - parseFloat(x);
          }
          return y.localeCompare(x, 'zh-CN');
        }
      }
    });
    return arr;
  } else {
    return arr;
  }
}
var sortArr = sort(arr, "desc", "return_value");
sortArr.forEach(function (item, i) {
  var div = document.createElement("div");
  div.innerHTML = item.id + ":" + item.name + "--" + item.return_value;
  document.body.appendChild(div);
});

sort排序在苹果与安卓端不一致问题的更多相关文章

  1. 判断苹果和安卓端或者wp端

    window.onload = function() { var u = navigator.userAgent; if(u.indexOf('Android') > -1 || u.index ...

  2. js判断苹果和安卓端或者wp端

    最近做了一个H5,说要提供一个底部,可以区分安卓或者ios,到相应的网址进行下载APP,如图: 代码如下:  window.onload = function () { var u = navigat ...

  3. sort排序出现安卓与苹果系统排序不一致问题

    sort排序出现安卓与苹果系统排序不一致问题

  4. 微软BI 之SSIS 系列 - Merge, Merge Join, Union All 合并组件的使用以及Sort 排序组件同步异步的问题

    开篇介绍 SSIS Data Flow 中有几个组件可以实现不同数据源的数据合并功能,比如 Merger, Merge Join 和 Union All.它们的功能比较类似,同时也比较容易混淆,下面是 ...

  5. 【转载】Redis sort 排序命令详解

    转载地址:http://www.jb51.net/article/69131.htm 本文介绍redis排序命令 redis支持对list,set,sorted set元素的排序 sort 排序命令格 ...

  6. 关于微信内置浏览器安卓端session丢失问题

    项目上线测试,发现微信安卓端存在用户登录无法验证session情况, 导致每次接口请求都无法识别,而苹果客户端不会出现此问题,非微信环境打开不会出现此问题,找到一些解决方案做下记录: 方案1: 由于微 ...

  7. 二维码合成,将苹果和安卓(ios和android)合成一个二维码,让用户扫描一个二维码就可以分别下载苹果和安卓的应用

    因为公司推广的原因,没有合适的将苹果和安卓(ios和android)合成一个二维码的工具. 因为这个不难,主要是根据浏览器的UA进行判断,所以就自己开发了一个网站 网站名称叫:好推二维码  https ...

  8. 2.sort 排序命令讲解

    sort命令  sort:文本排序,仅仅是对显示文件的排序,而不影响源文件的顺序,是根据ASSII码     的字符升序来排列的.        -n:安装数值大小从小到大排列 ,默认是升序.     ...

  9. 反向输出及sort排序

    建立条件:#include "algorithm"引用这个头文件 1.reverse 的用法,反向排序,由自己输入5个数: 1 2 3 4 5 for (int i = 0; i ...

随机推荐

  1. Python通过百度Ai识别图片中的文字

    版本:python3.7 工作中有需要识别图片中的汗字,查看了半天大神们的博客,但没找到完全可以用的源码,经过自己的实践,以下源码可以实现: 创建应用 首先你需要登录百度AI,选择文字识别,创建一个应 ...

  2. Vue公司项目实战步骤

    一.无权限,无验证的Vue项目 1.打好HTML+CSS+JS基础,及<Vue 2.0 实战> 2.编写用mock设计的案例: 3.将以上案例的后台用C#改写: 二.带安全验证的Vue项目 ...

  3. Supervisor配置

    Supervisor(http://supervisord.org/)是用Python开发的一个client/server服务,是Linux/Unix系统下的一个进程管理工具,不支持Windows系统 ...

  4. java集合树状结构及源码

    java集合树状结构及源码 最近一直想看一下java集合的源码,毕竟平时用的比较多,但总是感觉是跟着习惯new出来一个对象,比如ArrayList,HashMap等等,所以就简单的看了一下,了解了一下 ...

  5. 02 jmeter性能测试系列_JForum测试论坛的环境搭建

    软件测试高端专家培训 QQ 讨论群498721021 网站http://www.szwpinfo.com 1.进入jforum的官方网站,地址http://jforum.net/,下载 2.放入到to ...

  6. DOM随时记

    1.node-type 返回元素的节点类型:可以在标签上进行设置 node-type="item"   ---来自新浪微博的首页写法

  7. win 10 在vs2017下对mpi的安装以及认识

    这里我先对MPI进行一下简单的介绍,MPI的全称是Message Passing Interface,即消息传递接口. 它并不是一门语言,而是一个库,我们可以用Fortran.C.C++结合MPI提供 ...

  8. hash加密

    hash import hashlib content = 'its so coll'.encode('utf8') o = hashlib.sha1() # 创建一个hash对象 o.update( ...

  9. mysql5.0手动升级8.0.15,并链接到navicat

    一.卸载老版本的mysql 1.1 在控制面板中删除即可 1.2 将老版本的mysql安装残留文件彻底删除 二.彻底删除mysql-注册表 2.1 开始->运行-> regedit 看看注 ...

  10. webpack代理解决跨域问题

    new WebpackDevServer(webpack(config), { hot:hot, inline: true, compress: true, //去掉真实ip的检测 disableHo ...