es6 实现数组的操作
1、实现数组的去重:
1.1、方法一:
let arr = [{id: 1, name: 'aa'}, {id: 2, name: 'bb'}, {id: 3, name: 'cc'}, {id: 4, name: 'dd'}, {id: 5, name: 'ee'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}]; function unique(array) {
const res = new Map();
return array.filter((arr) => !res.has(arr.id) && res.set(arr.id, 1)); //用列表的id判断是否有重复
} unique(arr);
1.2、方法二:
let hash = {},
arr = [{id: 1, name: 'aa'}, {id: 2, name: 'bb'}, {id: 3, name: 'cc'}, {id: 4, name: 'dd'}, {id: 5, name: 'ee'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}, {id: 1, name: 'aa'}]; const newArr = arr.reduceRight((item, next) => {
hash[next.id] ? '' : hash[next.id] = true && item.push(next);
return item;
}, []); console.log(newArr);
2、实现数组的过滤:
let arr = [{id: 1, name: 'aa'}, {id: 2, name: 'bb'}, {id: 3, name: 'cc'}, {id: 4, name: 'dd'}, {id: 5, name: 'ee'}]; function filter(arrayList, id) {
let temp = arrayList.filter((list) => {
if(list.id === id) { //过滤列表id等于id值,相反也可以用"!=="来过滤不等于id值的列表
return list;
}
});
return temp;
} filter(arr, 1);
3、数组的相同属性值的合并:
let a = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 1, name: 'c'},{id: 3, name: 'd'}, {id: 2, name: 'e'}, {id: 4, name: 'f'}]; let b = a.reduce((memo, {id, name}) => {
!memo[id] ? memo[id] = name : memo[id] += name;
return memo;
}, {}); //{1: "ac", 2: "be", 3: "d", 4: "f"}
4、数组的扁平化:
function convert(val) {
return val.reduce((init, next) => {
if(typeof next === 'object') {
next.forEach(item => {
if(typeof item === 'object') {
init = init.concat(convert(item));
} else {
init.push(item);
}
});
} else {
init.push(next);
}
return init;
}, [])
} Array.from(new Set(convert([1, 2, [3, 2, 1, [1, 2, 3, 4]]]))); //[1, 2, 3, 4]
5、摘取数组对象的某几个字段:
var arr = [
{
'id': '1',
'name': 'img1',
'imgUrl': './img1.jpg',
},
{
'id': '2',
'name': 'img2',
'imgUrl': './img2.jpg',
},
{
'id': '3',
'name': 'img3',
'imgUrl': './img3.jpg',
}
];
arr.map(x => {return {'imgUrl': x.imgUrl, 'name': x.name}})
6、两个数组拼接成对象数组:
方法一:
let metrodates = ['2008-01', '2008-02', '2008-03'];
let figures = [0, 0.555, 0.293];
let output = metrodates.map((date, i) =>({date, data: figures [i]}));
console.log(output); //[{date: "2008-01", data: 0}, {date: "2008-02", data: 0.555}, {date: "2008-03", data: 0.293}]
方法二:
const zip = ([x, ...xs], [y, ...ys]) => {
if(x === undefined || y === undefined)
return [];
else
return [[x, y], ...zip(xs, ys)];
}
let metrodates = ['2008-01', '2008-02', '2008-03'];
let figures = [0, 0.555, 0.293];
let output = zip(metrodates, figures).map(([date, data]) =>({date, data}));
console.log(output); //[{date: "2008-01", data: 0}, {date: "2008-02", data: 0.555}, {date: "2008-03", data: 0.293}]
方法三:
const isEmpty = xs => xs.length === 0;
const head =([x, ...xs]) => x;
const tail =([x, ...xs]) => xs;
const map = (f, ...xxs) => {
let loop = (acc, xxs) => {
if(xxs.some(isEmpty))
return acc;
else
return loop([...acc, f(...xxs.map(head))], xxs.map(tail));
};
return loop([], xxs);
};
let metrodates = ['2008-01', '2008-02', '2008-03'];
let figures = [0, 0.555, 0.293];
let output = map((date, data) =>({date, data}), metrodates, figures);
console.log(output);
es6 实现数组的操作的更多相关文章
- es6常用数组操作及技巧汇总
定义数组 const array = [1, 2, 3]; // 或者 const array = new Array(); array[0] = '1'; 检测数组 Array.isArray([] ...
- ES6 二进制数组
二进制数组(ArrayBuffer对象.TypedArray视图和DataView视图)是JavaScript操作二进制数据的一个接口.这些对象早就存在,属于独立的规格(2011年2月发布),ES6将 ...
- 微信小程序setData()方法的详解以及对数组/json操作
此篇文章是本人对setData方法的一些理解,是查阅文档和查找一些其他资料综述的,有所不足希望指正! 直接进入正题! 一.setData()方法: 1.参数接受一个对象,以key,value的形式表示 ...
- ES6定型数组
前面的话 定型数组是一种用于处理数值类型(正如其名,不是所有类型)数据的专用数组,最早是在WebGL中使用的,WebGL是OpenGL ES 2.0的移植版,在Web 页面中通过 <canvas ...
- JavaScript数组常见操作
JavaScript数组常见操作 Tip: 右键在新标签中打开查看清晰大图 下面介绍JavaScript中的数组对象遍历.读写.排序等操作以及与数组相关的字符串处理操作 创建数组 一般使用数组字面量[ ...
- 数组去重----es6&es5&数组对象去重
es6方法: 普通数组: 1.使用Array.from(new Set(arr)); /* * @param oldArr 带有重复项的旧数组 * @param newArr 去除重复项之后的新数组 ...
- JS 数组常见操作汇总,数组去重、降维、排序、多数组合并实现思路整理
壹 ❀ 引 JavaScript开发中数组加工极为常见,其次在面试中被问及的概率也特别高,一直想整理一篇关于数组常见操作的文章,本文也算了却心愿了. 说在前面,文中的实现并非最佳,实现虽然有很多种,但 ...
- JavaScript jQuery 中定义数组与操作及jquery数组操作
首先给大家介绍javascript jquery中定义数组与操作的相关知识,具体内容如下所示: 1.认识数组 数组就是某类数据的集合,数据类型可以是整型.字符串.甚至是对象Javascript不支持多 ...
- Linux Shell数组常用操作详解
Linux Shell数组常用操作详解 1数组定义: declare -a 数组名 数组名=(元素1 元素2 元素3 ) declare -a array array=( ) 数组用小括号括起,数组元 ...
随机推荐
- [ 随手记6 ] C/C++ 形参、实参、按值传参、指针传参、引用传参
个人原创: 1. 形参:形式上的参数,一般多在函数声明.函数定义的参数上: 2. 实参:实体参数,有实际的值,在运算上被循环使用的值: 3. 按值传参:按值,就是把实际的值传给函数内部: 4. 指针传 ...
- c++中函数的内存注意项
函数不能返回指向栈内存的指针!因为返回的都是值拷贝! char *str = "abcd"这样就是字符串常量,这种能返回,而char str[] = "abcd" ...
- springcould 微服务 搭建
摘自:https://www.cnblogs.com/lori/p/10615654.html (完整) springcloud~服务注册与发现Eureka的使用 服务注册与发现是微服务里的 ...
- 从码云上下载react项目并配置成可运行状态
(第一次写,如有不足之处,欢迎指出) 一.下载项目: 1.首先保证安装了git, 2.然后在本地想要存放项目位置打开git(Git Bash Here),再复制码云中如图所示的地址: 3.在git中输 ...
- 软件测试_Fiddler抓包工具一
多数资料摘抄至 https://www.cnblogs.com/miantest/p/7289694.html 一.在 macOS 下如何安装 (https://www.telerik.com/fid ...
- Linux压缩和解压缩
1.tar.gz tar.gz这种格式是Linux下使用得最多的压缩格式.它在压缩时不会占用太多CPU的,而且可以得到一个非常理想的压缩率. tar -zcvf archive_name.tar.gz ...
- what are you 弄啥嘞!!!!!!!!!!!!!!!!泛型
1.为什么需要泛型 泛型在Java中有很重要的地位,网上很多文章罗列各种理论,不便于理解,本篇将立足于代码介绍.总结了关于泛型的知识.希望能给你带来一些帮助. 先看下面的代码: List list = ...
- Python变量和常量
1.什么是变量 变量:核心在于变和量儿字,变->变化,量->状态如何定义? x=1 变量名 变量赋值符号:= 变量值:1 其中变量名又称为标识符: 1. 可以是字母,数字,下划线的任意组合 ...
- Javascript 4.3 事件处理函数
鼠标指针悬停在某个元素上时触发一个动作:onmouseover事件处理函数 鼠标指针离开某个元素时触发一个动作:onmouseout事件处理函数 点击某个链接时触发一个动作:onclick事件处理函数 ...
- 如何写更少的 if else
首先声明,不是要消除if 而是,减少一些不必要的if判断,使得代码更优雅,更重要的是提高可维护性 most easy use Ternary: var result = condiction? tru ...