它们俩解决javascript值运算与显示的问题,重写会加大它们调用的优化。 测试分析 先看一例: var aaa = { i: 10, valueOf: function() { return this.i+30; }, toString: function() { return ...
前言
基本上,所有JS数据类型都拥有这两个方法,null除外。它们俩解决javascript值运算与显示的问题,重写会加大它们调用的优化。
测试分析
先看一例:
var aaa = {
i: 10,
valueOf: function() { return this.i+30; },
toString: function() { return this.valueOf()+10; }
}
alert(aaa > 20); // true
alert(+aaa); // 40
alert(aaa); // 50
之所以有这样的结果,因为它们偷偷地调用valueOf或toString方法。
但如何区分什么情况下是调用了哪个方法呢,我们可以通过另一个方法测试一下。
由于用到console.log,请在装有firebug的FF中实验!
var bbb = {
i: 10,
toString: function() {
console.log('toString');
return this.i;
},
valueOf: function() {
console.log('valueOf');
return this.i;
}
}
alert(bbb);// 10 toString
alert(+bbb); // 10 valueOf
alert(''+bbb); // 10 valueOf
alert(String(bbb)); // 10 toString
alert(Number(bbb)); // 10 valueOf
alert(bbb == '10'); // true valueOf
alert(bbb === '10'); // false
结果给人的感觉是,如果转换为字符串时调用toString方法,如果是转换为数值时则调用valueOf方法,但其中有两个很不和谐。一个是alert(''+bbb),字符串合拼应该是调用toString方法……另一个我们暂时可以理解为===操作符不进行隐式转换,因此不调用它们。为了追究真相,我们需要更严谨的实验。
var aa = {
i: 10,
toString: function() {
console.log('toString');
return this.i;
}
}
alert(aa);// 10 toString
alert(+aa); // 10 toString
alert(''+aa); // 10 toString
alert(String(aa)); // 10 toString
alert(Number(aa)); // 10 toString
alert(aa == '10'); // true toString
再看valueOf。
var bb = {
i: 10,
valueOf: function() {
console.log('valueOf');
return this.i;
}
}
alert(bb);// [object Object]
alert(+bb); // 10 valueOf
alert(''+bb); // 10 valueOf
alert(String(bb)); // [object Object]
alert(Number(bb)); // 10 valueOf
alert(bb == '10'); // true valueOf
发现有点不同吧?!它没有像上面toString那样统一规整。
对于那个[object Object],我估计是从Object那里继承过来的,我们再去掉它看看。
Object.prototype.toString = null;
var cc = {
i: 10,
valueOf: function() {
console.log('valueOf');
return this.i;
}
}
alert(cc);// 10 valueOf
alert(+cc); // 10 valueOf
alert(''+cc); // 10 valueOf
alert(String(cc)); // 10 valueOf
alert(Number(cc)); // 10 valueOf
alert(cc == '10'); // true valueOf
总结:valueOf偏向于运算,toString偏向于显示。
1、在进行对象转换时(例如:alert(a)),将优先调用toString方法,如若没有重写toString将调用valueOf方法,如果两方法都不没有重写,但按Object的toString输出。
2、在进行强转字符串类型时将优先调用toString方法,强转为数字时优先调用valueOf。
3、在有运算操作符的情况下,valueOf的优先级高于toString。
JavaScript获取value值,主要有以下三种:1.用document.getElementById(“id名”).value来获取(例1);2.通过form表单中的id名或者name名来获取(例2)。3.通过id名(不用写getElementById,也不...
今天在js中用id名直接获取value值时遇到点问题,所以顺便做一下总结。
JavaScript获取value值,主要有以下三种:
1.用document.getElementById(“id名”).value来获取(例1);
2.通过form表单中的id名或者name名来获取(例2)。
3.通过id名(不用写getElementById,也不用放在表单中)直接获取value值(例3)。但是直接通过value值获取需要注意以下几点:
①变量名不能和id名一样,否则无效;
②函数名不能和id名一样,否则无效;
③如果需要获取的id外面还有盒子,不能像表单那样,将盒子的name或者id写在前面,eg: var aa=box.need_id.value 是不行的,应该直接写var aa=need_id.value ;
例1:
用document.getElementById(“id名”).value来获取
example
function start(){	var aa=document.getElementById("input").value; //通过document.getElementById(“id名”).value来获取value值。	alert(aa);	}
例2:
通过表单中的id或者name获取value值,效果和例1是一样一样的

function start(){	var aa=frm.input1.value; //通过表单中的id获取value值;或者 var aa=frm.input2.value;通过name获取也可以。	alert(aa);	}
例3:
直接通过id名获取value值,效果也和例1是一样一样的
example
function start(){	var aa=input2.value; //直接通过id名获取value值,但是如果写 var input2=input2.value; alert(input2)则无效。	alert(aa);	}
一切尽在不言中,直接上代码:var obj = { "01": "Hello World!", "02": "Hello Human!" }; alert(obj["02"]); 这有时候会在编码过程中带来莫大的方便。
一切尽在不言中,直接上代码:
var obj = {"01":"Hello World!","02":"Hello Human!" }; alert(obj["02"]);
这有时候会在编码过程中带来莫大的方便。
说明所有的对象都继承有toString() 和valueOf() 方法,对象到字符串,对象到数字的转换,会通过调用待转换对象的这两个方法中的一个来完成。 解释toString( )方法的作用是:返回一个反映这个对象的字符串,而很多类...

说明

所有的对象都继承有toString() 和valueOf() 方法,对象到字符串,对象到数字的转换,会通过调用待转换对象的这两个方法中的一个来完成。

解释

toString( )方法的作用是:
返回一个反映这个对象的字符串,而很多类都定义了不同版本的toString( )。

对象操作
默认返回 “[object class]”,其中 class是对象类型的名称。其中class是该对象的类:值为"Object"、“String”、“Number”、“Function”、“Window”、“Document”、等。
Array将Array 的元素转换为字符串。结果字符串由逗号分隔,且连接起来。
Boolean如果 Boolean 值是 true,则返回 “true”。否则,返回 “false”。
Date返回日期的文字表示法。
Error返回一个包含相关错误消息的字符串。
Function返回如下格式的字符串,其中 functionname 是被调用 toString 方法函数的名称:function functionname( ) { [native code] }
RegExp返回正则表达式直接量的字符串
Number返回数字的文字表示。
String返回 String 对象的值。

({}.toString()); //=> "[object Object]" [1,2].toString(); //=> "1,2" true.toString(); //=> "true" new Date(1970,0,1).toString(); //=> "Thu Jan 01 1970 00:00:00 GMT+0800 (CST)" Error("一个错误信息").toString(); //=> "Error: 一个错误信息" (function (x){return x}).toString(); //=> "function (x){return x}" /\d/.toString(); //=> "/\\d/" 或者 "/\d/" 浏览器不同返回也可能会不同
valueOf() 方法,它的作用是:
如果对象存在任意原始值,它就默认将对象转换为表示它的原始值,如果对象是复合值,而且大多数对象无法真正表示为一个原始值,因此默认的valueOf( )方法简单地返回对象本身,而不是返回一个原始值。
数组、函数、和正则表达式简单的继承了这个默认方法,调用这些类型的实例的valueOf( )方法只是简答返回对象本身。
日期类定义的valueOf( )方法会返回它的一个内部表示:1970年1月1日以来的毫秒数。
[1,2].valueOf(); //=> [1,2] (function (){}).valueOf(); //=> function (){} /\d/.valueOf(); //=> /\d/ new Date().valueOf(); //=> 1502941383029
原始值:不可变更的值,包括undefined、null、布尔值、数字、和字符串。
看下面这张图,列出了一些基本的类型转换,这张图来自 JavaScript权威指南。
好了,我们现在已经了解toString( )方法 和valueOf( )方法了,下来我们来说说,对象到字符串和对象到数字的转换。
对象到字符串的转换:
1、如果对象具有toString( )方法,则调用这个方法。如果她返回一个原始值,JavaScript将这个值转换为字符串(如果本身不是字符串的话),并返回这个字符串结果。
2、如果对象没有toString( )方法,或者这个方法并不返回一个原始值,那么JavaScript会调用valueOf( )方法。如果存在这个方法,则JavaScript调用它。如果返回值是原始值,JavaScript将这个值转换为字符串(如果本身不是字符串的话),并返回这个字符串结果。
3、否则,JavaScript无法从toString()或者valueOf( )获得一个原始值,因此这时它将抛出一个类型错误异常。
对象到数字的转换:
1、如果对象具有valueOf( )方法,后者返回一个原始值,则JavaScript将这个原始值转换为数字(如果需要的话)并返回这个数字。
2、否则,如果对象具有toString( )方法,后者返回一个原始值,则JavaScript将其转化并返回。
3、否则,JavaScript抛出一个类型错误异常。
所以这就解释了,为什么空数组会被转换为数字0,为什么具有单个元素的数组同样会转换成一个数字。
数组继承了默认的valueOf( )方法,这个方法返回一个对象而不是一个原始值,因此,数组到数字的转换则调用toString( )方法。空数组转换为空字符串,空字符串转换为数字0。
含有一个元素的数组转换为字符串的结果和这个元素转换字符串的结果一样。
如果数组只包含一个数字元素,这个数字转换为字符串,在转换回数字。
JavaScript中的"+“运算符可以进行数学加法和字符串连接操作。如果它的其中一个操作数是对象,则JavaScript将使用特殊的方法将对象转换为原始值,而不是使用其他算术运算符的方法执行对象到数字的转换,”= ="相等运算符与此类似。如果将对象和一个原始值比较,则转换将会遵照对象到原始值的转换方式进行。
“+” 和"= ="应用的对象到原始值的转换包含日期对象的一种特殊情形。日期类是JavaScript语言核心中唯一的预先定义类型,它定义了有意义的向字符串和数字类型的转换。
对于所有非日期的对象来说,对象到原始值的转换基本上是对象到数字的转换(首先调用valueOf( )),日期对象则使用对象到字符串的转换模式,然而,这里的转换和上文讲述的并不完全一致:通过valueOf( )或者toString( )返回的原始值将被直接使用,而不会被强制转换为数字或字符串。
和"= =“一样,”

总结

本文说了说 toString( )方法 和valueOf( )方法的基础知识,文中的许多概念是出自JavaScript权威指南一书,大家可以多看看书。
如果这篇文章理解了,大家可以看看下面这两篇文章,相信你会知道更多有趣的事。
Event对象的returnValue属性的值一般是true,即脚本处理完自己的工作后由元素处理事件。 通过该属性可以取消事件处理程序中调用函数的默认操作。 现在举个例子说明: var charCode=event.keyCode; if(char...
JavaScript中如何获取被选中radio的value值?JavaScript中 : var addressID = $("input[name='sex']:checked").val(); 把radio的name属性值设置成一样的,就会变为单选。