JavaScript学习笔记(一)JS的数据类型(2)

上一篇博客算是基本把6种数据类型给解释了一下。当然这些解释还是基于我现在的知识水平,只是一些浅显的理解。万事开头难,以后会慢慢进行补充der~。
这一篇博客则是对JS的数据类型的检测方法进行一个小结。虽然很多博客已经讲得很清楚了,但是我还是想按照自己的方式对我理解的内容进行归纳总结再分享出来。

3. JS数据类型判断小结

这里参考的有:
https://segmentfault.com/a/1190000008882968
https://www.cnblogs.com/onepixel/p/5126046.html
和https://www.cnblogs.com/onepixel/p/5126046.html
(1)typeof
typeof判断数据类型会返回一个字符串,包括以下 7 种:number、boolean、symbol、string、object、undefined、function 等。

// Numbers
typeof 37 === 'number';
typeof 3.14 === 'number';
typeof Math.LN2 === 'number';
typeof Infinity === 'number';
typeof NaN === 'number'; // 尽管NaN是"Not-A-Number"的缩写,意思是"不是一个数字"
typeof Number(1) === 'number'; // 不要这样使用!

// Strings
typeof "" === 'string';
typeof "bla" === 'string';
typeof (typeof 1) === 'string'; // typeof返回的肯定是一个字符串
typeof String("abc") === 'string'; // 不要这样使用!

// Booleans
typeof true === 'boolean';
typeof false === 'boolean';
typeof Boolean(true) === 'boolean'; // 不要这样使用!

// Symbols
typeof Symbol() === 'symbol';
typeof Symbol('foo') === 'symbol';
typeof Symbol.iterator === 'symbol';

// Undefined
typeof undefined === 'undefined';
typeof blabla === 'undefined'; // 一个未定义的变量,或者一个定义了却未赋初值的变量

// Objects
typeof {a:1} === 'object';

// 使用Array.isArray或者Object.prototype.toString.call方法可以从基本的对象中区分出数组类型
typeof [1, 2, 4] === 'object';

typeof new Date() === 'object';

// 下面的容易令人迷惑,不要这样使用!
typeof new Boolean(true) === 'object';
typeof new Number(1) ==== 'object';
typeof new String("abc") === 'object';

// 函数
typeof function(){} === 'function';
typeof Math.sin === 'function';

有些时候,typeof 操作符会返回一些令人迷惑但技术上却正确的值:

  • 对于基本类型,除 null 以外,均可以返回正确的结果。
  • 对于引用类型,除 function 以外,一律返回 object 类型。
  • 对于 null ,返回 object 类型。
  • 对于 function 返回 function 类型。
    (2)instanceof
    判断对象属于哪个类型。通常被用于条件判断语句。注意大小写一定不能写错!
alert(a instanceof b);//判断a是否是b的一个对象
//例如
alert(c instanceof Array) ;//true
alert(d instanceof Date) 
alert(f instanceof Function) ;// true
alert(f instanceof function) ;//false

instanceof使用的是原型链追溯的方式,因此instanceof 只能用来判断两个对象是否属于实例关系, 而不能判断一个对象实例具体属于哪种类型。
在这里插入图片描述
(3)constructor
当一个函数 F被定义时,JS引擎会为F添加 prototype 原型,然后再在 prototype上添加一个 constructor 属性,并让其指向 F 的引用。如下所示。constructor也是用于条件分支的判断比较多。
每个类型的判断方法如下:

console.log("string".constructor == String);
console.log((123).constructor == Number);
console.log(false.constructor == Boolean);
console.log([].constructor == Array);
console.log({}.constructor == Object);

通用的方法:

function isArray(object){
  return object && typeof object==='object' &&
      Array == object.constructor;
}

注意事项:

  1. null 和 undefined 是无效的对象,因此是不会有 constructor 存在的,这两种类型的数据需要通过其他方式来判断。
  2. 函数的 constructor 是不稳定的,这个主要体现在自定义对象上,当开发者重写 prototype 后,原有的 constructor 引用会丢失,constructor 会默认为 Object。

(4) toString()方法
这是一个通用的方法,虽然写起来比较繁琐,但是暂时没有什么局限性。
toString() 是 Object 的原型方法,调用该方法,默认返回当前对象的 [[Class]] 。这是一个内部属性,其格式为 [object Xxx] ,其中 Xxx 就是对象的类型。
对于 Object 对象,直接调用 toString() 就能返回 [object Object] 。而对于其他对象,则需要通过 call / apply 来调用才能返回正确的类型信息。

Object.prototype.toString.call('') ;   // [object String]
Object.prototype.toString.call(1) ;    // [object Number]
Object.prototype.toString.call(true) ; // [object Boolean]
Object.prototype.toString.call(Symbol()); //[object Symbol]
Object.prototype.toString.call(undefined) ; // [object Undefined]
Object.prototype.toString.call(null) ; // [object Null]
Object.prototype.toString.call(new Function()) ; // [object Function]
Object.prototype.toString.call(new Date()) ; // [object Date]
Object.prototype.toString.call([]) ; // [object Array]
Object.prototype.toString.call(new RegExp()) ; // [object RegExp]
Object.prototype.toString.call(new Error()) ; // [object Error]
Object.prototype.toString.call(document) ; // [object HTMLDocument]
Object.prototype.toString.call(window) ; //[object global] window 是全局对象 global 的引用

猜你喜欢

转载自blog.csdn.net/shadothew/article/details/87721286