JavaScript 判断数据是数组还是对象

置顶予你@。

已于 2023-04-28 17:30:03 修改

阅读量390

点赞数 1

分类专栏： js 文章标签： javascript 前端开发语言

于 2022-06-24 17:42:34 首次发布

本文链接：https://blog.csdn.net/weixin_44948981/article/details/125449900

版权

js 专栏收录该内容

45 篇文章 1 订阅

订阅专栏

当我们拿到后端返回的数据时，常常需要判断。以下是具体的方法以及常见的问题

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>1 判断后端返回的数据是对象还是数组</title>
</head>
<body>
    
    <script>
        let arr = [];
        let obj = {};

        // 1 数组的静态方法 Array.isArray
        console.log(Array.isArray(arr),Array.isArray(obj));
        // 2 instanceof
        console.log(arr instanceof Array);

        // 3 构造器 constructor
        console.log(arr.constructor === Array,obj.constructor === Object);

        // 4 原型链顶端的toString
        console.log(Object.prototype.toString.call(arr) === '[objet Array]');
        console.log(Object.prototype.toString.call(obj) === '[objet Object]');

        // 抛出问题  为什么要调用原型链顶端的toString 而下面的结构一样 不能使用
        /*  
            答：对象和数组是可以改写toSting方法的 例如 let obj = {toString:function(){return 0}};
        */
        console.log(obj.toString() === '[objet Object]');

        // constructor 和 instanceof 为什么用的较少 这两个方法有什么弊端
        let iframe  = document.createElement('iframe');
        document.body.append(iframe);

        let xArray = window.frames[window.frames.length -1].Array;
        let arr2 = new xArray(1 , 2 ,3)
        console.log(arr2 instanceof Array);
        console.log(arr2.constructor === Array);
        /* 
            IFRAME是HTML标签，作用是文档中的文档，或者浮动的框架(FRAME)。iframe元素会创建包含另外一个文档的内联框架（即行内框架)
            答：constructor 和 instanceof 会忽略到iframe
        */
    </script>

</body>
</html>

结果：