JS判断空对象的几个方法大盘点

目录
  • 知识准备
    • Object.keys
    • Object.getOwnPropertyNames
    • 可枚举属性
    • hasOwnProperty
  • 盘点判空方法
    • JSON.stringify判空
    • for in判空
    • Object.getOwnPropertyNames判空
    • Object.keys()判空
    • hasOwnProperty判空
  • 附将对象转换为字符串进行比较
  • 总结

知识准备

在盘点JS判空方法之前我们先来了解下面的三个方法。

Object.keys

Object.keys()方法是以对象为参数，返回一个包含该对象内所匹配的属性和方法的数组

  var obj = {
    name: "cxy",
    age: "19"
  };
  var objArray = Object.getOwnPropertyNames(obj);
  console.log(objArray)

可以看到objArray为返回值，且返回值为以对象内的属性为内容的数组

Object.getOwnPropertyNames

Object.getOwnPropertyNames()方法同样是也是以对象为参数，返回一个包含该对象内所匹配的属性和方法的数组

大家在这里会发出疑问，这两个有啥区别？Object.getOwnPropertyNames()可以返回所有的属性，而Object.keys()只能返回可枚举属性，诶？到这里大家又疑惑了可枚举属性又是个啥？不要着急，我来解释一下什么叫可枚举属性

可枚举属性

可枚举或者不可枚举属性是对象内部通过可枚举标志enumerable来进行区分的，在默认情况下，我们obj.name = "cxy"为对象新增了一个属性后，其可枚举标志enumerable为ture，而当其值为false的时候它是不可枚举的，当我们对对象进行for,Object.keys(),JSON.stringify()的时候不可枚举属性是找不出来的，我们可以理解为不可枚举属性是隐身的

现在我们拿上面的Object.getOwnPropertyNames和Object.keys()进行实战举例，我们通过defineProperty来为对象添加age属性，因为该方法可以设置枚举标志，这里设置为false，可以看到下面两个不同的返回结果

var stuObj = {
    name: "cxy"
}
Object.defineProperty(stuObj, 'age', {
  value: "18",
  enumerable: false
});
console.log(Object.keys(stuObj))
console.log(Object.getOwnPropertyNames(stuObj))

hasOwnProperty

hasOwnProperty()是用来判断某对象是否含有某属性的，其参数为属性名

  var stuObj = {
    name: "cxy"
  }
  console.log(stuObj.hasOwnProperty('name'))

但是这里要注意一个问题就是，hasOwnProperty()判断继承属性的时候会返回false，继承属性即对象从原型对象上继承的属性，比如说toString

盘点判空方法

JSON.stringify判空

这种方式是比较简单的了，使用JSON.stringify将对象转换为字符串，再通过等于判断即可得到对象是否为空的布尔值

let obj = {
    name: "cxy"
}
console.log(JSON.stringify(obj) == '{}')

for in判空

使用for in的话可以当触发循环的时候返回false没有触发循环的时候代表对象为空返回ture

let forNull = (items) => {
    for (let item in items) {
        return false
    }
    return true
}

Object.getOwnPropertyNames判空

这里使用了上文提及的Object.getOwnPropertyNames，将返回的数组的length作为判断依据。

let stuArray = Object.getOwnPropertyNames(obj)
console.log(stuArray.length === 0)

Object.keys()判空

和上个方法一样，使用数组作为判断依据

let stuArray = Object.getOwnPropertyNames(obj)
console.log(stuArray.length === 0)

hasOwnProperty判空

使用hasOwnProperty是使用for循环将元素进行判断如果含有则返回false说明不为空，反之则为空

let forNull = (items) => {
    for (let item in items) {
        if(items.hasOwnProperty(item)){
            return false
        }
    }
    return true
}

附将对象转换为字符串进行比较

这种方法很不推荐，但也确实是最容易想到的，主要使用JSON.stringify()这个方法对对象进行强转，贴出来仅供一看：

var a={};
var b=new Object();
console.log("对象字面量的比较结果："+(JSON.stringify(a)=="{}"))
console.log("构造函数的比较结果："+(JSON.stringify(b)=="{}"))

总结

到此这篇关于JS判断空对象方法的文章就介绍到这了,更多相关JS判断空对象内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • Javascript中判断对象是否为空

    发现了一个巧妙的实现: 需要检查一个对象(Object)是否为空,即不包含任何元素.Javascript 中的对象就是一个字典,其中包含了一系列的键值对(Key Value Pair).检查一个对象是否为空,等价于检查对象中有没有键值对.写成代码,形如: if (isEmptyObject(obj)) { // obj is empty } else { // not empty } 至于 isEmptyObject 的实现,jQuery 中有一个很有想法的方式,请看代码: function i

  • js判断空对象的实例(超简单)

    js判断空对象的实例(超简单)

    最近项目遇到判断空对象的一个问题,查阅相关资料再进行总结一下. 判断空对象不比判断空字符串之类的,因为空对象也是一个对象,需要单独分配内存,而不是像字符串那样为空时就是大锅饭,大家都相等,如下代码: 如上代码可以发现,无论是通过对象字面量方式创建的空对象还是通过Object构造函数创建的空对象,彼此之间都是不相等的. 1.将对象转换为字符串进行比较 这种方法很不推荐,但也确实是最容易想到的,主要使用JSON.stringify()这个方法对对象进行强转,贴出来仅供一看: var a={}; va

  • 简单方法判断JavaScript对象为null或者属性为空

    首先说下null与undefined区别: 对已声明但未初始化的和未声明的变量执行typeof,都返回"undefined". null表示一个空对象指针,typeof操作会返回"object". 一般不显式的把变量的值设置为undefined,但null相反,对于将要保存对象的变量,应明确的让该变量保存null值. var bj; alert(bj); //"undefined" bj = null; alert(typeof bj); //&

  • js中判断对象是否为空的三种实现方法

    在写js脚本的时候经常遇到对象为空或者不是对象的情况,出现这种情况我们可以用if去判断它,然后去执行相应的处理方法,具体判断他们的方法有以下几种: 1.if   (typeOf(x)   ==   "undefined") 2.if   (typeOf(x)   !=   "object") 3.if(!x) 其中第三种是最简单的方法,但是第三种就不能用if(x)这种互斥的方法去判断,只能在对象前面加! java里面!x为true的时候x肯定为false了,但是这里

  • JS/Jquery判断对象为空的方法

    发现了一个巧妙的实现: 需要检查一个对象(Object)是否为空,即不包含任何元素.Javascript 中的对象就是一个字典,其中包含了一系列的键值对(Key Value Pair).检查一个对象是否为空,等价于检查对象中有没有键值对.写成代码,形如: if (isEmptyObject(obj)) { // obj is empty } else { // not empty } 至于 isEmptyObject 的实现,jQuery 中有一个很有想法的方式,请看代码: function i

  • JS实现判断对象是否为空对象的5种方法

    1.将json对象转化为json字符串,再判断该字符串是否为"{}" var data = {}; var b = (JSON.stringify(data) == "{}"); alert(b);//true 2.for in 循环判断 var obj = {}; var b = function() { for(var key in obj) { return false; } return true; } alert(b());//true 3.jquery的

  • js取消单选按钮选中并判断对象是否为空

    一组单选按钮name都为country 复制代码 代码如下: var country = document.getElementsByName('country'); for(var i=0;i<country.length;i++){ if(country[i].checked) { country[i].checked=false; //不选中 } } <c:if test="${shippingAddressList != null && not empty s

  • JavaScript 判断一个对象{}是否为空对象的简单方法

    做项目时遇到一个问题,判断一个对象是否为空对象,发现这样判断可以,上代码: 1. 代码1: var a = {}; if(!a){ console.log(1);} else if(a == null) { console.log(2);} else { console.log(3);} 结果为:3 2. 代码2: var b = {}; if(b == {}){ console.log(4);} if(b == '{}') { console.log(5);} if(typeof(b) ==

  • JS判断空对象的几个方法大盘点

    JS判断空对象的几个方法大盘点

    目录 知识准备 Object.keys Object.getOwnPropertyNames 可枚举属性 hasOwnProperty 盘点判空方法 JSON.stringify判空 for in判空 Object.getOwnPropertyNames判空 Object.keys()判空 hasOwnProperty判空 附将对象转换为字符串进行比较 总结 知识准备 在盘点JS判空方法之前我们先来了解下面的三个方法. Object.keys Object.keys()方法是以对象为参数,返回一

  • JS递归遍历对象获得Value值方法技巧

    一般要用到递归,就要判断对象是否和父类型是否一样,通过本文给大家演示下简单的对象递归,还有数组递归类似. var obj = { a:{w:1,y:2,x:3}, b:{s:4,j:5,x:6}, c:{car:7,cat:8,mao:9} } function f(s){ for(var i in s){ if(typeof s[i]=="object"){ f(s[i]) }else{ console.log(s[i]); } } } f(obj); 返回结果:1,2,3,4,5,

  • js/jquery遍历对象和数组的方法分析【forEach，map与each方法】

    本文实例讲述了js/jquery遍历对象和数组的方法.分享给大家供大家参考,具体如下: JS forEach方法 arr[].forEach(function(value,index,array){ //do something }) 参数:value数组中的当前项,index当前项的索引,array原始数组: 数组中有几项,那么传递进去的匿名回调函数就需要执行几次: 理论上这个方法是没有返回值的,仅仅是遍历数组中的每一项,不对原来数组进行修改:但是可以自己通过数组的索引来修改原来的数组: va

  • C#判等对象是否相等的方法汇总

    C#判等对象是否相等的方法汇总

    本文以实例形式展示了C#判等对象是否相等的常用方法,非常实用,可供大家参考借鉴之用.具体分析如下: 一.判断相等的3个方法 1.实例方法 public virtual bool Equals(object obj) { return RuntimeHelpers.Equals(this, obj); } 2.比较值类型静态方法 public static bool Equals(object objA, object objB) { return ((objA == objB) || (((ob

  • asp.ent(C#)中判断空字符串的3种方法以及性能分析

    asp.ent(C#)中判断空字符串的3种方法以及性能分析

    3种方法分别是: string a=""; 1.if(a=="") 2.if(a==String.Empty) 3.if(a.Length==0) 3种方法都是等效的,那么究竟那一种方法性能最高呢?本人用实验说明问题. 建立3个aspx页面(为什么用网页,主要是利用Microsoft Application Center Test ) WebForm1.aspx 复制代码 代码如下: private void Page_Load(object sender, Sys

  • js中Array对象的常用遍历方法详解

    js中Array对象的常用遍历方法详解

    1.forEach(),遍历数组的每个元素 let arrFor = ['muzi','digbig','muzidigbig','lucky'] //forEach(),遍历数组的每个元素 arrFor.forEach((item,index) => { console.log(`${index}---${item}`) }) 2.map(参数为回调函数)函数,遍历数组每个元素,并回调操作,需要返回值,返回值组成新数组,原数组不变: let arr = [{id:1,name:'muzi'},

  • JS对象的深度克隆方法示例

    本文实例讲述了JS对象的深度克隆方法.分享给大家供大家参考,具体如下: js中创建的对象指向内存,所以在开发过程中,往往修改了一个对象的属性,会影响另外一个对象. 尤其是在angular框架中,dom是由数据驱动的,在增删改查对象的操作中,对象属性的继承关系是很让人头痛的! 我之前遇到的问题就是,在编辑页面,操作了对象数据,影响到了展示数据的展现! 我整理了两种深度克隆对象的方法,供大家参考! 首先var 一个假数据 复制代码 代码如下: var schedule = {"status"

  • 原生js实现复制对象、扩展对象 类似jquery中的extend()方法

    jq的extend()方法能很方便的实现扩展对象方法,语法如下:$.extend(obj1,boj2,obj3); 现在要实现的是:原生js实现复制对象,扩展对象,类似jq中的extend()方法,具体实例如下: 现有3个对象字面量: var o1={hello:1,old:555}, o2 = { abc: 55555555, hello: 2, fun: function() { alert(111); } }, o3={third:9999}; 实现目标: 复制o1对象,把 o2,o3的对

随机推荐