当前位置: 首页 > news >正文

instanceof和typeof的区别【JavaScript常见面试题】

typeof (一元操作符):

用于判断一个变量的类型。它可以用于任何数据类型,并返回一个表示该类型的字符串。

console.log(typeof 42);         // "number"
console.log(typeof 'Hello');    // "string"
console.log(typeof true);       // "boolean"
console.log(typeof undefined);  // "undefined"
console.log(typeof null);       // "object" (这是一个历史遗留的bug)
console.log(typeof { a: 1 });   // "object"
console.log(typeof [1, 2, 3]);  // "object" (数组在JavaScript中也是对象)
console.log(typeof function(){}); // "function"
  1. 数字类型:typeof 返回的值是 number。
  2. 字符串类型:typeof 返回的值是 string。
  3. 布尔类型:typeof 返回的值是 boolean。
  4. 对象、数组、null 返回的值是 object:如 typeof(window),typeof(document),typeof(null)
  5. 函数类型,返回的值是 function:如:typeof(eval),typeof(Date)返回的值都是 function。
  6. 不存在的变量、函数或者 undefined,将返回 undefined:比如:typeof(abc)、typeof(undefined)
    都返回 undefined

instanceof (二元操作符):

用于检测某个对象是否是另一个对象的实例,或者说某个对象是否存在于另一个对象的原型链上。

class Animal {}
class Dog extends Animal {}

const dog = new Dog();

console.log(dog instanceof Dog);    // true
console.log(dog instanceof Animal); // true
console.log(dog instanceof Object); // true (所有对象都是Object的实例)

console.log([] instanceof Array);   // true
console.log({} instanceof Object);  // true
  1. instanceof 用于检测对象类型,不适用于基本数据类型(会报错)。
  2. 通过原型链来判断,如果对象的原型链上包含某个构造函数的 prototype 属性,则返回 true。
  3. 可以用于区分对象和数组,因为 Array 是一个构造函数,而 [] instanceof Array 返回 true。

instanceof 和 typeof 进行类型判断的对比示例:

示例 1:基本数据类型:

let num = 42;
console.log(typeof num); // "number"
// console.log(num instanceof Number); // 错误,基本数据类型不能用instanceof

let str = "Hello";
console.log(typeof str); // "string"
// console.log(str instanceof String); // 错误,基本数据类型不能用instanceof

let bool = true;
console.log(typeof bool); // "boolean"
// console.log(bool instanceof Boolean); // 错误,基本数据类型不能用instanceof

typeof 可以正确地判断基本数据类型(number、string、boolean),而 instanceof 不适用于基本数据类型,尝试使用会导致错误。

示例 2:对象和数组:

let obj = { a: 1 };
console.log(typeof obj); // "object"
console.log(obj instanceof Object); // true

let arr = [1, 2, 3];
console.log(typeof arr); // "object" (数组在JavaScript中也是对象)
console.log(arr instanceof Array); // true

在这个示例中,typeof 对于对象和数组都返回 “object”,无法区分它们。而 instanceof 可以准确地判断 obj 是 Object 的实例,arr 是 Array 的实例。

示例 3:函数:

function myFunc() {}
let func = myFunc;

console.log(typeof func); // "function"
// console.log(func instanceof Function); // 在某些环境中可能返回true,但这不是标准用法

对于函数类型,typeof 可以准确地返回 “function”。而 instanceof 对于函数类型的判断并不是标准用法,虽然在某些JavaScript环境中 func instanceof Function 可能会返回 true,但这并不是普遍推荐的做法。

示例 4:自定义类和实例:

class Person {}
let person = new Person();

console.log(typeof person); // "object"
console.log(person instanceof Person); // true
console.log(person instanceof Object); // true (因为所有类都继承自Object)

在这个示例中,typeof 对于自定义类的实例只能返回 “object”,而 instanceof 可以准确地判断 person 是 Person 类的实例,同时也是 Object 的实例(因为所有类都隐式继承自 Object)。

总结:

  • typeof 适用于判断基本数据类型和函数类型。
  • instanceof 适用于判断对象类型,包括自定义类和内置构造函数创建的实例。
  • 当需要区分对象和数组时,应使用 instanceof。
  • 对于基本数据类型,只能使用 typeof,不能使用 instanceof。

相关文章:

  • 跨境宠物摄像头是一种专为宠物主人设计的智能设备
  • OpenCV计算摄影学(1)图像修复(Inpainting)的函数inpaint()
  • 【若依框架】代码生成详细教程,15分钟搭建Springboot+Vue3前后端分离项目,基于Mysql8数据库和Redis5,管理后台前端基于Vue3和Element Plus,开发小程序数据后台
  • P5304 [GXOI/GZOI2019] 旅行者
  • 嵌入式项目:STM32刷卡指纹智能门禁系统
  • ShardingSphere--02--数据分片
  • 基于嵌入式linux的数据库:SQLite
  • 分片机制如何理解?
  • Unity Shader 学习13:屏幕后处理 - 使用高斯模糊的Bloom辉光效果
  • 统计学中的得分函数(Score Function)是什么?它和Fisher信息矩阵有什么关系?
  • Golang笔记——Interface类型
  • JavaScript获取DOM元素语法总结(getElementsByName()、querySelector()、querySelectorAll())
  • 网络安全漏洞管理要求 网络安全产品漏洞
  • OC高级编程之GCD
  • C语言数据结构—二叉树的链式结构实现
  • 【ECMAScript6】
  • 【知识】PyTorch中不同优化器的特点和使用
  • Visual Whole-Body for Loco-Manipulation论文复现
  • hab 通信
  • 爬虫基础入门之爬取豆瓣电影Top250-Re正则的使用
  • 新质观察|低空货运是城市发展低空经济的第一引擎
  • 长沙至赣州高铁初步设计获批,可填补湘赣两省斜向交通空白
  • 申伟强任上海申通地铁集团有限公司副总裁
  • 马上评|房屋“注胶堵漏”骗局何以屡屡得逞
  • 巴基斯坦外长访华是否与印巴局势有关?外交部:此访体现巴方高度重视中巴关系
  • 外交部:将持续便利中外人员往来,让“中国游”金字招牌更加闪耀