递归判断对象属性是否有值

最新推荐文章于 2023-08-01 23:45:14 发布

原创最新推荐文章于 2023-08-01 23:45:14 发布 · 1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #开发语言 #ecmascript

vue 同时被 2 个专栏收录

17 篇文章

订阅专栏

面向对象

2 篇文章

订阅专栏

该博客介绍了一种使用递归方法检查复杂对象中所有属性值是否为空的JavaScript函数。通过`judgeObj`函数，可以遍历对象、数组和嵌套结构，确保在数据提交前所有必需字段已填充。当遇到空值时，函数返回`false`并可记录缺失属性。

递归判断对象属性值是否为空

面对一个复杂的对象，在最后处理数据校验非空的时候，可以使用以下方法

let data={
  attr1:'abc',
  attr2:'def',
  attr3:[
    {
      attr4:'abc',
  		attr5:'def',
    },{
      attr6:'abc',
  		attr7:'',
    }
  ],
  attr8:{
    attr9:'abc',
    attr10:'',
  }
}
function judgeObj(data) {
  let flag = true;
  let _this = this;
  function judgeChildren(obj) {
    for(var key in obj){
      if(typeof obj[key] === 'string'){
        // 字符串
        if(!obj[key]){
          flag = false
          //可以在此将key赋值给一个全局变量，判断是哪个属性值为空
          return
        }
      }else if(Array.isArray(obj[key])){
        // 数组
        obj[key].forEach((item)=>{
          judgeChildren(item)
        })
      }else{
        //对象
        judgeChildren(obj[key])
      }
    }
  }
  judgeChildren(data);
  return flag;
},
 function submit(){
   let res = this.judgeObj(data)
   if(!res){
     console.log('error')
   }else{
     this.$api.xxx(data).then(()=>{
       ///xxx
     })
   }
 }