精华内容
下载资源
问答
  • js判断对象为空

    2019-07-22 09:32:25
    1 使用ES6的Object.keys()方法 var obj= {}; var arr = Object.keys(obj);...使用Object对象的getOwnPropertyNames方法,获取到对象中的属性名,存到一个数组中,返回数组对象,我们可以通过判断数组的...

    1 使用ES6的Object.keys()方法

    var obj= {};
    var arr = Object.keys(obj);
    alert(arr.length == 0);//true
    
    

    2 Object.getOwnPropertyNames()方法
    使用Object对象的getOwnPropertyNames方法,获取到对象中的属性名,存到一个数组中,返回数组对象,我们可以通过判断数组的length来判断此对象是否为空(不兼容ie8)

    var obj= {};
    var arr = Object.getOwnPropertyNames(obj);
    alert(arr.length == 0);//true
    
    

    3 将json对象转化为json字符串,再判断该字符串是否为"{}"

    var obj= {};
    var b = (JSON.stringify(obj) == "{}");
    alert(b);//true
    
    

    4 jquery的isEmptyObject方法
    和方法5类似,是将 (for in)进行封装,使用时需要依赖jquery

    var obj= {};
    var b = $.isEmptyObject(obj);
    alert(b);//true
    
    

    5 使用for in 循环判断

    var obj = {};
    var b = function() {
    	for(var key in obj) {
    		return false;
    	}
    	return true;
    }
    alert(b());//true
    
    

    Tips:【小程序云开发】中高级前端面试题库(源码:小程序中联系我哟)。
    ---------- 创作不易,感谢大家,请多多支持!
    在这里插入图片描述

    展开全文
  • js 判断对象为空

    2014-10-31 16:21:00
    2019独角兽企业重金招聘Python工程师标准>>> ...

    1、if   (typeOf(x)   ==   "undefined")

    2、if   (typeOf(x)   !=   "object")

    3、if(!x)

    转载于:https://my.oschina.net/birdlovecloud/blog/339320

    展开全文
  • Object对象1.JS面向对象JS没有真正的类,通过已存对象创建实例作为新对象所有对象都是Object实例对象是map结构,key属性名或方法名,value属性值或方法定义2.对象定义方式通过已存对象创建实例作为新对象let ...
    Object对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.JS面向对象JS没有真正的类,通过已存对象创建实例作为新对象所有对象都是Object实例对象是map结构,key为属性名或方法名,value为属性值或方法定义2.对象定义方式通过已存对象创建实例作为新对象
    let object = new Object();console.log(object instanceof Object);//结果为truelet array = new Array(1, 2, 3);console.log(array instanceof Object);//结果为truelet string = new String("string");console.log(string instanceof Object);//结果为truelet date = new Date();console.log(date instanceof Object);//结果为truelet regex = new RegExp(/^\d+$/);console.log(regex instanceof Object);//结果为true
    通过{}创建新对象,实际上还是通过已存构造函数对象Object创建实例作为新对象
    let person = {    name: '张三',    getName: function () {        //通过关键字this访问本对象属性        return this.name;    }};
    3._proto_属性每个对象都有_proto_属性对象的_proto_指向对象对应构造函数的prototypeJS自带或用户自定义的构造函数也是对象,也有_proto_属性Function是所有构造函数对象的构造函数,所有构造函数(包括Function自身以及Object)的_proto_指向Function的prototypeObject的prototype的_proto_为空,Object的pototype是一切的起点4.prototype属性每个构造函数都有prototype属性,prototype属性其实就是构造函数创建实例的原型构造函数的prototype属性是对象,所以有_proto_属性构造函数prototype属性的构造函数是Object,所以其_proto_属性指向Object的prototype属性构造函数prototype属性有constructor属性,指向该构造函数本身new的一个作用是将实例的_proto_属性指向构造函数对象的prototype,也就是把构造函数对象的prototype加到实例的原型链中instanceof判断对象是另一对象实例,依据是该对象的原型链中含有另一对象的prototype5.原型链图解

    29dd343c68b316997068af3fea976a24.png

    关于JS中的原型链,建议看下面这篇文章

    https://blog.csdn.net/coderising/article/details/107873199

    6.Function与ObjectFunction的_proto_指向Function的prototype所以Function的原型链包含Function的prototype
    console.log(Function instanceof Function);//结果为true
    Function的_proto_指向Function的prototypeFunction的prototype的_proto_指向Object的prototype所以Function的原型链包含Object的prototype
    console.log(Function instanceof Object);//结果为true
    Object的_proto_指向Function的prototype所以Object的原型链包含Function的prototype
    console.log(Object instanceof Function);//结果为true
    Object的_proto_指向Function的prototypeFunction的prototype的_proto_指向Object的prototype所以Object的原型链包含Object的prototype
    console.log(Object instanceof Object);//结果为true
    Object的prototype的_proto_为空,也即原型链为空Object的prototype是一切的起点
    console.log(Object.prototype instanceof Object);//结果为false
    7.继承通过原型链完成单继承
    let Super = function () {this.a = 1;};let Sub = function () {this.b = 2;};//Sub原型指向Super,Sub从Super实例中继承所有属性Sub.prototype = new Super();let sub = new Sub();console.log(sub.a);//结果为1console.log(sub.b);//结果为2
    通过对象冒充完成多继承
    let Super1 = function () {this.a = 1;};let Super2 = function () {this.b = 2;};let Sub = function () {    this.super1 = Super1;    //执行super1方法实际上是在执行Super1    //this指向Sub,从而使Super1的属性被Sub继承    this.super1();    //对象冒充完毕,删除super1方法,防止后面被调用    delete this.super1;    this.super2 = Super2;    //执行super2方法实际上是在执行Super2    //this指向Sub,从而使Super2的属性被Sub继承    this.super2();    //对象冒充完毕,删除super2方法,防止后面被调用    delete this.super2;    this.c = 3;};let sub = new Sub();console.log(sub.a);//结果为1console.log(sub.b);//结果为2console.log(sub.c);//结果为3
    8.动态方法调用JS提供了动态调用的call方法和apply方法,允许对象调用不属于自己的方法
    let o = {};function add(a, b) {this.sum = a + b;}// o.add(1, 2);报错,不能直接通过对象调用不属于该对象的方法//call方法可以直接传递多个参数add.call(o, 1, 2);console.log(o.sum);//结果为3//apply方法需要传递参数数组add.apply(o, [3, 4]);console.log(o.sum);//结果为7
    通过动态方法调用实现多继承,原理还是对象冒充
    let Super = function () {this.a = 1;};let Sub = function () {    //下面这句相当于    //this.super = Super;    //this.super();    //delete this.super;    Super.call(this);//通过this调用Super这个本不属于Sub的方法    this.b = 2;};let sub = new Sub();console.log(sub.a);//结果为1console.log(sub.b);//结果为2
    9.访问对象的属性和方法通过.访问对象属性和方法
    console.log(person.name);//结果为"张三"//方法名加上括号,返回方法运行结果console.log(person.getName());//结果为"张三"//方法名不加上括号,则返回方法定义console.log(person.getName);//结果为function () {return this.name;}
    通过[]访问对象属性和方法
    //属性名需要加上引号console.log(person["name"]);//结果为"张三"//方法名加上括号,返回undefinedconsole.log(person["getName())"]);//结果为undefined//方法名不加上括号,返回方法定义console.log(person["getName"]);//结果为function () {return this.name;}
    10.为对象添加属性和方法一般方式
    function Person() {}let person = new Person();person.name = "张三";person.getName = function () {    return this.name;};console.log(person["name"]);//结果为张三console.log(person.getName());//结果为张三
    通过prototype的方式
    function Person() {}let person = new Person();Person.prototype.name = "张三";Person.prototype.getName = function () {    return this.name;};console.log(person["name"]);//结果为张三console.log(person.getName());//结果为张三
    Function对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.JS函数特点函数的形参类型不用写函数是一个对象,如果定义名称相同的函数则会覆盖函数调用只与函数名有关,和参数列表无关可以传入任意个实际参数,而不用考虑形参个数函数对象的length属性代表形参个数函数声明中有一个隐藏的内置数组arguments,封装了所有的实际参数可以在函数中使用arguments调用传入的实际参数2.函数定义的方式function定义命名的函数,比较常用
    function add(a, b) {    return a + b;}console.log(add(1, 2));//结果为3
    function定义匿名函数,比较常用
    let add = function (a, b) {    return a + b;};console.log(add(1, 2));//结果为3
    使用Function对象定义函数,语法为new Funtion(arg1,arg2 ... , body),不常用注意使用这种方式的话,无论是参数还是函数体都要用引号包括起来
    let add = new Function("a", "b", "return a+b");console.log(add(1, 2));//结果为3
    3.构造函数构造函数String、Number、Boolean、Function、Object等都是Function对象的实例可以自定义构造函数,并通过该构造函数创建实例作为新对象
    let Person = function (name) {    this.name = name;};let person = new Person("张三");
    String对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.length属性代表字符串的长度
    console.log("123".length);//结果为3
    2.match方法返回字符串匹配正则表达式的内容,不匹配则返回null
    console.log("123".match("^\\d+$"));//结果为123console.log("a123".match("^\\d+$"));//结果为null
    RegExp对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.常用正则表达式符号
    []     //单个字符\d     //单个数字字符\w     //单个字母字符?      //出现0次或1次*      //出现0次或0次以上+      //出现1次或1次以上{m,n}  //m<=出现次数<=n,{,n}代表最多出现n次,{m,}代表最少出现m次
    2.创建RegExp对象
    var reg = /正则表达式/;var reg = new RegExp("正则表达式");
    3.RegExp对象的方法exec方法返回字符串匹配正则表达式的内容,不匹配则返回null
    console.log(/^\d+$/.exec("123"));//结果为123console.log(/^\d+$/.exec("a123"));//结果为null
    test方法验证字符串是否匹配正则表达式,匹配返回true,不匹配返回false
    console.log(/^\d+$/.exec("123"));//结果为trueconsole.log(/^\d+$/.exec("a123"));//结果为false
    Array对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.JS数组特点数组元素的类型可变数组长度可变,不存在下标越界的问题
    let arr = new Array(9);console.log(arr[10]);//结果为undefined(引用存在,只是值不存在)arr[10] = 1;console.log(arr[10]);//结果为1
    2.数组定义方式通过[]定义数组
    let arr = [1, 2, 3];//JS中[]代表数组
    通过new Array(数组默认长度)定义数组
    let arr = new Array(3);arr2[0] = 1;arr2[1] = 2;arr2[2] = 3;
    通过new Array(元素1,元素2,...)定义数组
    let arr = new Array(1, 2, 3);
    3.Array对象的方法push方法加入元素到数组并返回加入元素之后数组的长度
    let arr = new Array(1, 2, 3);let number = arr.push(4, 5, 6);console.log(number);//结果为6console.log(arr);//结果为1,2,3,4,5,6
    pop方法从数组移除最后一个元素并返回该元素
    let arr = [1, 2, 3];let number = arr.pop();console.log(number);//结果为3console.log(arr);//结果为1,2
    reverse方法反转数组
    let arr = [1, 2, 3];console.log(arr);//结果为1,2,3arr.reverse();console.log(arr);//结果为3,2,1
    join方法通过指定内容连接数组元素并返回字符串,默认按逗号分隔
    let arr = [1, 2, 3];let s = arr.join("-");console.log(s);//结果为1-2-3
    sort方法对数组进行排序
    let arr = [3, 1, 2];console.log(arr);//结果为3,1,2arr.sort();console.log(arr);//结果为1,2,3
    slice方法截取数组中的开始索引到结束索引的元素包含开始索引但不包含结束索引
    let arr = [1, 2, 3, 4, 5, 6];console.log(arr);//结果为1,2,3,4,5,6let subArr = arr.slice(0,3);console.log(subArr);//结果为1,2,3
    Math对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.Math对象特点不用创建,直接使用2.Math对象的属性PI:圆周率3.Math对象的方法
    ceil        //返回指定数向上取整的整数floor       //返回指定数向下取整的整数round       //返回指定数四舍五入后为最接近的整数random      //返回0~1之间的随机数,含0不含1pow         //返回指定数的指定次幂sqrt        //返回某数的平方根
    Date对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.toLocaleString方法返回本地化日期格式
    let date = new Date().toLocaleString();console.log(date);//结果为xxxx年xx月xx日 xx:xx:xx
    2.getTime方法返回从1970年1月1日0时0分0秒到现在的毫秒值差
    let time = new Date().getTime();console.log(time);
    3.自定义日期格式通过Date获取各种日期时间的方法实现自定义日期格式
    let date = new Date();let date = new Date();let dateStr = date.getFullYear() + "-" + date.getMonth() + "-" + date.getDate() + " "    + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();console.log(dateStr);
    Global对象

    ef36bd6d8647d9d9cfe1f0accf5898cb.png

    1.Global对象特点Global对象是全局对象,该对象封装的方法不需要对象就可以直接调用2.Global对象方法
    encodeURI           //客户端对特殊字符编码encodeURIComponent  //客户端对特殊字符编码,可以编码的字符比encodeURI多一些decodeURI           //服务器端对特殊字符解码decodeURIComponent  //服务器端对特殊字符解码,可以解码的字符比decodeURI多一些parseInt            //将字符串前面的数字转成number,如果没有数字则转为NaNisNaN               //判断值是否为NaN,NaN参与的比较全为false所以有该方法eval                //将JS字符串解析为JS代码并执行
    展开全文
  • 下面的代码片段,用于检查对象是否为空。对于较新的浏览器,你可以使用 ES6 的 “Object.keys”。?对于较旧的浏览器,可以安装Lodash库并使用其“ isEmpty”方法。constempty={};/*-------------------------较新的...

    下面的代码片段,用于检查对象是否为空。对于较新的浏览器,你可以使用 ES6 的 “Object.keys”。?对于较旧的浏览器,可以安装Lodash库并使用其“ isEmpty”方法。

    const empty = {};

    /* -------------------------
      较新的浏览器
    ----------------------------*/
    Object.keys(empty).length === 0 && empty.constructor === Object
    // true

    /* -------------------------
      老版本的浏览器可以使用 Lodash
    ----------------------------*/
    _.isEmpty(empty)
    // true

    什么是原生 JavaScript

    原生 JavaScript 指的是不使用框架或库。它只是常规的普通 JavaScript,没有使用LodashjQuery之类的库。

    A.在较新的浏览器中检查空对象

    我们可以使用内置的Object.keys方法检查空对象。

    const empty = {};

    Object.keys(empty).length === 0 && empty.constructor === object;

    为什么我们需要额外的constructor 检查?

    你可能想知道为什么我们需要对 constructor 进行检查。它是为了覆盖包装器实例。在JavaScript中,我们有9个内置的构造函数。

    new Object();

    new String();
    new Number();
    new Boolean();
    new Array();
    new RegExp();
    new Function();
    new Date();

    这里,我们可以使用new Object()创建一个空对象。

    注:永远不要使用构造函数创建对象。这被认为是不好的做法,请参阅 Airbnb Style Guide 和 ESLint。

    const obj = new Object();

    Object.keys(obj).length === 0; // true

    因此,仅使用Object.keys,当对象为空时,它的确会返回true。但是,当我们使用其他构造函数创建新的对象实例时会发生什么。

    function badEmptyCheck(value) {
      return Object.keys(value).length === 0;
    }

    badEmptyCheck(new String());    // true ?
    badEmptyCheck(new Number());    // true ?
    badEmptyCheck(new Boolean());   // true ?
    badEmptyCheck(new Array());     // true ?
    badEmptyCheck(new RegExp());    // true ?
    badEmptyCheck(new Function());  // true ?
    badEmptyCheck(new Date());      // true ?

    通过检查 constructor 解决误报

    通过添加构造函数检查来纠正这个错误。

    function goodEmptyCheck(value) {
      Object.keys(value).length === 0
        && value.constructor === Object; // ? constructor check
    }

    goodEmptyCheck(new String());   // false ✅
    goodEmptyCheck(new Number());   // false ✅
    goodEmptyCheck(new Boolean());  // false ✅
    goodEmptyCheck(new Array());    // false ✅
    goodEmptyCheck(new RegExp());   // false ✅
    goodEmptyCheck(new Function()); // false ✅
    goodEmptyCheck(new Date());     // false ✅

    Nice,干的漂亮 ?

    对其他值进行空检查

    接着,我们用一些值上测试我们的方法,看看我们会得到了什么 ?

    function isEmptyObject(value) {
      return Object.keys(value).length === 0 && value.constructor === Object;
    }

    到目前为止看起来不错,对于非对象它返回 false

    isEmptyObject(100)  // false
    isEmptyObject(true) // false
    isEmptyObject([])   // false

    ?但是要当心!下面这些值会引发错误。

    // TypeError: Cannot covert undefined or null to object
    isEmptyObject(undefined);
    isEmptyObject(null);

    改进对nullundefined的空检查

    如果不想让它抛出TypeError,可以添加额外的检查

    function isEmptyObject(value) {
      return value && Object.keys(value).length === 0 && value.constructor === Object;
    }

    B.旧版本浏览器中的空对象检查

    如果你需要支持较旧的浏览器怎么办?大家都知道,当说旧的浏览器时,指的是 IE,我们有2个选择,使用原生或利用库。

    使用 JavaScript 检查空对象

    原生的 JS 并不那么简洁,但判断用来空对象是没问题的。


    function isObjectEmpty(value) {
      return (
        Object.prototype.toString.call(value) === '[object Object]' && JSON.stringify(value) === '{}'
      );
    }

    对于对象,它返回true

    isObjectEmpty({});           // true ✅
    isObjectEmpty(new Object()); // true ✅

    其它类型的构造函数也能正常判断 ?

    isObjectEmpty(new String());   // false ✅
    isObjectEmpty(new Number());   // false ✅
    isObjectEmpty(new Boolean());  // false ✅
    isObjectEmpty(new Array());    // false ✅
    isObjectEmpty(new RegExp());   // false ✅
    isObjectEmpty(new Function()); // false ✅
    isObjectEmpty(new Date());     // false ✅

    传入 nullundefined 也不会报 TypeError

    isObjectEmpty(null);      // false
    isObjectEmpty(undefined); // false

    使用外部库检查空对象

    有大量的外部库可以用来检查空对象。而且大多数都对旧浏览器有很好的支持?

    Lodash

    _.isEmpty({});
    // true

    Underscore

    _.isEmpty({});
    // true

    jQuery

    jQuery.isEmptyObject({});
    // true

    原生  VS 库

    答案是看情况而定!我非常喜欢尽可能地简化程序,因为我不喜欢外部库的开销。另外,对于较小的应用程序,我懒得设置外部库。但如果你的应用程序已经安装了一个外部库,那么就继续使用它。你会比任何人都更了解你的应用程序。所以选择最适合你情况的方法

    人才们的 【三连】 就是小智不断分享的最大动力,如果本篇博客有任何错误和建议,欢迎人才们留言,最后,谢谢大家的观看。


    作者:Samantha Ming  译者:前端小智  来源:medium

    原文:https://www.samanthaming.com/tidbits/94-how-to-check-if-object-is-empty/#what-is-javascript

    相关热门推荐在 JS 中检查变量是否为数组的多种方式,并说说 ES6 引入检查数组的缘起!提升布局能力!理解 CSS 的多种背景及使用场景和技巧17 个实用的图像特效库8 种用于前端性能分析工具【网络特效】12 个炫酷背景特效库Vue 中如何从插槽中发出数据要深入 JavaScript,你需要掌握这 36 个概念一文学会使用 CSS 中的 min(), max(), clamp() 以及它们的使用场景5 个 JS 数组技巧可提高你的开发技能

    2249e2c7ac7f10293ddd93133d9aa1bd.png

    展开全文
  • js判断对象为空的方法

    千次阅读 2019-01-21 10:16:52
    成功的时候可以这么判断data.data.length==0,然后再做后续的操作,但也会碰到其他的返回结果比如是个对象? 这个时候就如果单纯的通过返回状态和length ==0 就无法满足业务需求 if(data.errCode==0){ // 成功的...
  • js 判断对象为空

    2019-03-04 16:22:32
    comm = {}; comm.isEmpty = function(value, allowEmptyString){ return (value === null) || (value === undefined) || (!allowEmptyString ? value === '' : false) || (comm.isArray(value) &...
  • 在写js脚本的时候经常遇到对象为空或者不是对象的情况,出现这种情况我们可以用if去判断它,然后去执行相应的处理方法,具体判断他们的方法有以下几种: 1、if (typeOf(x) == "undefined") 2、if (typeOf(x) ...
  • 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)...
  • 对象转换json字符串,判断字符串是否 “{}”; var obj = {}; if(JSON.stringify(obj) == '{}'){ console.log('obj 是一个空对象''); } for in 或者 for of var obj = {}; function check_obj_is_...
  • 对象为空"; }     最后 由于春运快到了,给大家安利一个抢火车票的小程序心到抢票,微信扫码关注点击立即抢票即可 个人亲测效率很高,大家也可以加他们官方微信 xdticket 咨询。...
  • 在写js脚本的时候经常遇到对象为空或者不是对象的情况,出现这种情况我们可以用if去判断它,然后去执行相应的处理方法,具体判断他们的方法有以下几种: 1、if (typeOf(x) == "undefined") 2、if ...
  • 上次给大家分享了Backbone.js教程,今天继续分享Model实战。上一章主要是通过简单的代码对Backbonejs做了一个概括的展示,这一章开始从Model层说起,详细解释Backbonejs中的Model这个东西。对于Model这一部分,其...
  • JSON.stringify(obj): 用于从一个对象解析出字符串 var c = {}; if(JSON.stringify(obj) == "{}"){ console.log(7); } var a = {a:1,b:2} JSON.stringify(a) 结果: "{"a":1,"b":2}" JSON.parse(str): ...
  • js判断对象是否为空

    2021-01-07 06:28:09
    如何判断返回对象为空? 一、通过ES6新增的一个Object.keys()方法 该方法会返回一个由给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for…in… 循环遍历该对象时返回的顺序一致 。即可以通过...
  • 一、我用的ES6判断对象为空对象 let data = {}; //判断空对象 let count = Object.keys(data).length; //用Object.keys(data).length来判断是否味空对象, 如果为空对象,length == 0 二、 JSON.stringify...
  • js 判断是否为空对象、空数组 当需要判断参数是否为空时,总希望 js 能够提供原生的判断方法,可惜并没有,只能自己封装了。 1 functionisEmpty(obj) { 1 // 检验 undefined ...
  • Js判断对象是否为空,Js判断字符串是否为空,JS检查字符串是否为空字符串 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>...
  • 最近在做项目的时候需要判断js对象的值为空,于是查阅资料做了个小结,今天给大家分享一下。方便大家以后使用。1.将json对象转化为json字符串,再判断该字符串是否为"{}"var data = {};var b = (JSON.stringify(data...
  • js判断对象为空以及有好几种方法了,但是个人觉得不是特别方便。 比如: 1、把对象通过 JSON.stringify 转为字符串,再判断字符串是否等于 " {} " 2、for in循环,判断key是否存在 3、jq的方法 es6已经帮我们很...
  • js判断对象是否为空对象的几种方法
  • JS 判断对象是否为空

    2018-09-12 08:49:03
    版权声明:本文首发 http://asing1elife.com ,转载请注明出处。 https://blog.csdn.net/asing1elife/article/details/82655689 JS 判断对象是否为空 ES...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,057
精华内容 422
关键字:

js判断对象为空