es6数组去重、数组中的对象去重 && 删除数组(按条件或指定具体元素 如:id)&& 筛选去掉没有子组件的父组件
// 数组去重
{
const arr = [1,2,3,4,1,23,5,2,3,5,6,7,8,undefined,null,null,undefined,true,false,true,‘中文‘,‘‘,‘‘,‘hello‘,‘中文‘];
// 第一种
const r = [...new Set(arr)];
console.log(r); // [1, 2, 3, 4, 23, 5, 6, 7, 8, undefined, null, true, false, "中文", "", "hello"] // 第二种
const R = arr.reduce((all,name) => all.includes(name) ? all :[...all,name],[]);
console.log(R); // [1, 2, 3, 4, 23, 5, 6, 7, 8, undefined, null, true, false, "中文", "", "hello"] // 第三种
const k = arr.filter((item, i) => i === arr.indexOf(item));
console.log(k); // [1, 2, 3, 4, 23, 5, 6, 7, 8, undefined, null, true, false, "中文", "", "hello"]
} // 统计每个元素在数组中出现的次数
{
const arr = [‘zhangsan‘, ‘lisi‘, ‘wangwu‘, ‘zhangsan‘, ‘lisi‘, ‘wangwu‘,‘zhaosi‘,‘liuneng‘];
const r = arr.reduce((all, name) =>{
if(name in all){
all[name]++
}else{
all[name] = 1;
}
return all;
},{});
console.log(r); // {zhangsan: 2, lisi: 2, wangwu: 2, zhaosi: 1, liuneng: 1}
} // 数组对象去重
{
const arr = [
{
name:‘zhangsan‘,
age:12
},
{
name:‘lisi‘,
age:14
},
{
name:‘zhangsan‘,
age:12
},
{
name:‘lisi‘,
age:14
},
{
name:‘zhangsan‘,
age:12
},
{
name:‘lisi‘,
age:14
},
{
name:‘zhangsan‘,
age:12
},
{
name:‘wangwu‘,
age:16
},
{
name:‘wagnwu‘,
age:16
},
{
name:‘lisi‘,
age:14
}, ] // 根据 age 去重
// 方法一
const age = ‘age‘;
const r = arr.reduce((all, next) => all.some((atom) => atom[age] == next[age]) ? all : [...all, next],[]);
console.log(r); }
//指定具体元素//删除id=5的
let arr = [
{ id: 1, name: '北京' },
{ id: 2, name: '上海' },
{ id: 3, name: '深圳' },
{ id: 4, name: '广州' },
{ id: 5, name: '青岛' }
]
arr.splice(arr.findIndex(item=>item.id==5),1)
//find方法用于查找第一个符合条件的数组成员,如果没有找到返回undefind
let target = arr.find((item,index) => {
return item.id ==1
})
console.log(target)
//删除id大于3的(只保留小于等于3)
let arr2 = arr.reduce((total, current) => {
current.id<= 3 && total.push(current);
return total;
}, []);
//筛选去掉没有子组件的父组件 (parentId为0代表是父组件)
let arr = [
{
name:'1',
id:1,
parentId:0
},{
name:'3',
id:3,
parentId:0
},{
name:'2',
id:2,
parentId:0
},{
name:'1333',
id:13,
parentId:1
},{
name:'2444',
id:24,
parentId:2
}]
arr = arr.filter((x, index, self)=>{
// x : 数组每一项的值
// index: 每一项的下标
// self: 当前数组
return x.parentId!=0 || self.some((atom) => atom['parentId'] == x['id'] )
})
es6数组去重、数组中的对象去重 && 删除数组(按条件或指定具体元素 如:id)&& 筛选去掉没有子组件的父组件的更多相关文章
- vuejs利用props,子组件修改父组件的数据,父组件修改子组件的的数据,数据类型为数组
博文参考 传送们点一点 父组件: <template> <div> <aa class="abc" v-model="test" ...
- Vue中利用$emit实现子组件向父组件通信
Vue中利用$emit实现子组件向父组件通信 父组件 <template> <div> <p>我是父组件</p> <child :isShow=& ...
- 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法
一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...
- 从给数组中的对象去重看Javascript中的reduce()
假设有这样一个数组: let person = [ {id: 0, name: "小明"}, {id: 1, name: "小张"}, {id: 2, name ...
- java 集合 HashSet 实现随机双色球 HashSet addAll() 实现去重后合并 HashSet对象去重 复写 HashCode()方法和equals方法 ArrayList去重
package com.swift.lianxi; import java.util.HashSet; import java.util.Random; /*训练知识点:HashSet 训练描述 双色 ...
- vue 解决双向绑定中 父组件传值给子组件后 父组件值也跟着变化的问题
说明: 近日开发中碰见一个很诡异的问题, 父组件动态的修改对象 data 中的值, 然后将这个对象 data 传给子组件, 子组件拿到后将 data 中的值 乘以 100 ,发现父组件中的值也跟着变 ...
- vue中父组件给子组件传值,子组件给父组件传值
1.父组件传给子组件 父元素中 子元素中(通过props传值) 2.子组件传给父组件 子元素中(this.$emit(传过去的名字,传的参数)) 父元素中 通过changeShow的参数data 把修 ...
- 关于Vue中,父组件获取子组件的数据(子组件调用父组件函数)的方法
1. 父组件调用子组件时,在调用处传给子组件一个方法 :on-update="updateData" 2. 子组件在props中,接收这个方法并声明 props: { onUp ...
- 【Vue项目笔记】—— 父子组件之间传递参数和子组件执行父组件中的方法
父组件(MyBlog.vue) <template> <!-- Delete Modal --> <!-- 注意:这里的@deleteBlog中的deleteBlog要和 ...
- 小姐姐手把手教你JS数组中的对象去重
有时候数据库中的数据重复的,我们另一个需求需要数据的唯一性 那么这时候就用到这个方法了 我还是以截图的方式发粗来 不然太丑了 见谅 console.log(map)打印出来的结果已经帮我们把需要的 ...
随机推荐
- .NET版本发展史
.NET从始至今可以分为3个阶段,分别是.NET Framework阶段..NET Core阶段..NET阶段: .NET Framework终结于.NET Framework4.8版本,.NET C ...
- Unity 性能分析小工具
下文有两个方法,分别是一段检测执行过程耗费时间的代码,还有一个是保存和加载Unity Profiler 的代码(因为UnityProfiler 只能显示一部分的数据,如果运行时间长的话有部分分析数据查 ...
- js把一个数组的数据平均到几个数组里面
arr 原始数组数据 count 每个数组里面元素个数 function splitIpLit(arr,count) { let i = 0; let newArr = []; while(i &l ...
- LWC-001_Event
文章来源: Events (lwc.dev) 1. 监控子组件的动作: Child.html <template> <button>Click</button> & ...
- html原声启动本地服务器,用http-server启动本地服务器
第一: 准备node.js环境: 打开cmd,输入:npm install http-server -g 第二: 安装 http-server npm install http-server -g 安 ...
- Win11 win10系统分区时出现defrag事件怎么解决?
Win11系统分区时出现defrag事件怎么解决?最近有用户反映这个问题,在重新整理磁盘分区的时候,遇到出现了defrag事件,不知道怎么解决,针对这一问题,本篇带来了详细的Win11系统分区时出现d ...
- 20203412马畅若 实验三 《Python程序设计》Socket编程技术实验报告
实验三 Socket编程技术 课程:<Python程序设计>班级: 2034姓名: 马畅若学号:20203412实验教师:王志强实验日期:2020年5月30日必修/选修: 公选课 ##1. ...
- LightOJ - 1162 Min Max Roads
LightOJ - 1162 Min Max Roads 题解:在线倍增LCA和模拟ST表 让我们求从\(u->v\)最短路径上的边权最大值和边权最小值,那么我们可以利用倍增思想,类似其\(fa ...
- 蓝牙信标、智能楼宇应用国产低功耗芯片BLE5.2 PHY6252
PHY6252是一款支持BLE 5.2功能的系统级芯片(SoC),集成了低功耗的高性能多模射频收发机,搭载32位高性能低功耗处理器,提供64K retention SRAM.可选512/256K Fl ...
- 在platformio自动上传esp8266固件
不想每次上传固件的时候手工点按钮,修改这个文件:C:\Users\你的登录名.platformio\platforms\espressif8266\builder\main.py 在319行UPLOA ...