js删除对象/数组中null、undefined、空对象及空数组方法示例


Posted in Javascript onNovember 14, 2018

这两天在项目中遇到后台需要传的数据为不能有null,不能有空值,而这个数据又是一个庞大的对象,对组集合,所以写了个方法来解决这个问题。为了兼具所有的种类类型,封装了方法,代码如下:

let obj = {
  a: {
   a_1: 'qwe',
   a_2: undefined,
   a_3: function (a, b) {
    return a + b;
   },
   a_4: {
    a_4_1: 'qwe',
    a_4_2: undefined,
    a_4_3: function (a, b) {
     return a + b;
    },
    a_4_4: {
     a_4_4_1: undefined,
     a_4_4_2: undefined,
     a_4_4_3: undefined,
     a_4_4_4: {
      a_4_4_4_1: undefined,
      a_4_4_4_2: undefined,
      a_4_4_4_3: undefined,
      a_4_4_4_4: undefined,
      a_4_4_4_5: undefined,
      a_4_4_4_6: undefined
     }
    }
   }
  },
  b: [{
   a_1: 'qwe',
   a_2: undefined,
   a_3: function (a, b) {
    return a + b;
   },
   a_4: {
    a_4_1: 'qwe',
    a_4_2: undefined,
    a_4_3: function (a, b) {
     return a + b;
    },
    a_4_4: {
     a_4_4_1: undefined,
     a_4_4_2: undefined,
     a_4_4_3: undefined,
     a_4_4_4: {
      a_4_4_4_1: undefined,
      a_4_4_4_2: undefined,
      a_4_4_4_3: undefined,
      a_4_4_4_4: undefined,
      a_4_4_4_5: undefined,
      a_4_4_4_6: undefined
     }
    }
   }
  }],
  c: [{
   a: undefined,
   b: undefined,
   c: undefined,
   d: undefined
  }, {
   a: undefined,
   b: undefined,
   c: undefined,
   d: undefined
  }]
 };

以下是javaScript部分:

//判断对象是否没有属性,如{}或者[]
 function isEmptyObj(o) { for (let attr in o) return !1; return !0 }
 function processArray(arr) {
  for (let i = arr.length - 1; i >= 0; i--) {
   if (arr[i] === null || arr[i] === undefined) arr.splice(i, 1);
   else if (typeof arr[i] == 'object') removeNullItem(arr[i], arr, i);
  }
  return arr.length == 0
 }
 function proccessObject(o) {
  for (let attr in o) {
   if (o[attr] === null || o[attr] === undefined) delete o[attr];
   else if(typeof o[attr]=='object') {
    removeNullItem(o[attr]);
    if (isEmptyObj(o[attr])) delete o[attr];
   }
  }
 }
 function removeNullItem(o,arr,i) {
  let s = ({}).toString.call(o);
  if (s == '[object Array]') {
   if (processArray(o) === true) {//o也是数组,并且删除完子项,从所属数组中删除
    if (arr) arr.splice(i, 1);
   }
  }
  else if (s == '[object Object]') {
   proccessObject(o);
   if (arr&&isEmptyObj(o)) arr.splice(i, 1);
  }
 }
 removeNullItem(obj)
 console.log(obj)

如果只处理对象null,undefined项,不移除数组中undefined,null的项,保持数组长度则去掉removeNullItem,processArray删除数项即可,测试数据在上面示例中

js删除对象/数组中null、undefined、空对象及空数组方法示例

-收缩JavaScript代码

function processArray(arr) {
  for (let i = arr.length - 1; i >= 0; i--) {
   /*if (arr[i] === null || arr[i] === undefined) arr.splice(i, 1);
   else */if (typeof arr[i] == 'object') removeNullItem(arr[i], arr, i);
  }
  return arr.length == 0
 }
 function removeNullItem(o,arr,i) {
  let s = ({}).toString.call(o);
  if (s == '[object Array]') {
   if (processArray(o) === true) {//o也是数组,并且删除完子项,从所属数组中删除
    //if (arr) arr.splice(i, 1);
   }
  }
  else if (s == '[object Object]') {
   proccessObject(o);
   //if (arr&&isEmptyObj(o)) arr.splice(i, 1);
  }
 }

附:javascript 判断变量 是否为空null,undefined, 空数组,空对象,空Object,字符串是否为空或全由空白字符组成,数字是否为0,布尔是否为false。由于Object没有length用

Object.keys()适用于数组(IE8不支持此属性),对象 返回可枚举的实例属性名组成的数组来判断是否为空。

利用逻辑判断中or (||)只要有一项为真则不再计算下一个表达式 来实现不管传入的参数是何种类型。只要符合我对空的定义即返回true。

function IsNothing(e) {
 var isNt = e === 0 || e === false || e === null || e === undefined || Object.keys(e).length === 0 || /^\s*$/gim.test(e.toString());
 return isNt;
 }

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
javascript实现仿银行密码输入框效果的代码
Dec 13 Javascript
IE本地存储userdata的一个bug说明
Jul 01 Javascript
Javascript 类、命名空间、代码组织代码
Jul 31 Javascript
关于JavaScript中string 的replace
Apr 12 Javascript
js动态设置div的值下例子
Oct 29 Javascript
jQuery中[attribute^=value]选择器用法实例
Dec 31 Javascript
js中split和replace的用法实例
Feb 28 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
Apr 17 Javascript
jquery+css实现侧边导航栏效果
Jun 12 jQuery
JS实现的JSON序列化操作简单示例
Jul 02 Javascript
Bootstrap模态对话框中显示动态内容的方法
Aug 10 Javascript
layui 解决form表单点击无反应的问题
Oct 25 Javascript
Vue 框架之键盘事件、健值修饰符、双向数据绑定
Nov 14 #Javascript
Vue源码探究之状态初始化
Nov 14 #Javascript
vue使用laydate时间插件的方法
Nov 14 #Javascript
js使用Promise实现简单的Ajax缓存
Nov 14 #Javascript
微信jssdk逻辑在vue中的运用详解
Nov 14 #Javascript
Puppeteer 爬取动态生成的网页实战
Nov 14 #Javascript
React和Vue中监听变量变化的方法
Nov 14 #Javascript
You might like
php常用的url处理函数总结
2014/11/19 PHP
JavaScript 原型学习总结
2010/10/29 Javascript
javascript 设为首页与加入收藏兼容多浏览器代码
2011/01/11 Javascript
Moment.js 不容错过的超棒Javascript日期处理类库
2012/04/15 Javascript
JavaScript 获取任一float型小数点后两位的小数
2014/06/30 Javascript
javascript检查浏览器是否支持flash的实现代码
2014/08/14 Javascript
JQuery中的事件及动画用法实例
2015/01/26 Javascript
js实现简洁的TAB滑动门效果代码
2015/09/06 Javascript
JS+CSS实现简易实用的滑动门菜单效果
2015/09/18 Javascript
JavaScript实现倒计时代码段Item1(非常实用)
2015/11/03 Javascript
EasyUI折叠表格层次显示detailview详解及实例
2016/12/28 Javascript
js控制文本框禁止输入特殊字符详解
2017/04/07 Javascript
Angular4项目中添加i18n国际化插件ngx-translate的步骤详解
2017/07/02 Javascript
JS沙箱模式实例分析
2017/09/04 Javascript
JavaScript实现body内任意节点的自定义属性功能示例
2017/09/18 Javascript
vue 将页面公用的头部组件化的方法
2017/12/18 Javascript
node.js用fs.rename强制重命名或移动文件夹的方法
2017/12/27 Javascript
vue+echarts+datav大屏数据展示及实现中国地图省市县下钻功能
2020/11/16 Javascript
Python中获取网页状态码的两个方法
2014/11/03 Python
python使用threading获取线程函数返回值的实现方法
2017/11/15 Python
python批量修改ssh密码的实现
2019/08/08 Python
Django Docker容器化部署之Django-Docker本地部署
2019/10/09 Python
matplotlib更改窗口图标的方法示例
2021/02/03 Python
extern在函数声明中是什么意思
2014/01/19 面试题
如何开启linux的ssh服务
2013/06/03 面试题
高中的自我鉴定
2013/12/16 职场文书
邮政员工辞职信
2014/01/16 职场文书
村党支部书记承诺书
2014/05/29 职场文书
公司总经理助理岗位职责
2014/07/09 职场文书
意外伤害赔偿协议书
2014/09/16 职场文书
2014学生会工作总结报告
2014/12/02 职场文书
先进员工事迹材料
2014/12/20 职场文书
《飘》英文读后感五篇
2019/10/11 职场文书
python实现自定义日志的具体方法
2021/05/28 Python
Python面向对象编程之类的概念
2021/11/01 Python
CSS 鼠标点击拖拽效果的实现代码
2022/12/24 HTML / CSS