思路:

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. Andriod开发 --插件安装、环境配置、问题集锦

    1.用Eclipse搭建Android开发环境和创建第一个Android项目(Windows平台) 链接阅读http://www.cnblogs.com/allenzheng/archive/2012 ...

  2. 关于weblogic 10.3.6.0 的漏洞复现(1)

    最近小R 搭建了个weblogic,  因为之前在公司找系统漏洞的时候,发现了这个漏洞,所以为了特地专门搭建了个10.3.6.0版本. 漏洞编号: CVE-2017-10271 漏洞的描述:就是web ...

  3. UVa 10213 How Many Pieces of Land ? (计算几何+大数)

    题意:一块圆形土地,在圆周上选n个点,然后两两连线,问把这块土地分成多少块? 析:这个题用的是欧拉公式,在平面图中,V-E+F=2,其中V是顶点数,E是边数,F是面数.对于这个题只要计算V和E就好. ...

  4. myeclipse同时部署两个项目-permgen space

    黑色头发:http://heisetoufa.iteye.com/ 使用myeclipse启动两个SSH2的部署在tomcat6下的项目报出java.lang.OutOfMemoryError: Pe ...

  5. c#重写 重载

    重写:当一个子类继承一父类,而子类中的方法与父类中的方法的名称,参数个数.类型都完全一致时,就称子类中的这个方法重写了父类中的方法. 重写:通常,派生类继承基类的方法.因此,在调用对象继承方法的时候, ...

  6. Asp.net后台创建HTML

    为了使HTML界面中的内容能根据数据库中的内容动态显示用户需要的内容,或者根据权限不同要显示同而实现页面内容的动态创建 使用HtmlGenericControl创建HTML标签 引入命名空间: usi ...

  7. IntelliJ IDEA的自动提示貌似是区分大小写的,首字母小写的话,怎么都提示不出来。

    IntelliJ IDEA的自动提示貌似是区分大小写的,首字母小写的话,怎么都提示不出来. File>Settings>editor >general >code comple ...

  8. Unity2d 骨骼动画1:介绍

    http://bbs.9ria.com/thread-401613-1-1.html by Orlando Pereira and PedroPereira3 days ago2 Comments 在 ...

  9. APP上传

    原文网址: http://blog.csdn.net/ayangcool 前言:作为一名IOS开发者,把开发出来的App上传到App Store是必须的.下面就来详细介绍下具体流程. 1.打开苹果开发 ...

  10. w3c网址和标准化过程