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)打印出来的结果已经帮我们把需要的 ...
随机推荐
- 30:33 error 'scope' is defined but never used vue/no-unused-vars
由于一直报错,所以把这个slot-scope="scope"删除掉
- asp.net.core学习笔记1:swagger的使用和webapi接收Jobject对象
环境:asp.net.core 3.1 (一觉醒来官方已经不推荐3.0了,于是没有任何core经验,也只能开始了3.1的开发学习) 由于现有项目前后端分离.微服务化日趋流行,所以上手不采用web应用( ...
- sqlite 数据更新
1.整个库迁移(命令) https://blog.csdn.net/kevin_weijc/article/details/78920593 2.单个表数据导入(attach,在数据库中添加附加数据库 ...
- jenkins目录
Jenkins目录详解: jobs目录:创建的所有jenkins工程.并含有所有构建历史记录和日志.其中config.xml为具体配置. plugins:所有插件 workspace:构建工程本机源码 ...
- 096_mulesoft with salesforce _01
https://docs.mulesoft.com/mule-runtime/3.5/connect-with-salesforce-example https://www.youtube.com/w ...
- 针对Vmware打开BIOS中VT虚拟化相关后仍然报错
安装虚拟机时报错问题现象: 通过VMware虚拟机安装Centos时提示弹出提示框,"已将该虚拟机配置为使用64位客户机操作系统,但是,无法执行64位操作."具体提示如下图所示: ...
- JavaScript 数字与字符串的加减乘除运算
点击跳转 Tips: 除开字符串 + 数字的运算,会产生级联,其他情况下会将 String 转为 number 再进行数字运算. js 运算是从左到右的,所以一步一步来,不要跳步进行运算.
- ZooKeeper的主要应用场景
什么是Zookeeper ZooKeeper主要服务于分布式系统,可以用ZooKeeper来做:统一配置管理.统一命名服务.分布式锁.集群管理. 使用分布式系统就无法避免对节点管理的问题(需要实时感知 ...
- 第二周集训队比赛wp
Web1 直接截包改get为Host: Web2: 不一样的猪圈 普通的猪圈变种 NormalPwn 用IDA查看发现main下面有一个危险函数点进去发现/bin/sh 进main空格发现找cmman ...
- 12组-Beta冲刺-1/5
12组-Beta冲刺-1/5 一.基本情况 队名:字节不跳动 组长博客:https://www.cnblogs.com/147258369k/p/15590128.html Github链接:http ...