JS获取数据类型方法总结

JS获取数据类型方法总结

目录

1. typeof(1)介绍(2)语法(3) 例:(4)缺点

2. instanceof(1)介绍(2)语法(3)原理(4) 例(5) 缺点

3. constructor(不推荐)(1)介绍(2) 例:(3)缺点

4. Object.prototype.toString.call() (推荐)(1)介绍(2)语法(3)原理(4)例

5. isArray()(1)介绍(2)语法(3) 例

1. typeof

(1)介绍

typeof 操作符返回一个字符串,表示未经计算的操作数的类型。

typeof是运算符,返回值是小写的字符串。

(2)语法

typeof(operand)或typeof operand

参数:operand : 一个表示对象或原始值的表达式,其类型将被返回。

(3) 例:

console.log('1的结果为: ' + typeof 1);

console.log(' "1" 的结果为: ' + typeof '1');

console.log('undefined的结果为: ' + typeof undefined);

console.log('null的结果为: ' + typeof null);

console.log('NaN的结果为: ' + typeof NaN);

console.log('1n的结果为: ' + typeof 1n);

console.log('Symbol(1)的结果为: ' + typeof Symbol(1));

console.log('true的结果为: ' + typeof true);

console.log('function() {}的结果为: ' + typeof function() {});

console.log("[1, '1']的结果为: " + typeof [1, '1']);

console.log("{a: 1}的结果为: " + typeof {a: 1});

console.log("日期的结果为: " + typeof new Date());

console.log("正则的结果为: " + typeof /\d/);

输出:

(4)缺点

(1)typeof对于大部分简单数据类型能检测出,引用数据类型检测不出来。如数组、日期、正则、对象所检测出的结果都是object,不过可以判断出function。

(2)typeof null 会返回object

2. instanceof

(1)介绍

instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。即检测对象A是否为对象B的实例。但是判断不了A具体是什么数据类型,B要求是对象类型。

instanceof 返回布尔值。

(2)语法

object instanceof constructor

参数:

object:某个实例对象 constructor:某个构造函数

(3)原理

查看B对象的prototype属性指向的原型对象是不是在A的原型链上,若存在返回true,否则返回false。

例:

function Fruit (name, color) {

this.name = name;

this.color = color;

}

function Apple (shape) {

this.shape = shape;

}

Apple.prototype = new Fruit('红富士', 'red'); //继承

let newApple = new Apple('圆的');

console.log(newApple);

console.log(newApple instanceof Apple); //true

console.log(newApple instanceof Fruit); //true

console.log(newApple instanceof Object); //true

输出: 原型链:newApple —(–proto–)—> Apple.protoType —(–proto–)—> Fruit.protoType —(–proto–)—> Object.protoType —(–proto–)—> null

需要注意的是,如果表达式 newApple instanceof Fruit 返回 true,则并不意味着该表达式会永远返回 true,因为 Fruit.prototype 属性的值有可能会改变,改变之后的值很有可能不存在于 newApple 的原型链上,这时原表达式的值就会成为 false。另外一种情况下,原表达式的值也会改变,就是改变对象newApple的原型链的情况,虽然在目前的ES规范中,我们只能读取对象的原型而不能改变它,但借助于非标准的 __proto__ 伪属性,是可以实现的。比如执行 newApple.__proto__ = {} 之后,newApple instanceof Fruit 就会返回 false 了。

(4) 例

console.log('1是number类型吗? ');

console.log(1 instanceof Number);

console.log('new Number(1)中1是number类型吗? ');

console.log(new Number(1) instanceof Number);

console.log(' "1"字符串吗? ' );

console.log( '1' instanceof String);

console.log('new String(1)中1是String类型吗? ' );

console.log( new String(1) instanceof String);

console.log('true是布尔型吗? ' );

console.log(true instanceof Boolean);

console.log('new Boolean(true)中1是Boolean类型吗? ' );

console.log( new Boolean(true) instanceof Boolean);

console.log('undefined是Object吗? ' );

console.log(undefined instanceof Object);

console.log('null是Object吗? ' );

console.log(null instanceof Object);

console.log('Symbol是Symbol类型吗? ' );

console.log(Symbol() instanceof Symbol);

console.log('Object(Symbol())是Symbol类型吗? ' );

console.log(Object(Symbol()) instanceof Symbol);

console.log('1n是BigInt类型吗? ' );

console.log(1n instanceof BigInt);

console.log('Object(1n) 是BigInt类型吗? ' );

console.log(Object(1n) instanceof BigInt);

console.log('function 是Function类型吗? ' );

console.log((function() {}) instanceof Function);

console.log('[] 是Array类型吗? ' );

console.log([] instanceof Array);

console.log('new Date() 是Date类型吗? ' );

console.log(new Date() instanceof Date);

console.log('/regex/ 是RegExp类型吗? ' );

console.log(/regex/ instanceof RegExp);

console.log('{} 是Object类型吗? ' );

console.log({} instanceof Object);

输出:

(5) 缺点

(1)instanceof能够检查object、date、array、function等引用类型,但是检查不了number、boolean、string 等基本数据类型。 (2)由于返回的布尔值,所以不能直观看到数据类型。

3. constructor(不推荐)

(1)介绍

查看对象对应的构造函数。 constructor 在其对应对象的原型下面,是自动生成的。当我们写一个构造函数的时候,程序会自动添加:构造函数名.prototype.constructor = 构造函数名

(2) 例:

var str = '1';

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

var bool = true;

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

var num = 1;

console.log(num.constructor === Number); //true

//null和undefined是无效的对象,没有constructor

// var nul = null;

// console.log(nul.constructor == Object); //报错

// var und = undefined;

// console.log(und.constructor == Object); //报错

var newDate = new Date();

console.log(newDate.constructor === Date); //true

var newObject = {};

console.log(newObject.constructor === Object); //true

var arr = [];

console.log(arr.constructor === Array); //true

var reg = /\d/;

console.log(reg.constructor === RegExp); //true

var newfunction = function(){};

console.log(newfunction.constructor === Function); //true

var error = new Error();

console.log(error.constructor === Error); //true

输出:

(3)缺点

constructor属性是可以被修改的,会导致检测出的结果不正确。

例:

function A(){}

A.prototype.constructor = A; //写了一个构造函数A,程序自动添加,A的构造函数指向A

function B(){}

A.prototype.constructor = B; //把A的构造函数指向B了

console.log(A.construtor === A); //false

输出: 因此,不推荐。

4. Object.prototype.toString.call() (推荐)

(1)介绍

可以精准得判断出数据类型。

(2)语法

Object.prototype.toString.call(param)

(3)原理

Object上有两个toString方法,一个在Object本身,另一个在Object.prototype原型对象上。Object.prototype上的toString()方法具有判断数据类型的功能。默认情况下,toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 “[object type]”,其中 type 是对象的类型。也就是说,Object本身上的toString()方法是继承了原型上的方法后进行了重写。Array,function等类型作为Object的实例,都重写了toString()方法,调用的时候直接调用重写的toString()方法。

只有Object.prototype上的toString具有判断数据类型的功能,因此我们使用其判断数据类型需要使用call方法改变this指向。

原理例:

let arr = [1, '1']

console.log(Object.prototype.toString(arr));

console.log(Object.prototype.toString.call(arr));

输出: 解释: 不加call(),this指针指向object,因此数据类型是object, 加了call(),this指向arr,调用了数组的重写的toString()方法,结果为Array类型。

(4)例

console.log(Object.prototype.toString.call(1));

console.log(Object.prototype.toString.call('1'));

console.log(Object.prototype.toString.call(undefined));

console.log(Object.prototype.toString.call(null));

console.log(Object.prototype.toString.call(true));

console.log(Object.prototype.toString.call({}));

console.log(Object.prototype.toString.call([]));

console.log(Object.prototype.toString.call(function(){}));

console.log(Object.prototype.toString.call(new Date()));

console.log(Object.prototype.toString.call(/\d/));

console.log(Object.prototype.toString.call(1n));

console.log(Object.prototype.toString.call(Symbol()));

输出:

5. isArray()

(1)介绍

Array.isArray() 用于确定传递的值是否是一个 Array。返回布尔值。

(2)语法

Array.isArray(obj)

参数: obj:需要检测的值。

(3) 例

let arr = [1, '1'];

let obj = {a: 1};

console.log(Array.isArray(arr));

console.log(Array.isArray(obj));

输出:

参考:

MDN官网instanceof原理判断js数据类型的四种方法,以及各自的优缺点 //参考构造函数判断类型Object.prototype.toString.call(obj)的理解

❈ ❈ ❈

相关文章

✧ ✧ ✧
大便中有像蛆的东西是什么原因
365网站余额截图

大便中有像蛆的东西是什么原因

📅 07-09 👁️ 9559
一个侮辱性词语,是怎么变成一种半真半假的夸奖的?
体育直播365下载

一个侮辱性词语,是怎么变成一种半真半假的夸奖的?

📅 07-19 👁️ 9446
MUNI牧尼的围巾怎么样属于什么档次,性价比高的大众品牌