zoukankan      html  css  js  c++  java
  • JS的四种类型识别方式

    前言

    JS中包含丰富的类型系统,在使用过程中,类型识别是重要的一环。JS提供了4种通用的类型检测的方法

      【typeof】【instanceof】【constructor】【Object.prototype.toString】

    【typeof】

      【识别】

        1.能够识别基本数据类型(Null会被识别成'object')

        2.不能识别具体的引用类型(Function除外)

    console.log(typeof "jerry");//"string"
    console.log(typeof 12);//"number"
    console.log(typeof true);//"boolean"
    console.log(typeof undefined);//"undefined"
    console.log(typeof null);//"object"
    console.log(typeof {name: "jerry"});//"object"
    
    console.log(typeof function(){});//"function"
    console.log(typeof []);//"object"
    console.log(typeof new Date);//"object"
    console.log(typeof /d/);//"object"
    function Person(){};
    console.log(typeof new Person);//"object"

    【instanceof】

      instanceof是一个二元运算符,左边是一个对象,右边是一个构造函数,如果左边的对象是右边的构造函数的实例对象,返回true,反之返回false

      【注意】

      如果左边的操作数不是对象,返回false;如果右边的操作数不是函数,抛出类型错误TypeError

    console.log(123 instanceof function(){});//false
    //Uncaught TypeError: Right-hand side of 'instanceof' is not an object
    console.log({} instanceof 123);

      所有的对象都是Object的实例

    ·  【识别】

      1.能够识别内置对象类型、自定义类型及其父类型

      2.不能识别标准类型,会返回false

      3.不能识别undefined和null,会报错

    console.log("jerry" instanceof String);//false
    console.log(12 instanceof Number);//false
    console.log(true instanceof Boolean);//false
    console.log(undefined instanceof Undefined);//报错
    console.log(null instanceof Null);//报错
    console.log({name: "jerry"} instanceof Object);//true
    
    console.log(function(){} instanceof Function);//true
    console.log([] instanceof Array);//true
    console.log(new Date instanceof Date);//true
    console.log(/d/ instanceof RegExp);//true
    function Person(){};
    console.log(new Person instanceof Person);//true
    console.log(new Person instanceof Object);//true

    【constructor属性】

      实例对象的constructor属性只想其构造函数。如果是内置类型,就返回function 数据类型(){[native code]},如果是自定义类型,就返回function 数据类型(){};

      【识别】

      1.能够识别标准类型、内置对象类型以及自定义类型

      2.不能识别undefined、null会报错,因为它们没有构造函数

    console.log(("jerry").constructor);//function String(){[native code]}
    console.log((12).constructor);//function Number(){[native code]}
    console.log((true).constructor);//function Boolean(){[native code]}
    console.log((undefined).constructor);//报错
    console.log((null).constructor);//报错
    console.log(({name: "jerry"}).constructor);//function Object(){[native code]}
    
    console.log((function(){}).constructor);//function Function(){[native code]}
    console.log(([]).constructor);//function Array(){[native code]}
    console.log((new Date).constructor);//function Date(){[native code]}
    console.log((/d/).constructor);//function RegExp(){[native code]}
    function Person(){};
    console.log((new Person).constructor);//function Person(){}

    【Object.prototype.toString】

      对象的类属性是一个字符串,可以使用toStirng输出,我们能够结合使用Object.prototype.toString.call(obj)输出目标对象的类型,结果是:[object 数据类型]

      【识别】

      1.能够识别标准类型和内置对象类型

      2.不能识别自定义类型

    console.log(Object.prototype.toString.call("jerry"));//[object String]
    console.log(Object.prototype.toString.call(12));//[object Number]
    console.log(Object.prototype.toString.call(true));//[object Boolean]
    console.log(Object.prototype.toString.call(undefined));//[object Undefined]
    console.log(Object.prototype.toString.call(null));//[object Null]
    console.log(Object.prototype.toString.call({name: "jerry"}));//[object Object]
    
    console.log(Object.prototype.toString.call(function(){}));//[object Function]
    console.log(Object.prototype.toString.call([]));//[object Array]
    console.log(Object.prototype.toString.call(new Date));//[object Date]
    console.log(Object.prototype.toString.call(/d/));//[object RegExp]
    function Person(){};
    console.log(Object.prototype.toString.call(new Person));//[object Object]
  • 相关阅读:
    Servlet到底是单例还是多例你了解吗?
    Idea的一些调试技巧及设置todo
    Android如何使用so文件和Android studio中导入so
    Android 自定义控件之app标题栏的封装
    Android 动态添加删除ExpandableListView的item的例子
    Android 利用ListView制作带竖线的多彩表格
    Android EditText 改变边框颜色
    Android 使用Okhttp/Retrofit持久化cookie的简便方式
    Android 一个漂亮的Android Spinner
    Android 带清除功能的输入框控件EditText
  • 原文地址:https://www.cnblogs.com/controlms/p/7769204.html
Copyright © 2011-2022 走看看