深山涧水 发表于 2023-1-16 19:26:49

JavaScript 判断变量的类型

JavaScript 中有多种方法来判断一个变量的类型。

[*]1、typeof 操作符,它可以返回一个字符串来描述变量的类型,如:
console.log(typeof "hello");// string
console.log(typeof 123);// number
console.log(typeof true);// boolean
console.log(typeof {});// object
console.log(typeof []);// object
console.log(typeof undefined);// undefined
console.log(typeof null);// object

[*]2、instanceof 操作符,可以用来判断一个变量是否是某个类的实例,如:
console.log("hello" instanceof String);// false
console.log(new String("hello") instanceof String);// true
console.log( instanceof Array);// true
console.log({} instanceof Object);// false

[*]3、Object.prototype.toString.call() 方法,可以返回变量的类型,如:
console.log(Object.prototype.toString.call("hello"));//
console.log(Object.prototype.toString.call(123));//
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(undefined));//
console.log(Object.prototype.toString.call(null));// 值得注意的是,在判断null时,typeof 和 Object.prototype.toString.call() 都会返回 'object',而 instanceof 会返回false,此时可以使用 x === null 来判断是否是null。

[*]4、使用 JavaScript 原生的 constructor 属性。每个对象都有一个 constructor 属性,该属性指向创建该对象的函数。可以使用该属性来判断变量的类型。
console.log("hello".constructor === String);   // true
console.log((123).constructor === Number);   // true
console.log([].constructor === Array);         // true
console.log({}.constructor === Object);      // true
console.log(true.constructor === Boolean);   // true
console.log(undefined.constructor === undefined);   // true
console.log(null.constructor === null);      // Uncaught TypeError: Cannot read property 'constructor' of null但是这种方法有一个缺陷,当变量是 null 或 undefined 时,访问该变量的 constructor 属性会抛出错误。
需要注意的是,以上所有方法在判断函数时都会返回 'function',如果需要精确的函数类型,可以使用 Object.prototype.toString.call() 来获取类型 "" 或者使用 Function.name 来获取函数名称。

[*]5、使用ES6新增的Symbol.toStringTag属性,它可以返回一个字符串来描述变量的类型,这个方法与使用 Object.prototype.toString.call() 类似
console.log("hello");// "String"
console.log(123);// "Number"
console.log(true);// "Boolean"
console.log({});// "Object"
console.log([] );// "Array"
console.log(undefined);// "Undefined"
console.log(null);// "Null"
console.log(()=>{});// "Function"注意,在使用该方法时需要确保目标浏览器支持ES6的 Symbol 类型,或者使用 babel 等工具进行转换。

[*]6、使用第三方库,如 lodash 的 isXXX 系列函数,可以用来判断变量的类型。这些函数的使用方式非常简单,直接调用对应的函数即可,如:
console.log(_.isString("hello"));// true
console.log(_.isNumber(123));// true
console.log(_.isBoolean(true));// true
console.log(_.isObject({}));// true
console.log(_.isArray([]));// true
console.log(_.isUndefined(undefined));// true
console.log(_.isNull(null));// true
console.log(_.isFunction(() => {}));// true使用这些函数可以避免在不同环境中类型判断出现问题,更加严谨。
 
综上,JavaScript 中有多种方法来判断变量的类型,如 typeof、instanceof、Object.prototype.toString.call()、constructor属性、Symbol.toStringTag属性以及 lodash 等第三方库,在使用时需要根据实际需求来选择使用。

来源:https://www.cnblogs.com/yuzhihui/p/17055887.html
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!
页: [1]
查看完整版本: JavaScript 判断变量的类型