JS 类型判断：求职者不可不知的必备技能

JS 类型判断：求职者不可不知的必备技能

JavaScript 作为一门动态类型语言，给开发者带来了极大的灵活性。与此同时，它也带来了一些挑战，其中之一就是如何正确地判断数据类型。究其原因，我们进入了一个需要深挖JavaScript内部机制和类型系统的旅程。今天，让我们共同探索 --------- JavaScript中的数据类型判断。

( 一 ) JavaScript数据类型概览

在深入探讨之前，我们先回顾一下JavaScript的数据类型。根据ECMAScript标准，JavaScript有两大类数据类型：基本类型和引用类型。

• 基本数据类型包括：undefined，null，布尔值（Boolean），字符串（String），数值（Number），Bigint，以及ES6新增的Symbol。
• 引用数据类型主要是对象（Object），包括数组（Array），函数（Function），以及其他可通过new定义的构造函数创建的对象。

( 二 ) 数据类型判断的常规方法

JavaScript提供了typeof和instanceof两个运算符，以及Object.prototype.toString方法来帮助我们判断数据类型。下面通过一些简单的代码片段来逐一分析它们的特点和局限。

1. 使用typeof

typeof是最简单也是最直接的数据类型判断方式。它对基本类型（除了null，这实际上是一个历史遗留问题）能够准确判断，但当我们尝试判断引用类型时，除了函数会返回"function"，其他大多数情况下只会得到"object"。

console.log(typeof ""); // "string"
console.log(typeof 1); // "number"
console.log(typeof Symbol("id")); // "symbol"
console.log(typeof true); // "boolean"
console.log(typeof undefined); // "undefined"
console.log(typeof null); // "object" <-- 这是一个历史遗留的 bug
console.log(typeof function() {}); // "function"
console.log(typeof {}); // "object"

2. 使用instanceof

与typeof不同，instanceof的设计初衷是为了识别对象的具体类型。它检查对象的原型链上是否存在构造函数的prototype属性。instanceof 主要用于判断引用类型，但它也可以用于某些内置对象，比如 String、Number、Boolean 。对于原始类型，instanceof 会返回 false，即使它们是通过构造函数创建的。

console.log([] instanceof Array); // true
console.log({} instanceof Object); // true
console.log(new Date() instanceof Date); // true
// 但是，instanceof不能准确判断基本数据类型
console.log('string' instanceof String); // false

3. Array.isArray() 判断数组

判断一个值是否为数组类型，Array.isArray() 是最准确的方法。

  console.log(Array.isArray([]));    // true
  console.log(Array.isArray({}));    // false
  

4. 使用Object.prototype.toString.call()

这是判断JavaScript数据类型最准确无误的方法，它可以区分不同类型的对象。这个方法利用了所有 JavaScript 对象继承自 Object.prototype 的特性，toString 方法会返回一个表示该对象的字符串。这对于识别特定的构造函数非常有用。

const typeCheck = (obj) => Object.prototype.toString.call(obj).slice(8, -1);
console.log(typeCheck({})); // "Object"
console.log(typeCheck([])); // "Array"
console.log(typeCheck(new Date())); // "Date"
console.log(typeCheck(null)); // "Null"
console.log(typeCheck(undefined)); // "Undefined"

5. 自定义类型检测函数

你可以针对每种类型创建一个检测函数，特别是对于那些 typeof 无法准确区分的情况。

function isArray(value) {
  return Array.isArray(value);
}

function isObject(value) {
  return value !== null && typeof value === 'object';
}

function isDate(value) {
  return value instanceof Date && !isNaN(value.getTime());
}

function isError(value) {
  return Object.prototype.toString.call(value) === '[object Error]';
}

6. 特殊情况

1. 判断 null

由于 typeof null 返回 "object"，如果你想要特别检查一个值是否为 null，可以直接比较：

   console.log(value === null);      // 直接比较
   

2. 判断 NaN

因为 NaN 不等于任何值，包括自身，所以你不能用 === 来检查 NaN。应该使用 isNaN() 函数。

   console.log(isNaN(NaN));          // true
   

3. Buffer 类型（Node.js 环境）

如果你在 Node.js 环境下，你可能需要检查 Buffer 类型。

   console.log(Buffer.isBuffer(buf)); // true
   

( 三 ) 代码核心技术分析

在实际开发过程中，我们可能需要一个更为强大和灵活的方式来判断类型，以应对复杂的场景。这需要我们结合typeof、instanceof以及Object.prototype.toString的特性，设计出一个综合判断机制。

考虑到所有类型的差异性，最佳实践是首先使用typeof快速识别基本类型，然后通过Object.prototype.toString来识别具体的引用类型。对于可能出现的自定义类��或者全局对象（如 Window），instanceof能够提供额外的判断能力。

function typeCheck(obj) {
  if (obj === null) return "Null";
  if (typeof obj !== "object") return typeof obj;
  return Object.prototype.toString.call(obj).slice(8, -1);
}

( 四 ) 结尾：探索永无止境

JavaScript的数据类型判断看似简单，实则充满了细节和挑战。通过今天的探索，我们不仅加深了对JavaScript数据类型的理解，还学会了如何灵活运用不同的方法来答疑解惑。然而，技术的世界是不断变化的，随着新规范的颁布和新功能的添加，我们仍需保持好奇心，不断探索更多未知。 在追求编码之美的路上，愿我们都能享受这份探索的乐趣，不断进步。