思路:

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. Dapper的正确使用姿势

    本文demo适用于MySQL Dapper优势和缺点 优点 高性能.易排查.易运维.灵活可控 缺点 和EF相比,手写sql当修改表结构不易发现bug. 习惯了EF后再来使用Dapper,会很难适应那种 ...

  2. Python的一些技巧

    a = [32, 37, 28, 30, 37, 25, 27, 24, 35, 55, 23, 31, 55, 21, 40, 18, 50, 35, 41, 49, 37, 19, 40, 41, ...

  3. Codevs 1043 方格取数

    1043 方格取数 2000年NOIP全国联赛提高组  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 钻石 Diamond 题解  查看运行结果     题目描述 Descri ...

  4. luoguP2408不同子串个数

    传送门 可以知道每一个子串都是后缀的前缀,那么对于第\(i\)小的后缀的贡献就可以表示为n-sa[i]+1 然而会存在重复的子串,注意height数组的定义,对于sa[i-1]和sa[i],只有hei ...

  5. Jquery | 基础 | 项目实践

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. Qt 2D绘图之四:绘图中的其他问题

    一.重绘事件 前面讲到的所有绘制操作都是在重绘事件处理函数paintEvent()中完成的,是QWidget类中定义的函数.一个重绘事件用来重绘一个部件的全部或者部分区域,下面几个原因中的任意一个都会 ...

  7. java中代码执行顺序

    静态代码块 -- >构造代码块 --> 构造方法静态代码块:只执行一次构造代码块:每次调用构造方法都执行 http://blog.csdn.net/wuhaiwei002/article/ ...

  8. 利用HtmlParser解析网页内容

    一,htmpparser介绍 htmlparser是一个功能比较强大的网页解析工具,主要用于 html 网页的转换(Transformation) 以及网页内容的抽取 (Extraction). 二, ...

  9. Sql 2000系统表 语句查询表结构

     SQL2000系统表的应用  –1:获取当前数据库中的所有用户表 select Name from sysobjects where xtype=’u’ and status>=0 –2:获取 ...

  10. MySQL慢查询日志的使用

    当系统性能达到瓶颈的时候,就需要去查找那些操作对系统的性能影响比较大,这里可以使用数据库的慢查询日志功能来记录一些比较耗时的数据可操作来确定哪些地方需要优化. 下面介绍一下使用慢查询日志的一些常用命令 ...