1. 程式人生 > >js中的valueOf和toString

js中的valueOf和toString

valueOf和toSring兩個函式是除null和undefined兩種資料型別以外其他五種資料型別(number/string/bool/object/symbol)原型鏈上共有的函式,那麼這兩個函式主要是用來幹什麼的呢?司徒正美大神給出的答案是:值運算和顯示問題,一般在隱式型別轉換時會自動呼叫。
例1:
如果同時重寫了valueOf和toString方法:

var aaa = {
  i: 10,
  valueOf: function() { 
	  console.log('valueOf')
	  return this.i+30; 
  },
  toString: function() { 
	  console.log('toString')
	  return this.i+10;
   }
}
 console.log(aaa > 20); // valueOf  true
 console.log('' + aaa);  //  valueOf  40
 console.log(++aaa); // valueOf  41
 console.log(+aaa); //  valueOf  40
 alert(aaa); // toString 20
 console.log(aaa == 40) //valueOf true
 console.log(String(aaa)) // toString 20

總結:涉及到操作符的問題,valueOf的優先順序比toString的優先順序高,涉及到顯示問題,toString方法優先順序比valueOf方法高。
例2:
如果只是重寫了toString方法:

var aaa = {
  i: 10,
  toString: function() { 
	  console.log('toString')
	  return this.i+10;
   }
}
 console.log(aaa > 20); // toString false
 console.log('' + aaa);  //  toString 20
 console.log(++aaa); // toString 21
 console.log(+aaa); //  toSring 20
 alert(aaa); // toString 20
 console.log(aaa == 20) //toString true
 console.log(String(aaa)) // toString 20

總結:只重寫了toString方法的話,toString方法比原型鏈上的valueOf方法優先順序高。
例3
如果只重寫了valueOf方法:

var aaa = {
  i: 10,
  valueOf: function() { 
	  console.log('valueOf')
	  return this.i+30;
   }
}
 console.log(aaa > 20); // valueOf true
 console.log('' + aaa);  //  valueOf 40
 console.log(++aaa); // valueOf 41
 console.log(+aaa); //  valueOf 40
 alert(aaa); // [object Object]
 console.log(aaa == 20) //valueOf false
 console.log(String(aaa)) // [object Object]

總結:只重寫了valueOf方法的話,涉及到值運算優先呼叫valueOf方法,涉及到顯示問題還是優先呼叫原型鏈上的toString方法。

參考:https://www.cnblogs.com/rubylouvre/archive/2010/10/01/1839748.html