欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 汽车 > 维修 > 数据类型与判断

数据类型与判断

2025/4/17 3:59:28 来源:https://blog.csdn.net/2203_75479159/article/details/147049546  浏览:    关键词:数据类型与判断

数据类型与判断


文章目录

      • 数据类型与判断
        • **1. JS 的数据类型有哪些?**
        • **2. `null` 和 `undefined` 的区别**
        • **3. 如何判断数据类型**
          • **(1) `typeof`**
          • **(2) `Array.isArray()`**
          • **(3) `instanceof`**
          • **(4) `Object.prototype.toString.call()`**
          • **(5) 自定义工具函数**
        • **4. 常见问题与陷阱**
        • **总结**
      • **总结表:类型判断方法对比**

1. JS 的数据类型有哪些?

JavaScript 数据类型分为 基本数据类型引用数据类型

类型说明示例
基本数据类型
number整数、浮点数、InfinityNaN42, 3.14, NaN
string字符串(单引号、双引号、模板字符串)'hello', "world"
boolean布尔值true, false
null表示空值(通常由程序员显式赋值)let a = null;
undefined变量未初始化时的默认值let b;undefined
symbol唯一且不可变的值(ES6 新增,用于对象属性键)Symbol('key')
bigint大整数(ES2020 新增,用于精确表示大数)123n
引用数据类型
object对象、数组、函数、日期等{}, [], function(){}

2. nullundefined 的区别
特性nullundefined
含义显式表示“空值”变量未初始化时的默认值
类型typeof null'object'typeof undefined'undefined'
赋值场景程序员主动赋空值变量声明未赋值时自动获得
相等性null == undefinedtruenull === undefinedfalse
典型用途清空对象引用变量未初始化或函数无返回值

示例

let a;
console.log(a); // undefined(未赋值)let b = null;
console.log(b); // null(主动赋值)

3. 如何判断数据类型
(1) typeof
  • 返回值的字符串表示(如 "number""string")。

局限性:

  • typeof null"object"(历史遗留问题)。
  • 无法区分 object 的具体类型(如数组、日期)。

示例

typeof 123;        // "number"
typeof "abc";      // "string"
typeof true;       // "boolean"
typeof undefined;  // "undefined"
typeof {};         // "object"
typeof [];         // "object"
typeof null;        // 'object'
typeof function(){}; // "function"
typeof Symbol();   // "symbol"
typeof 10n;        // "bigint"

(2) Array.isArray()
  • 专门用于判断是否为数组。
  • 优势:比 instanceof 更可靠(跨 iframe/窗口时有效)。

示例

Array.isArray([1, 2]);     // true
Array.isArray({ a: 1 });   // false

(3) instanceof
  • 判断对象是否是某个构造函数的实例。
  • 局限性:跨上下文(如 iframe)时可能失效。

示例

[] instanceof Array;        // true
{} instanceof Object;       // true
(function() {}) instanceof Function; // true
'str' instanceof String; // false(基本数据类型无法用 instanceof)

(4) Object.prototype.toString.call()
  • 通用方法,返回 [object Type]
  • 优势:可准确判断所有类型。

示例

Object.prototype.toString.call(123);        // "[object Number]"
Object.prototype.toString.call("abc");      // "[object String]"
Object.prototype.toString.call(true);       // "[object Boolean]"
Object.prototype.toString.call(undefined);  // "[object Undefined]"
Object.prototype.toString.call(null);       // "[object Null]"
Object.prototype.toString.call([]);         // "[object Array]"
Object.prototype.toString.call({});         // "[object Object]"

(5) 自定义工具函数

结合上述方法封装通用类型判断:

function getType(value) {return Object.prototype.toString.call(value).slice(8, -1).toLowerCase();
}getType(123);        // "number"
getType("abc");      // "string"
getType([]);         // "array"
getType({});         // "object"
getType(null);       // "null"
getType(undefined);  // "undefined"

4. 常见问题与陷阱
  1. typeof null 返回 "object"
    • 这是 JavaScript 的历史设计错误,需通过 value === null 判断。
  2. 区分数组和普通对象
    • 推荐使用 Array.isArray()Object.prototype.toString.call()
  3. 跨上下文类型判断
    • instanceof 在跨 iframe 时可能失效,需用其他方法。

总结
判断目标推荐方法
基本类型typeof
数组Array.isArray()Object.prototype.toString.call()
nullvalue === null
undefinedvalue === undefined
通用类型判断Object.prototype.toString.call()

总结表:类型判断方法对比

方法适用场景示例
typeof基本数据类型类型(null 除外)typeof 'str''string'
Array.isArray()判断数组Array.isArray([])true
instanceof对象实例判断(不跨全局环境)[] instanceof Arraytrue
判断数组Array.isArray([])true
instanceof对象实例判断(不跨全局环境)[] instanceof Arraytrue
Object.prototype.toString通用类型判断toString.call(null)'[object Null]'

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词