我们可能总是会遇到根据一个属性或多个属性值从数组或对象数组中删除项目的时候 , 今天让我们看看根据属性值从数组中删除或过滤项目有哪些不同的方法 。
1、POP
“pop() 方法从数组中删除最后一个元素并返回该元素 。 这个方法改变了数组的长度 。 ” (来源:MDN)
数组:
let arraypoptest = [2 1 2 5 6 7 8 9 9 10
;
let testpop = arraypoptest.pop();
console.log(\"array pop\" testpop\"-\" arraypoptest);
//10 - [2 1 2 5 6 7 8 9 9
;
对象数组:
let users1 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
let testpop1 = users1.pop();
console.log(
\"array of objects pop\"
JSON.stringify(testpop1)\"-\"
JSON.stringify(users1)
);
//{\"id\":4\"name\":\"sara\" - [{\"id\":1\"name\":\"ted\"{\"id\":2\"name\":\"mike\"{\"id\":3\"name\":\"bob\"
2、Shift()
“shift() 方法从数组中移除第一个元素并返回移除的元素 。 这个方法改变了数组的长度 。 ” (来源:MDN)
数组:
let arrayshifttest = [2 1 2 5 6 7 8 9 9 10
;
let testshift = arrayshifttest.shift();
console.log(\"array shift\" testshift\"-\" arrayshifttest);
//2 - [1 2 5 6 7 8 9 9 10
对象数组:
let users2 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
【微信|web前端 - JavaScript 中删除/过滤数组的方法总结】let testshift1 = users2.shift();
console.log(\"array of objects shift\" JSON.stringify(testshift1)\"-\" JSON.stringify(users2));
//{\"id\":1\"name\":\"ted\" - [{\"id\":2\"name\":\"mike\"{\"id\":3\"name\":\"bob\"{\"id\":4\"name\":\"sara\"
3、slice
“slice() 方法将数组的一部分的浅拷贝返回到从开始到结束(不包括结束)选择的新数组对象中 , 其中开始和结束表示该数组中项目的索引 。 不会修改原始数组 。 ” (来源:MDN)
数组:
let arrayslicetest = [2 1 2 5 6 7 8 9 9 10
;
let testslice = arrayslicetest.slice(0 3);console.log(\"array slice\" testslice arrayslicetest);
//not changed original array//[2 1 2
- [2 1 2 5 6 7 8 9 9 10
对象数组:
let users3 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
let testslice1 = users3.slice(0 3);
console.log(\"array of objects slice\" JSON.stringify(testslice1));
//not changed original array
//[{\"id\":1\"name\":\"ted\"{\"id\":2\"name\":\"mike\"{\"id\":3\"name\":\"bob\"
4、splice
“ splice() 方法通过删除或替换现有元素和/或在适当位置添加新元素来更改数组的内容 。 ” (来源:MDN)
数组:
let arraysplicetest = [2 1 2 5 6 7 8 9 9 10
;
let testsplice = arrayslicetest.splice(0 3);
对象数组:
let users4 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
let testspice1 = users3.splice(0 3);console.log(\"array of objects splice\" JSON.stringify(testsplice));
//[{\"id\":1\"name\":\"ted\"{\"id\":2\"name\":\"mike\"{\"id\":3\"name\":\"bob\"
5、使用 splice 删除特定值
数组:
let arr = [2 1 2 5 6 7 8 9 9 10
;
for (var i = 0; i < arr.length; i++) {
if (arr[i
=== 5) {
arr.splice(i 1);
console.log(\"splice with specific value\" arr);
//[2 1 2 6 7 8 9 9 10
对象数组:
let users5 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
for (var i = 0; i < users5.length; i++) {
if (users5[i
.name === \"ted\") {
users5.splice(i 1);
console.log(\"splice with specific value array of objects\"JSON.stringify( users5));
//[{\"id\":2\"name\":\"mike\"{\"id\":3\"name\":\"bob\"{\"id\":4\"name\":\"sara\"
6、使用 splice 删除特定值 — 简写
“ splice() 方法通过删除或替换现有元素 , 或在适当位置添加新元素来更改数组的内容 。 ”(来源:MDN)
“indexOf() 方法返回可以在数组中找到给定元素的第一个索引 , 如果不存在 , 则返回 -1 。 ”(来源:MDN)
数组:
let arrShorthand = [1 2 3 4 5 6 7 8 9 0
;
let val = arr.indexOf(5);
arrShorthand.splice(val 1);
console.log(\"splice shorthand specific value\" arrShorthand);
//[1 2 3 4 5 6 7 8 9
对象数组:
let users6 = [
{ id: 1 name: \"ted\"
{ id: 2 name: \"mike\"
{ id: 3 name: \"bob\"
{ id: 4 name: \"sara\"
;
var removeIndex = users6.map(item => item.id).indexOf(1);
users6.splice(removeIndex 1);
- 双十二|Web前端培训:一些常见的HTML代码验证器
- 美团|支付二维码管制,微信、支付宝躺枪,谁是最大赢家?
- 电子商务|“退微信群”谣言背后:总有人用阴谋论湮没常识
- Google|Web前端培训:为什么React在前端开发中如此流行?
- 物联网|物联网解决方案的前端开发
- 蚂蚁金服|个人码禁收款 蚂蚁金服、微信支付、第四方支付谁是最后赢家?
- 微信|2021年轻人熬夜报告:熬夜最狠的行业,互联网只能排第二
- 手机行业|汉天下突破射频前端市场垄断格局
- 微信|华为“天才少年”钟钊,两年时间,突破两大技术瓶颈
- 支付宝|微信刚刚更新的功能,支付宝也有了