美文网首页
js的装箱操作和拆箱操作

js的装箱操作和拆箱操作

作者: 转移到CSDN名字丹丹的小跟班 | 来源:发表于2021-06-28 17:51 被阅读0次

    装箱操作:把基本数据类型转换为对应的引用类型的操作。
    拆箱操作: 把引用类型转换为基本数据类型的操作。

    上面两个概念只是简洁的实质总结,可能看完后大家心里会产生疑问,到底怎么样叫装箱操作和拆箱操作呢?下面我们一起带着这个疑问往下看~~

    装箱操作

    首先我们要知道在js中有三个基本包装类型:Number,String,Boolean,先简单看下小demo

    var str="hello world";
    var strRes=str.split(" ");
    console.log(strRes)     //["hello", "world"]
    

    如上面代码所示,变量str是一个基本类型值,不是一个对象,就不存在方法,但上面代码却显示可以正常调用方法。实际上这一切都是js内部做了以下处理:
    (1)创建String类型的一个实例;
    (2)在实例上调用指定的方法;
    (3)销毁这个实例;
    转换为对应代码就是:

    var str = new String("hello world");
    var strRes = str.split(" ");
    str = null;
    

    其实,说白了就是临时创建了一个对象,然后去调用方法。下面这句话引用自《javascript高级程序设计》一书中:

    每当读取一个基本类型的时候,后台就会创建一个对应的基本包装类型对象,从而让我们能够调用一些方法来操作这些数据。

    拆箱操作

    拆箱操作中主要有两个方法,valueOf()方法和toString()方法。这两个方法主要用来检测你返回的是不是一个基本类型的值。一般是先用valueOf()来检测,如果返回的不是一个基本类型的值,是对象自身,则会继续用toString()来检测,如果检测结果不是一个基本类型的值,则会报错(Uncaught SyntaxError: Invalid or unexpected token)。以下是两个方法的具体描述,引用自MDN。

    valueOf
    1.valueOf() 方法返回指定对象的原始值。
    2.JavaScript调用valueOf方法将对象转换为原始值。你很少需要自己调用valueOf方法;当遇到要预期的原始值的对象时,JavaScript会自动调用它。
    3.默认情况下,valueOf方法由Object后面的每个对象继承。 每个内置的核心对象都会覆盖此方法以返回适当的值。如果对象没有原始值,则valueOf将返回对象本身。
    4.JavaScript的许多内置对象都重写了该函数,以实现更适合自身的功能需要。因此,不同类型对象的valueOf()方法的返回值和返回值类型均可能不同。

    toString
    1.toString() 方法返回一个表示该对象的字符串。
    2.每个对象都有一个 toString() 方法,当该对象被表示为一个文本值时,或者一个对象以预期的字符串方式引用时自动调用。
    3.默认情况下,toString() 方法被每个 Object 对象继承。如果此方法在自定义对象中未被覆盖,toString() 返回 “[object type]”,其中 type 是对象的类型。

    demo

     var objNum = new Number(123);  
     var objStr =new String("123");   
     console.log( typeof objNum ); //object
     console.log( typeof objStr ); //object 
     console.log( typeof objNum.valueOf() ); //number
     console.log( typeof objStr.valueOf() ); //string
    
     console.log( typeof objNum.toString() ); // string 
     console.log( typeof objStr.toString() ); // string
    

    ————————————————
    版权声明:本文为CSDN博主「DLGDark」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/DLGDark/article/details/100836377

    相关文章

      网友评论

          本文标题:js的装箱操作和拆箱操作

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