思路:

1、先将数组按照一定规则排序;

2、再拆分数组到Map中,按Key分类;

3、再从Map中遍历取出要显示的内容;

sortBroadList: function (broadcastList) {
var broadList = broadcastList.sort(function (d1, d2) {
var d1ChatAt = (d1.first_pinyin ? d1.first_pinyin.toString().charCodeAt(0) : 91);
var d2ChatAt = (d2.first_pinyin ? d2.first_pinyin.toString().charCodeAt(0) : 91);
return d2ChatAt - d1ChatAt;
}).reverse(); var result = new Map();
for (var item of broadList) {
var pinyin = item.first_pinyin ? item.first_pinyin : '#';
if (result.get(pinyin)) {
result.get(pinyin).values.push(item);
} else {
result.set(pinyin, {key: pinyin, values: [item]});
}
} uc.util.LogUtil.info('ContactManager', 'sortBroadList', 'sort broadcastlist result:', {
broadList: broadList
});
return result;
}, loadBroadcastItem: function (broadcastList) {
var parentPanel = _this.getLatestClickedContactsPanel();
var ul = parentPanel.find('.broadcast-parent');
ul.empty();
var broadList = _this.sortBroadList(broadcastList);
broadList.forEach(function (item) {
var hasAlphabetical = ul.find(`li[alphabetical-key="${item.key}"]`);
if (!hasAlphabetical.length) {
ul.append(_this.getAlphabetical(item.key));
}
for (var broadcast of item.values) {
ul.append(_this.getBroadcastTpl(broadcast));
_this.broadcastCache.addContact(broadcast.board_id, broadcast);
}
});
},

结果:

js 分组数组的更多相关文章

  1. Js删除数组重复元素的多种方法

    js对数组元素去重有很多种处理的方法,本篇文章中为网络资源整理,当然每个方法我都去实现了:写下来的目的是希望自己活学活用,下次遇到问题后方便解决. 第一种 function oSort(arr){ v ...

  2. js去除数组重复项

    /** * js去除数组重复项 */ //方法一.使用正则法 // reg.test(str),匹配得到就返回true,匹配不到返回false var arr = ["345",& ...

  3. js 判断数组包含某值的方法 和 javascript数组扩展indexOf()方法

    var  questionId = []; var anSwerIdValue = []; ////javascript数组扩展indexOf()方法 Array.prototype.indexOf ...

  4. 探讨js字符串数组拼接的性能问题

    这篇文章主要介绍了有关js对字符串数组进行拼接的性能问题,字符串连接一直是js中性能最低的操作之一,应该如何解决呢?请参看本文的介绍 我们知道,在js中,字符串连接是性能最低的操作之一. 例如: 复制 ...

  5. js之数组,对象,类数组对象

    许久不写了,实在是不知道写点什么,正好最近有个同事问了个问题,关于数组,对象和类数组的,仔细说起来都是基础,其实都没什么好讲的,不过看到还是有很多朋友有些迷糊,这里就简单对于定义以及一下相同点,不同点 ...

  6. js对数组的操作函数

    js数组的操作 用 js有很久了,但都没有深究过js的数组形式.偶尔用用也就是简单的string.split(char).这段时间做的一个项目,用到数组的地方很多, 自以为js高手的自己居然无从下手, ...

  7. JS 索引数组、关联数组和静态数组、动态数组

    JS 索引数组.关联数组和静态数组.动态数组 数组分类: 1.从数组的下标分为索引数组.关联数组 var ary1 = [1,3,5,8]; //按索引去取数组元素,从0开始(当然某些语言实现从1开始 ...

  8. JS 中数组的排序和去重

    在 PHP 中,数组有很多排序方法,不过其他语言的数组中大概是不会像 JS 的数组一样,包罗万象,啥都通吃的.所以 JS 的数组排序情况就略多一些了. 简单粗暴的排序: 赤果果的sort: var   ...

  9. JS去除数组中重复值的四种方法

    JS去除数组中重复值的四种方法 1 /// <summary>            o[this[i]] = "";  }      }       newArr.p ...

随机推荐

  1. dockerfile创建镜像(二)

    ENTRYPOINT 两种格式: ENTRYPOINT [“executable”, “param1”, “param2”] ENTRYPOINT command param1 param2 (she ...

  2. 16.oauth2 + oidc 实现 client部分

    把授权和认证过的Server启动一下先 因为代码是之前的代码,所以有些代码需要清除一下 之类注释掉,因为这里暂时没有用到EFCode了 运行的时候发现一点错误 发现登陆的时候使用的RegisterVi ...

  3. 新浪微博分享出现libc++abi.dylib: terminating with uncaught exception of type NSException微博微信SDK运行编译报错

    SDK出现libc++abi.dylib: terminating with uncaught exception of type NSException  的问题: 解决方法 结合 # 监测bug( ...

  4. 使用Bootstrap实现表格列的显示与隐藏

    来人,上效果图 走官方通道 1.引入样式文件(去github下载样式文件) <!--插件开--> <link rel="stylesheet" href=&quo ...

  5. C#获得当前执行的函数名、当前代码行、源代码文件名

    http://blog.csdn.net/newegg2009/article/details/6220385 C#获得当前执行的函数名.当前代码行.源代码文件名 [日期:2010-10-18 11: ...

  6. unity gl 画线

    using UnityEngine; using System.Collections; public class TGLLine : MonoBehaviour { private static M ...

  7. pgsql如何重启

    正常情况下,pgsql 停止可以执行一下命令: bin/pg_ctl stop -s -D pg_data/ -m fast 此命令和 kill -15 PID 效果相同 但是有时候 pgsql 也会 ...

  8. webSocket的学习以及问题的解决

    查过很多资料,感觉大部分都讲的不够详细,做为一个新人我从webSocket的基本开始学起, 首先webSocket的原理其实和Http差不多,但是由于Http只能被动的去向服务器请求消息,导致缺点太明 ...

  9. Mysql字符串截取总结及项目实际运用:left()、right()、substring()、substring_index()

    在实际的项目开发中有时会有对数据库某字段截取部分的需求,这种场景有时直接通过数据库操作来实现比通过代码实现要更方便快捷些,mysql有很多字符串函数可以用来处理这些需求,如Mysql字符串截取总结:l ...

  10. Android NFC P2P

    http://www.nfc.cc/2011/12/28/development-android-beam-and-nfc-peer-2-peer/