Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >day014: JS数据类型之问——检测篇

day014: JS数据类型之问——检测篇

作者头像
用户3806669
发布于 2021-03-10 12:48:58
发布于 2021-03-10 12:48:58
34400
代码可运行
举报
文章被收录于专栏:前端三元同学前端三元同学
运行总次数:0
代码可运行

day014: JS数据类型之问——检测篇

1. typeof 是否能正确判断类型?

对于原始类型来说,除了 null 都可以调用typeof显示正确的类型。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
typeof 1 // 'number'typeof '1' // 'string'typeof undefined // 'undefined'typeof true // 'boolean'typeof Symbol() // 'symbol'

但对于引用数据类型,除了函数之外,都会显示"object"。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
typeof [] // 'object'typeof {} // 'object'typeof console.log // 'function'

因此采用typeof判断对象数据类型是不合适的,采用instanceof会更好,instanceof的原理是基于原型链的查询,只要处于原型链中,判断永远为true

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
const Person = function() {}const p1 = new Person()p1 instanceof Person // true
var str1 = 'hello world'str1 instanceof String // false
var str2 = new String('hello world')str2 instanceof String // true

2. instanceof能否判断基本数据类型?

能。比如下面这种方式:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
class PrimitiveNumber {  static [Symbol.hasInstance](x) {    return typeof x === 'number'  }}console.log(111 instanceof PrimitiveNumber) // true

如果你不知道Symbol,可以看看MDN上关于hasInstance的解释。

其实就是自定义instanceof行为的一种方式,这里将原有的instanceof方法重定义,换成了typeof,因此能够判断基本数据类型。

3. 能不能手动实现一下instanceof的功能?

核心: 原型链的向上查找。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function myInstanceof(left, right) {    //基本数据类型直接返回false    if(typeof left !== 'object' || left === null) return false;    //getProtypeOf是Object对象自带的一个方法,能够拿到参数的原型对象    let proto = Object.getPrototypeOf(left);    while(true) {        //查找到尽头,还没找到        if(proto == null) return false;        //找到相同的原型对象        if(proto == right.prototype) return true;        proto = Object.getPrototypeof(proto);    }}

测试:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
console.log(myInstanceof("111", String)); //falseconsole.log(myInstanceof(new String("111"), String));//true

4. Object.is和===的区别?

Object在严格等于的基础上修复了一些特殊情况下的失误,具体来说就是+0和-0,NaN和NaN。源码如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
function is(x, y) {  if (x === y) {    //运行到1/x === 1/y的时候x和y都为0,但是1/+0 = +Infinity, 1/-0 = -Infinity, 是不一样的    return x !== 0 || y !== 0 || 1 / x === 1 / y;  } else {    //NaN===NaN是false,这是不对的,我们在这里做一个拦截,x !== x,那么一定是 NaN, y 同理    //两个都是NaN的时候返回true    return x !== x && y !== y;  }
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2019-10-22,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 前端三元同学 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
JS面试题-手动实现一个instanceof功能
instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。
用户10106350
2022/10/28
4320
(建议收藏)原生JS灵魂之问, 请问你能接得住几个?(上)
笔者最近在对原生JS的知识做系统梳理,因为我觉得JS作为前端工程师的根本技术,学再多遍都不为过。打算来做一个系列,一共分三次发,以一系列的问题为驱动,当然也会有追问和扩展,内容系统且完整,对初中级选手会有很好的提升,高级选手也会得到复习和巩固。敬请大家关注!
桃翁
2019/11/05
1.6K0
(建议收藏)原生JS灵魂之问, 请问你能接得住几个?(上)
JS之instanceof详解
发布者:全栈程序员栈长,转载请注明出处:https://javaforall.cn/163371.html原文链接:https://javaforall.cn
全栈程序员站长
2022/09/15
5850
JS之instanceof详解
深入了解JS 数据类型
由于JavaScript 是弱类型语言,而且JavaScript 声明变量的时候并没有预先确定的类型,变量的类型就是其值的类型,也就是说「变量当前的类型由其值所决定」,夸张点说上一秒是String,下一秒可能就是个Number类型了,这个过程可能就进行了某些操作发生了强制类型转换。虽然弱类型的这种「不需要预先确定类型」的特性给我们带来了便利,同时也会给我们带来困扰,为了能充分利用该特性就必须掌握类型转换的原理。本文我们将深入了解JavaScript 的类型机制。
用户8921923
2022/10/24
2K0
JS进阶-数据类型的判断方式以及转换方式的汇总
强制类型转换方式包括 Number()、parseInt()、parseFloat()、toString()、String()、Boolean()
小渔夫
2022/05/10
1.1K0
JS进阶-数据类型的判断方式以及转换方式的汇总
假如易立竞问你如何判断 JavaScript 中的数据类型?
我们习惯把对象称为引用类型,当然还有很多特殊的引用类型,比如 Function、Array、RegExp、Math、Date、Error、Set、Map、各种定型数组 TypedArray 等。
童欧巴
2021/06/25
5070
JS数据类型判断方式总结
​ 原因是typeof检测机制是通过计算机二进制进行检测 ​ js 在底层存储变量的时候,会在变量的机器码的低位1-3位存储其类型信息: ​ 000:对象 010:浮点数 100:字符串 110:布尔 1:整数 ​ null的所有机器码均为0,所以typeof检测的时候也认为是对象了
何处锦绣不灰堆
2022/08/07
1.7K0
typeof和instanceof原理
这里的类型值是值,变量是没有类型的,变量可以随时持有任何类型的值。JavaScript中变量是“弱类型”的,一个变量可以现在被赋值为 字符串类型,随后又被赋值为数字类型。
木子星兮
2020/07/16
2.5K0
面试官:JavaScript的数据类型你了解多少?
作为JavaScript的入门知识点,Js数据类型在整个JavaScript的学习过程中其实尤为重要。最常见的是边界数据类型条件判断问题。
Vam的金豆之路
2021/12/01
6850
面试官:JavaScript的数据类型你了解多少?
JavaScript 数据类型
JavaScript 语言可以识别 7 中不同的数据类型,除 Object 外,其它均为基本数据类型,Object 为引用数据类型。
李振
2021/11/26
2950
JavaScript 数据类型
JS篇之数据类型那些事儿
Web 浏览器只是 ECMAScript 实现可能存在的一种*「宿主环境(host environment)」。而宿主环境提供ECMAScript 的基准实现和与环境自身交互必需的扩展。(比如 DOM 使用 ECMAScript 核心类型和语法,提供特定于环境的额外功能)。
前端柒八九
2022/08/25
5490
JS篇之数据类型那些事儿
前端面试 【JavaScript】— 能不能手动实现一下 instanceof 的功能?
核心:原型链的向上查找。 function myInstanceOf(left, right) { // 基本数据类型直接返回false if (typeof left !== 'object' || left === null) return false; // getProtypeOf是Object对象自带的一个方法,能够拿到参数的原型对象 let proto = Object.getPrototypeOf(left); while (true) { // 查找到尽头,还没找
越陌度阡
2021/11/17
1650
JS手撕(一)    类型判断、instanceof、数组去重
有用过JS一段时间的小伙伴应该对typeof比较属性,我们需要进行类型判断的时候一般都会先想到它。但是呢,它有一个很大的局限性,比如如果是null、array都会被认为是object,array是因为是一个特殊的对象,而null则是因为JS诞生以来null的实现导致的。
赤蓝紫
2023/03/16
1.8K0
9种数据类型,数据类型区别及判断数据类型方法
String,Number,null,undefined,Boolean  (通常所说的五种原始数据类型),Symbol,BigInt (ES6新增)
子夜星辰
2023/10/17
4680
9种数据类型,数据类型区别及判断数据类型方法
【THE LAST TIME】一文吃透所有JS原型相关知识点
首先我想说,【THE LAST TIME】系列的的内容,向来都是包括但不限于标题的范围。
Nealyang
2019/11/04
1.1K0
详解原型与原型链
其实,刚开始学 JavaScript 时,就有学过原型与原型链的相关知识了,只是当时还没有养成写笔记的习惯,导致现在已经忘的七七八八了。
赤蓝紫
2023/01/02
4120
详解原型与原型链
lodash 是如何做类型检测的
JS 的基本数据类型有 Number,String,Boolean,Symbol,Null,Undefined,六种数据类型。一种引用类型 object。
Javanx
2019/09/04
1.8K0
lodash 是如何做类型检测的
数据类型判断
typeof 操作符返回一个表示数据类型的字符串,它可以应付常规场景下的数据类型判断。对基本数据类型 undefined, boolean, string, number 和引用数据类型 function 都可以正确判断,但是对 null,数组,对象则统一返回 “object”。也就是说,typeof 不适合用来判断引用数据类型。
Chor
2019/11/07
1.5K0
你知道有几种方式来判断JS的数据类型吗?
因为JavaScript是一门弱引用类型的语言,所以在开发过程中我们常常会遇到 “我定义的这个变量是什么数据类型?”这种类似的问题,所以今天我们来看看在JS中一般用什么方式来判断数据类型的。
用户2802329
2020/03/17
2.9K0
前端知识点总结js篇(中)
(总结不够全面,建议参考es6.ruanyifeng.com/#docs/promi…
zhouzhouya
2023/10/26
2630
前端知识点总结js篇(中)
相关推荐
JS面试题-手动实现一个instanceof功能
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验