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=( ) 数组用小括号括起,数组元 ...
随机推荐
- UVA10562(看图写树,dfs)
这个题过的好艰难,不过真的学到好多. 关于fgets的用法真的是精髓.!isspace(c)和c!=' '是有区别的. 其它的看代码吧 #include <iostream> #inclu ...
- Python:从入门到实践--第五章--if语句--练习
#1.编写一系列条件测试:将每个测试以及结果打印出来 car = '宝马' if car == "宝马": print("预测正确") print(car) e ...
- java-14习题
.使用TreeSet集合生成一个不重复随机数组,该数组包含10个100以内的随机整数.输出该随机数组. import java.util.Iterator; import java.util.Tree ...
- for循环、while循环、break、continue、exit
1. for循环 语法:for 变量名 in 条件; do …; done案例1 #!/bin/bashsum=0for i in `seq 1 100`do# echo "$sum + $ ...
- 整合spring+springmvc+mybatis
开发环境: jdk 1.8 eclipse 4.7.0 (Oxygen) tomcat 8.5.29 mysql 5.7 开发前准备: spring 框架的jar包,在这里使用的是spring-5.0 ...
- 2.go的变量和常量
go的变量和常量 GO的变量: 变量的声明: 先对变量进行声明,在对其赋值 var variableName type variableName = typeValue var number int ...
- 【frame系列标签】
html框架标签1.内嵌框架 <frame></frame> 在页面上开辟一块空间 frame内部属性: src 要填充的图片或者网址 width height target= ...
- 软件可维护性的影响因素&如何提升
影响因素: 1.可理解性 2.可测试性 3.可修改性 4.可移植性 5.可重用性 如何提升: 1.建立明确的软件质量目标2.使用先进的软件开发技术和工具3.建立明确的质量保证4.选择可维护的语言5.改 ...
- ECharts 从后台动态获取数据 (asp.net)
(一) 使用工具 visual studio 2017:Web开发:asp.net (代码中的js引用路径以及ajax方法调用的url,记得修改哦) (二) 准备工作(此处写给和我一样小白) 1.动态 ...
- python获取机器信息脚本(网上寻找的)
获取机器信息(待测试) # -*- coding: UTF-8 -*- import psutil import json import os import socket import struct ...