对toLocaleString()、toString()、valueOf()的理解

  • A+
所属分类:Web前端
摘要

toLocaleString()、toString()、valueOf()是JavaScript的复杂数据类型object的实例所具有的方法。


JavaScript#

toLocaleString()toString()valueOf()是JavaScript的复杂数据类型object的实例所具有的方法。

toString()

返回一个表示该对象的字符串。

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

var o = new Object(); o.toString(); // returns [object Object] 

对toLocaleString()、toString()、valueOf()的理解

toLocaleString()

toLocaleString() 方法返回一个该对象的字符串表示。此方法被用于派生对象为了特定语言环境的目的(locale-specific purposes)而重载使用。

该方法实则是返回调用toString()的结果。

Array.prototype.toLocaleString()

const array1 = [1, 'a', new Date('21 Dec 1997 14:12:00 UTC')]; const localeString = array1.toLocaleString('en', { timeZone: 'UTC' });  console.log(localeString); // expected output: "1,a,12/21/1997, 2:12:00 PM", // This assumes "en" locale and UTC timezone - your results may vary  

valueOf()

返回指定对象的原始值

JavaScript调用valueOf方法将对象转换为原始值。你很少需要自己调用valueOf方法;当遇到要预期的原始值的对象时,JavaScript会自动调用它。

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

JavaScript的许多内置对象都重写了该函数,以实现更适合自身的功能需要。因此,不同类型对象的valueOf()方法的返回值和返回值类型均可能不同。

对toLocaleString()、toString()、valueOf()的理解

你可以在自己的代码中使用valueOf将内置对象转换为原始值。 创建自定义对象时,可以覆盖Object.prototype.valueOf()来调用自定义方法,而不是默认Object方法。

function MyNumberType(n) {     this.number = n; }  MyNumberType.prototype.valueOf = function() {     return this.number; };  var myObj = new MyNumberType(4); myObj + 3; // 7 

toString()和toString()的调用场景

这两个方法在进行类型转换时经常被调用。

Number()

Number()用于其他类型转换为数值类型,其转换规则中的一条是对对象进行转换时,先调用其valueOf()方法,如果返回了对象本身(像大多数的Array类型,所有function类型,自定义对象却没有覆盖valueOf()等),这时再用Number()去转换,结果必然是NaN。

然后换成调用其toString()方法,如果返回的是类似于"[object type]",则Number()的结果是NaN。

对toLocaleString()、toString()、valueOf()的理解

function myObj(){}  myObj.prototype.valueOf = function(){     return "1" }  myObj.prototype.toString = function(){     return "2" }  var obj = new myObj(); Number(obj);       //1   //然后修改valueOf(),使其返回对象本身 myObj.prototype.valueOf = function(){ return this;} obj.valueOf();        //myObj() Number(obj);          //2 

上面的代码是为obj的原型定义toString()和valueOf(),直接定义obj的这两种方法也是可以的。

加性运算符

加性操作符包含加和减

对于加法,如果有一个操作数是对象,先调用其toString()获得相应的字符串值,然后拼接成新字符串。如果返回的是null或undefined,就分别调用String()函数并得到字符串“null”和“undefined”

var res = 1 + obj;   //等价于 var res; if(typeof obj.toString() === "string"){     res = 1 + obj.toString();  } else if([null,undefined].includes(typeof obj)){     res = 1 + String(typeof obj); } 

对于减法,如果有一个操作数是对象,则调用其valueOf()来获取其值,如果得到的值是NaN,减法的结果就是NaN。如果对象没有valueOf()方法,则调用其toString()方法先转换为字符串,再用Number()转换为数值。

参考:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object