判断变量的数据类型的方法

1.判断数据类型的函数

function getDataType(value) {
  if (value === null) {
    return "null";
  }

  if (Array.isArray(value)) {
    return "array";
  }

  return typeof value;
}

这个函数首先检查值是否为null,如果是,则返回字符串'null',

接下来,它使用Array.isArray()方法来检查值是否为数组,如果是数组,则返回字符串'array,表示数组类型

最后对于其他非空,非数组的值,使用typeof运算符返回对应的类型字符串

console.log(getDataType("Hello"));         // 输出: "string"
console.log(getDataType(42));              // 输出: "number"
console.log(getDataType(true));            // 输出: "boolean"
console.log(getDataType(null));            // 输出: "null"
console.log(getDataType([1, 2, 3]));       // 输出: "array"
console.log(getDataType({ name: "John" })); // 输出: "object"
console.log(getDataType(function() {}));   // 输出: "function"

这个函数可以判断大多数常见的数据类型,包括字符串、数字、布尔值、空值、数组、对象和函数等。

2.typeof

type 操作符返回一个字符串,表示操作值的类型

利用typeof判断数据

类型的语法是typeof target

// 'number'
console.log(typeof 123)
// 'string'
console.log(typeof '123')
// 'boolean'
console.log(typeof true)
// 'symbol'
console.log(typeof Symbol(123))
// 'object'
console.log(typeof [])
// 'object'
console.log(typeof {})
// 'function'
console.log(typeof function(){})
// 'undefined'
console.log(typeof undefined)
// 'object'
console.log(typeof null)
// 'object'
console.log(typeof new Date())
// 'object'
console.log(typeof /\d/g)
// 'object'
console.log(typeof new Error())
typeof` 可以准确判断除 `null` 之外的所有基本数据类型以及 `Function`
对于 `null` 及其他引用数据类型都返回 `object

3.instanceof

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上

构造函数通过new可以实例对象,instanceof能判断这个对象是否是之前那个构造函数生成的对象

利用instanceof判断数据类型的语法是 target instanceof constructor

示例

// 定义构建函数
let Car = function() {}
let benz = new Car()
benz instanceof Car // true
let car = new String('xxx')
car instanceof String // true
let str = 'xxx'
str instanceof String // false

instanceof的实现原理

function myInstanceof(left, right) {
    // 这里先用typeof来判断基础数据类型,如果是,直接返回false
    if(typeof left !== 'object' || left === null) return false;
    // getProtypeOf是Object对象自带的API,能够拿到参数的原型对象
    let proto = Object.getPrototypeOf(left);
    while(true) {                  
        if(proto === null) return false;
        if(proto === right.prototype) return true;//找到相同原型对象,返回true
        proto = Object.getPrototypeof(proto);
    }
}

就是顺着原型链去找,直到找到相同的原型对象,返回true,否则为false

4.constructor

constructor 属性返回对创建此对象的数组函数的引用

在jst中,每个具有原型的对象都会自动获得constructor属性。

constructor不能判断undefined和null

const arrs = [];
console.log(arrs.constructor === Array); // true

const obj = {};
console.log(obj.constructor === Object); // true

const nums = 1;
console.log(nums.constructor === Number); // true

const str = '1';
console.log(str.constructor === String); // true

const bool = true;
console.log(bool.constructor === Boolean); // true

5.Object.prototype.toString

返回对象的类型字符串

利用 Object.prototype.toString 判断数据类型的语法是 Object.prototype.toString.call(target)

// '[object Number]'
console.log(Object.prototype.toString.call(123))
// '[object String]'
console.log(Object.prototype.toString.call('123'))
// '[object Boolean]'
console.log(Object.prototype.toString.call(true))
// '[object Symbol]'
console.log(Object.prototype.toString.call(Symbol(123)))
// '[object Array]'
console.log(Object.prototype.toString.call([]))
// '[object Object]'
console.log(Object.prototype.toString.call({}))
// '[object Function]'
console.log(Object.prototype.toString.call(function(){}))
// '[object Undefined]'
console.log(Object.prototype.toString.call(undefined))
// '[object Null]'
console.log(Object.prototype.toString.call(null))
// '[object Date]'
console.log(Object.prototype.toString.call(new Date())

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值