js中toString()、valueOf()浅析

2019-09-29  本文已影响0人  jadefan

在js中toString()、valueOf()这三个方法是各个数据类型都有的默认方法

toString() 返回一个反映这个对象的字符串
valueOf() 返回它相应的原始值

来逐一看下

string

先来看string类型

    var str = 'abc';
    console.log(str.toString());  //abc  -->string类型
    console.log(str.valueOf());  //abc  -->string类型

可以看出string下都是一样的

number

    var num = 123;
    console.log(num.toString());  //123  -->string类型
    console.log(num.valueOf());  //123  -->number类型

number下输出看似相同,数据类型是不同的

boolean

    var bool = true;
    console.log(bool.toString());  //true  -->string类型
    console.log(bool.valueOf());  //true  -->boolean类型

boolean 的执行结果与number相类似

function

    var fn = function(){}
    console.log(fn.toString());  //function(){}  -->string类型
    console.log(fn.valueOf());  //ƒ (){}  -->function类型

输出不同,效果同上

object

    var obj = {name:'abc'};
    console.log(obj.toString());  //[object Object]  -->string类型
    console.log(obj.valueOf());  //{name: "abc"}    -->string类型

根据以上的例子,大致就能理解它们的定义了
我们几乎没有用到过,是为什么呢?

valueOf() 方法通常由 JavaScript 在后台自动进行调用,而不是显式地处于代码中。

toString() VS valueOf()

它们的主要作用是什么?具体是什么时候调用的呢?

valueOf()方法是Object的原型方法,也就是Object.prototype.valueOf()
默认情况下,valueOf()方法由Object后面的每个对象继承。
每个内置的核心对象都会覆盖此方法以放回适当的值。
如果对象没有原始值,则valueOf()将返回对象本身。

原始类型(primitive value)包括以下几类:null,undefined,string,number,boolean。

如果valueOf或toString返回非primitive value,它们将被忽略。
如果都不存在或都不返回primitive value,则抛出TypeError: Cannot convert object to primitive value。

我们可以自己覆盖valueOf和toString尝试一下

   var obj1 = {
     toString(){
       return 2
     },
     valueOf(){
       return 1
     }
   }; 
   console.log(obj1+1);  //2
   console.log(obj1+'1');  //11

以上代码执行了valueOf()

    var obj2 = {
      toString(){
        return 2
      },
    }; 
    console.log(obj2+1);  //3
    console.log(obj2+'1');  //21

在没有覆盖valueOf()的情况下,valueOf()返回的并非原始类型,所以执行了toString()
也可以看出valueOf的优先级高于toString()

    var obj3 = {
      toString(){
        return {}
      },
      valueOf(){
        return {}
      }
    }; 
    console.log(obj3+1);  //Uncaught TypeError: Cannot convert object to primitive value
    console.log(obj3+'1');  //Uncaught TypeError: Cannot convert object to primitive value

在都没有返回原始类型的情况,直接报错

上一篇下一篇

猜你喜欢

热点阅读