思路:

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. AI—家庭组机器人平台环境配置,高级人工智能实验总结

    首先说一下我的环境:Ubuntu 12.04 32bit,  gcc 4.6.3 一,安装boost 1.48,建议用这个版本的,不然会出现兼容性问题 步骤: 其实在ubuntu下,可以用一下命令直接 ...

  2. virtualBox中的centOS虚拟机硬盘扩容

    1. 在virtualBox中给虚拟机添加虚拟硬盘 此时. 已经将yanwu_disk1.vdi 虚拟硬盘添加到了虚拟机中, 接下来就是进行硬盘的挂载 https://www.cnblogs.com/ ...

  3. Understand中的Graphical Views使用

    Graphical Views 用于浏览代码结构. 下面以dso为例 1.Butterfly 显示include关系.例: 2.Declaration 文件中的类.例: 3.UML Class Dia ...

  4. Flutter实战视频-移动电商-39.路由_Fluro的路由配置和静态化

    39.路由_Fluro的路由配置和静态化 handler只是单个路由的配置,这节课我们要学习路由的整体配置 整体配置 新建routers.dart文件来做整体配置 detailsHandler就是我们 ...

  5. HDU - 1241 POJ - 1562 Oil Deposits DFS FloodFill漫水填充法求连通块问题

    Oil Deposits The GeoSurvComp geologic survey company is responsible for detecting underground oil de ...

  6. Weekly Contest 111-------->943. Find the Shortest Superstring(can't understand)

    Given an array A of strings, find any smallest string that contains each string in A as a substring. ...

  7. MySql 长时间读数据发生超时的异常 Mysql Reader Exception TimeOut expired

    mysql connector: .net var r = cmd.ExecuteReader() r.Reader()   // <--长时间不停调用 Timeout expired.  Th ...

  8. python 之 函数 迭代器

    5.9 迭代器 5.91 可迭代对象和迭代器对象 1.什么是迭代?:迭代是一个重复的过程,并且每次重复都是基于上一次的结果而来 2.要想了解迭代器到底是什么?必须先了解一个概念,即什么是可迭代的对象? ...

  9. 简单实现TabBar的自定义

    StackoverFlow上看到的,通过继承UITabBarController创建自定义TabBarController.在原有TabBar的基础上添加一个背景层,在其基础上增加三个自定义按钮,通过 ...

  10. 企业级应用,如何实现服务化三(dubbo入门案例)

    今天是六一儿童节,从千里之外的广州,回到了贵州老家,真好!好山好水好心情,好了接着写点东西.这是企业级应用,如何实现服务化系列的第三篇.在上一篇:企业级应用,如何实现服务化二(dubbo架构)中,认识 ...