翼度科技»论坛 编程开发 JavaScript 查看内容

前端JS,删除JSON数据(JSON数组)中的指定元素方式

7

主题

7

帖子

21

积分

新手上路

Rank: 1

积分
21
前端JS,删除JSON数据(JSON数组)中的指定元素

在前端处理JSON的时候,可能会删除JSON数据中的某个元素。采用的方式是使用delete
例如:
  1. var jsonData = {a:1,b:2,C:3};
  2. delete jsonData.a;
  3. console.log(jsonData);
复制代码
上面使用delete,删除了jsonData中的a元素了,此时jsonData的结果为:

如果是要删除JSON数组中的某个元素的json,则使用下面的方式:
  1. var jsonArr = new Array();
  2. jsonArr.push({a:1,b:2,C:3});
  3. jsonArr.push({a:1,b:2,C:3});
  4. jsonArr.push({a:1,b:2,C:3});
  5. delete jsonArr[1].a;
  6. console.log(jsonArr);
复制代码
此时,删除了数组中第二个元素数据中JSON的a元素:


JS删除JSON数组中的元素的两种方法:delete和splice

最近的需求中,需要从JSON数组中删除元素,之前不太了解,特地查了一下,总结一下:
splice(startIndex,count);这个方法用于从数组的第startIndex位开始,删除count个元素。
说明:
1、满足条件的元素直接被删除,脚标重信排
2、startIndex应该可以为任意数字和字符(用应该是因为我只字符我只是测了一两个,具体规律不清楚)。若为数字则自动调用parseInt方法处理(去除小数部分);若startIndex小于等于-1,则根据parseInt方法得到的结果,从后往前数,超出则不处理;若startIndex大于-1,则根据parseInt方法得到的结果,从前往后数(0开始),超出则不处理。
3、count为非数字时无效(不报错),若为数字则自动调用parseInt方法处理(去除小数部分);若count小于1,不做任何处理;若count大于等于1,则根据parseInt方法得到的结果,删除满足条件的元素,若对应位置没有元素,则不做任何处理(不报错)。
delete array;这个方法用于删除数组中第i个元素,替换为null(有帖子说是undefined,但是我自己测试结果是null,可能是浏览器的关系)。
说明:
1、脚标不为正整数,将不做处理(不报错)
2、脚标所指向的元素不存在,将不做处理(不报错)
贴一些测试代码(以上信息主要根据自己理解和测试结果,浏览器为ie11,可能存在遗漏或者其他浏览器不兼容的问题,实际使用的时候,需要多测试):
  1. <html>
  2. <script src="jquery-1.11.3.min.js"></script>
  3. <script>
  4. window.onload = function(){
  5.         var test1 = [{"a":"1"},{"b":"3"}, {"c":"5"}];
  6.         console.log(test1.length+"---"+JSON.stringify(test1));
  7.         // 3---[{"a":"1"},{"b":"3"},{"c":"5"}]
  8.         test1.splice(0, 1);
  9.         // 从第0个元素开始,删除1个
  10.         console.log(test1.length+"---"+JSON.stringify(test1));
  11.         // 2---[{"b":"3"},{"c":"5"}]
  12.         var test2 = [{"a":"1"},{"b":"3"}, {"c":"5"}];
  13.         console.log(test2.length+"---"+JSON.stringify(test2));
  14.         // 3---[{"a":"1"},{"b":"3"},{"c":"5"}]
  15.         test2.splice(0, 2);
  16.         // 从第0个元素开始,删除2个
  17.         console.log(test2.length+"---"+JSON.stringify(test2));
  18.         // 1---[{"c":"5"}]
  19.         var test3 = [{"a":"1"},{"b":"3"}, {"c":"5"}];
  20.         console.log(test3.length+"---"+JSON.stringify(test3));
  21.         // 3---[{"a":"1"},{"b":"3"},{"c":"5"}]
  22.         test3.splice(1, 1);
  23.         // 从第1个元素开始,删除1个
  24.         console.log(test3.length+"---"+JSON.stringify(test3));
  25.         // 2---[{"a":"1"},{"c":"5"}]
  26.         var test4 = [{"a":"1"},{"b":"3"}, {"c":"5"}];
  27.         console.log(test4.length+"---"+JSON.stringify(test4));
  28.         // 3---[{"a":"1"},{"b":"3"},{"c":"5"}]
  29.         delete test4[1];
  30.         // 将第1个元素删除,用null填充
  31.         console.log(test4.length+"---"+JSON.stringify(test4));
  32.         // 3---[{"a":"1"},null,{"c":"5"}]
  33.         for (i in test4){
  34.                 console.log(JSON.stringify(test4[i]))
  35.                 // {"a":"1"}        {"c":"5"}
  36.         }       
  37. }
  38. </script>
  39. </html>
复制代码
IE控制台输出结果:


总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

来源:https://www.jb51.net/javascript/28450707o.htm
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x

举报 回复 使用道具