美文网首页js
js 比较typeOf,instanceof,construct

js 比较typeOf,instanceof,construct

作者: world_7735 | 来源:发表于2018-10-30 13:27 被阅读51次

    如何判断js中的类型呢,先举几个例子:
    var a = "json";
    var b = 123;
    var c = true;
    var d = [1,2,3];
    var e = new Date();
    var f = function(){
    alert('jason');
    };
    一、最常见的判断方法:typeof
    typeof是一个一元运算符,它返回的结果始终是一个字符串,对不同的操作数,它返回不同的结果,另外typeof可以判断function的类型;在判断除Object类型的对象时比较方便。
    console.log(typeof a == "string"); //true
    console.log(typeof a == String); //false
    具体的规则如下:

    1. 对于数字类型的操作数而言, typeof 返回的值是 number。比如说:typeof 1,返回的值就是number。
      上面是举的常规数字,对于非常规的数字类型而言,其结果返回的也是number。比如typeof NaN,NaN在JavaScript中代表的是特殊非数字值,虽然它本身是一个数字类型。
      在JavaScript中,特殊的数字类型还有几种:
      Infinity //表示无穷大特殊值
      NaN //特殊的非数字值
      Number.MAX_VALUE //可表示的最大数字
      Number.MIN_VALUE //可表示的最小数字(与零最接近)
      Number.NaN //特殊的非数字值
      Number.POSITIVE_INFINITY //表示正无穷大的特殊值
      Number.NEGATIVE_INFINITY //表示负无穷大的特殊值
      以上特殊类型,在用typeof进行运算进,其结果都将是number。
    1. 对于字符串类型,typeof返回的值是string。比如typeof "jason"返回的值是string。
    2. 对于布尔类型,typeof返回的值是boolean。比如typeof true返回的值是boolean。
    3. 对于对象、数组、null返回的值是object。比如typeof {},typeof [],typeof null返回的值都是object。
    1. 对于函数类型,返回的值是function。比如:typeof eval,typeof Date返回的值都是function。
    2. 如果运算数是没有定义的(比如说不存在的变量、函数或者undefined),将返回undefined。比如:typeof undefined都返回undefined。

    console.log(typeof a); //string
    console.log(typeof b); //number
    console.log(typeof c); //boolean
    console.log(typeof d); //object
    console.log(typeof e); //object
    console.log(typeof f); //function

    console.log(typeof 1); //number
    console.log(typeof NaN); //number
    console.log(typeof Number.MIN_VALUE); //number
    console.log(typeof Infinity); //number
    console.log(typeof "123"); //string
    console.log(typeof true); //boolean
    console.log(typeof {}); //object
    console.log(typeof []); //object
    console.log(typeof null); //object
    console.log(typeof eval); //function
    console.log(typeof Date); //function
    console.log(typeof undefined); //undefined

    二、判断一个对象是否为某一数据类型,或一个变量是否为一个对象的实例:instanceof

    注意:1)instanceof 后面一定要是对象类型,并且大小写不能错,该方法适合一些条件选择或分支。
    2)instanceof 运算符用来测试一个对象在其原型链中是否存在一个构造函数的 prototype 属性。
    语法:object instanceof constructor
    参数:object(要检测的对象.)constructor(某个构造函数)
    描述:instanceof 运算符用来检测 constructor.prototype 是否存在于参数 object 的原型链上。
    console.log(d instanceof Array); //true
    console.log(e instanceof Date); //true
    console.log(f instanceof Function); //true

    如果你想检测对象的原型链上是否存在某个特定的原型对象,有没有不适用构造函数作为中介的方法呢?可以用isPrototypeOf() 方法
    作用:检测一个对象是否是另一个对象的原型。或者说一个对象是否被包含在另一个对象的原型链中
    例如:
    var p = {x:1};//定义一个原型对象
    var o = Object.create(p);//使用这个原型创建一个对象
    p.isPrototypeOf(o);//=>true:o继承p
    Object.prototype.isPrototypeOf(p);//=> true p继承自Object.prototype

    function Animal(){
        this.species = "动物";
     };
    var eh = new Animal();
    Animal.prototype.isPrototypeOf(eh)//=>true

    三、根据对象的constructor判断:constructor
    console.log(d.constructor === Array) //true
    console.log(e.constructor === Date) //true
    console.log(f.constructor === Function) //true
    注意constructor在类继承时会出错
    例如:
    function A(){};
    function B(){};
    var aObj = new A();
    console.log(aObj.constructor === A); //true;
    console.log(aObj.constructor === B); //false;

    function C(){};
    function D(){};
    C.prototype = new D(); //C继承自D
    var cObj = new C();
    console.log(cObj.constructor === C);    //false;
    console.log(cObj.constructor === D);    //true;
    

    而instanceof方法不会出现该问题,对象直接继承和间接继承的都会报true:
    console.log(cObj instanceof C); //true
    console.log(cObj instanceof D); //true

    解决construtor的问题通常是让对象的constructor手动指向自己:
    cObj.constructor = C; //将自己的类赋值给对象的constructor属性
    console.log(cObj.constructor === C); //true;
    console.log(cObj.constructor === D); //false; 基类不会报true了;

    四、通用但很繁琐的方法:prototype
    console.log(Object.prototype.toString.call(a) === '[object String]'); //true
    console.log(Object.prototype.toString.call(b) === '[object Number]'); //true
    console.log(Object.prototype.toString.call(c) === '[object Boolean]'); //true
    console.log(Object.prototype.toString.call(d) === '[object Array]'); //true
    console.log(Object.prototype.toString.call(e) === '[object Date]'); //true
    console.log(Object.prototype.toString.call(f) === '[object Function]'); //true

    相关文章

      网友评论

        本文标题:js 比较typeOf,instanceof,construct

        本文链接:https://www.haomeiwen.com/subject/mrzwtqtx.html