1、不要使用Object.prototype.toString.call()

正常情况下:

const arr = [1,2,3,4,5]
const obj = {}
console.log(Object.prototype.toString.call(arr))//[Object,Array]
console.log(Object.prototype.toString.call(obj))//[Object,Object]

过去我们能够通过判断Object.prototype.toString.call(arr)第二个单词是否为Array来判断是否为数组,

但是时代变了,现在不行了。因为现在可以使用一个知名符号 toStringTag 改变生成的数组

例如:

const arr = [1,2,3,4,5]
const obj = {
[Symbol.toStringTag]:'Array',
}
console.log(Object.prototype.toString.call(arr))//[Object,Array]
console.log(Object.prototype.toString.call(obj))//[Object,Array]

看到了吗?对象用这个方法,也可以把第二个单子变成Array。

虽然概率很小,但是不得不防。还是那句话你可以不用,但是你不能知道!!!

2、不要使用instance of

原理是通过判断一个对象上有没有Array的原型

正常情况下:

const arr = [1,2,3,4]
const obj = {}
console.log(arr instanceof Array) //true
console.log(obj instanceof Array) //false

说完正常情况下,就说一说不正常的情况下

  1. 通过Object.setPrototypeOf 将对象的原型改变为数组的原型
const arr = [1,2,3,4]
const obj = {}
Object.setPrototypeOf(obj,Array.prototype)
console.log(arr instanceof Array) //true
console.log(obj instanceof Array) //true

将对象也判断成数组了 ,哒咩

  1. 在页面环境中有iframe

    由于iframe会生成一套独立的document和独立的window,但是Array是window一个全局属性,这就造成了一个非常有意思的现象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<iframe src="" frameborder="0"></iframe>
</body>
<script>
const Array1 = window.Array
const iframe = document.querySelector('iframe')
const Array2 = iframe.contentWindow.Array
const arr = new Array2()
console.log(arr instanceof Array) //false
</script>
</html>

虽然我觉得出现这种情况的概率很小,但是还是那句话你可以不用,但是你不能知道!!!

3、唯一解:Array.isArray

const arr = [1,2,3,4,5]
//上述两种情况均可用Array.isArray判断
Array.isArray(arr) //true

每日一题:如何判断是否是数组,一个既简单又复杂的问题。(不要再用Object.prototype.toString.call、instance of判断了!!!)的更多相关文章

  1. Object.prototype.toString.call()进行类型判断

    为什么类型判断用到Object.prototype.toString.call()进行类型判断,而不用typeof()呢? 然后翻了一下资料: Typeof 在使用 ]));/));));//[obj ...

  2. 使用Object.prototype.toString.call()方法精确判断对象的类型

    在JavaScript里使用typeof判断数据类型,只能区分基本类型,即:number.string.undefined.boolean.object. 对于null.array.function. ...

  3. 【JavaScript】Object.prototype.toString.call()进行类型判断

    权声明:本文为博主原创文章,未经博主允许不得转载. op = Object.prototype, ostring = op.toString, ... function isFunction(it)  ...

  4. Object.prototype.toString.call() 、 instanceof 以及 Array.isArray()判断数组的方法的优缺点

    1. Object.prototype.toString.call() 每一个继承 Object 的对象都有 toString 方法,如果 toString 方法没有重写的话,会返回 [Object ...

  5. 前端面试题1:Object.prototype.toString.call() 、instanceof 以及 Array.isArray()三种方法判别数组的优劣和区别

    1. Object.prototype.toString.call() 每一个继承 Object 的对象都有 toString 方法,如果 toString 方法没有重写的话,会返回 [Object ...

  6. [LeetCode每日一题]81. 搜索旋转排序数组 II

    [LeetCode每日一题]81. 搜索旋转排序数组 II 问题 已知存在一个按非降序排列的整数数组 nums ,数组中的值不必互不相同. 在传递给函数之前,nums 在预先未知的某个下标 k(0 & ...

  7. 【js】Leetcode每日一题-解码异或后数组

    [js]Leetcode每日一题-解码异或后数组 [题目描述] 未知 整数数组 arr 由 n 个非负整数组成. 经编码后变为长度为 n - 1 的另一个整数数组 encoded ,其中 encode ...

  8. [LeetCode每日一题]153.寻找旋转排序数组中的最小值

    [LeetCode每日一题]153.寻找旋转排序数组中的最小值 问题 已知一个长度为 n 的数组,预先按照升序排列,经由 1 到 n 次 旋转 后,得到输入数组.例如,原数组 nums = [0,1, ...

  9. 【python】【补】Leetcode每日一题-合并两个有序数组

    [python]Leetcode每日一题-合并两个有序数组 [题目描述] 给你两个有序整数数组 nums1 和 nums2,请你将 nums2 合并到 nums1 中,使 nums1 成为一个有序数组 ...

  10. Object.prototype.toString.call() 区分对象类型(判断对象类型)

    在 JavaScript 里使用 typeof 来判断数据类型,只能区分基本类型,即 “number”,”string”,”undefined”,”boolean”,”object” 五种.对于数组. ...

随机推荐

  1. 浅谈 ByteHouse Projection 优化实践

    预聚合是 OLAP 系统中常用的一种优化手段,在通过在加载数据时就进行部分聚合计算,生成聚合后的中间表或视图,从而在查询时直接使用这些预先计算好的聚合结果,提高查询性能,实现这种预聚合方法大多都使用物 ...

  2. 从零玩转系列之微信支付实战PC端接口搭建

    一.前言 halo各位大佬很久没更新了最近在搞微信支付,因商户号审核了我半个月和小程序认证也找了资料并且将商户号和小程序进行关联,至此微信支付Native支付完成.此篇文章过长我将分几个阶段的文章发布 ...

  3. Spring Boot实现高质量的CRUD-3

    (续前文) 7.Service接口类 ​ ​ Service类提供业务的实现逻辑,其调用Dao类的方法进行数据存取,并为Controller类提供方法.类似于Dao的接口类,服务层使用接口类,便于代码 ...

  4. 【HarmonyOS】关于 Caused by java.lang.IllegalStateException The specified...

    [问题描述] 线上收到大量手机的崩溃异常,以华为手机为主,崩溃如下 1.Caused by: java.lang.IllegalStateException: The specified messag ...

  5. LeetCode 周赛 350(2023/06/18)01 背包变型题

    本文已收录到 AndroidFamily,技术和职场问题,请关注公众号 [彭旭锐] 和 [BaguTree Pro] 知识星球提问. 往期回顾:LeetCode 单周赛第 348 场 · 数位 DP ...

  6. 【后端面经-Java】AQS详解

    目录 1. AQS是什么? 2. AQS核心思想 2.1 基本框架 2.1.1 资源state 2.1.2 CLH双向队列 2.2 AQS模板 3. 源码分析 3.1 acquire(int) 3.1 ...

  7. 变分自编码器(VAE)公式推导

    论文原文:Auto-Encoding Variational Bayes [OpenReview (ICLR 2014) | arXiv] 本文记录了我在学习 VAE 过程中的一些公式推导和思考.如果 ...

  8. JS逆向实战20——某头条jsvm逆向

    声明 本文章中所有内容仅供学习交流,抓包内容.敏感网址.数据接口均已做脱敏处理,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请联系我立即删除! 网站 目标网站:aHR0c ...

  9. 「Python实用秘技15」pandas中基于范围条件进行表连接

    本文完整示例代码及文件已上传至我的Github仓库https://github.com/CNFeffery/PythonPracticalSkills 这是我的系列文章「Python实用秘技」的第15 ...

  10. 【WebRtc】获取分享屏幕

    分享前页面 获取分享屏幕 Code /** * 开始屏幕共享 */ openShareScreen() { var that = this // 判断是否支持获取本地屏幕分享数据 if (!navig ...