可以这样说，所有JS数据类型都拥有valueOf和toString这两个方法，null除外。它们俩解决javascript值运算与显示的问题。在程序应用非常广泛。下面我们逐一来给大家介绍下。

JavaScript 的 valueOf() 方法

valueOf() 方法可返回 Boolean 对象的原始值。

用法booleanObject.valueOf()，返回值为booleanObject 的原始布尔值。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(false);
document.write(boo.valueOf());
</script>

以上脚本会输出false。

JavaScript 的 toString() 方法

toString() 方法可把一个逻辑值转换为字符串，并返回结果。

用法 booleanObject.toString()，返回值根据原始布尔值或者 booleanObject 对象的值返回字符串 "true" 或 "false"。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

在 Boolean 对象被用于字符串环境中时，此方法会被自动调用。

下面脚本将创建一个 Boolean 对象，并把它转换成字符串：

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(true);
document.write(boo.toString());
</script>

脚本输出：true。

先看一例：

1
2
3
4
5
6
7
8
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中实验！

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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方法……另一个我们暂时可以理解为===操作符不进行隐式转换，因此不调用它们。为了追究真相，我们需要更严谨的实验。

1
2
3
4
5
6
7
8
9
10
11
12
13
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。

1
2
3
4
5
6
7
8
9
10
11
12
13
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那里继承过来的，我们再去掉它看看。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
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

如果只重写了toString，对象转换时会无视valueOf的存在来进行转换。但是，如果只重写了valueOf方法，在要转换为字符串的时候会优先考虑valueOf方法。在不能调用toString的情况下，只能让valueOf上阵了。对于那个奇怪的字符串拼接问题，可能是出于操作符上，翻开ECMA262-5 发现都有一个getValue操作。嗯，那么谜底应该是揭开了。重写会加大它们调用的优化高，而在有操作符的情况下，valueOf的优先级本来就比toString的高。可以这样说，所有JS数据类型都拥有valueOf和toString这两个方法，null除外。它们俩解决javascript值运算与显示的问题。在程序应用非常广泛。下面我们逐一来给大家介绍下。

JavaScript 的 valueOf() 方法

valueOf() 方法可返回 Boolean 对象的原始值。

用法booleanObject.valueOf()，返回值为booleanObject 的原始布尔值。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(false);
document.write(boo.valueOf());
</script>

以上脚本会输出false。

JavaScript 的 toString() 方法

toString() 方法可把一个逻辑值转换为字符串，并返回结果。

用法 booleanObject.toString()，返回值根据原始布尔值或者 booleanObject 对象的值返回字符串 "true" 或 "false"。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

在 Boolean 对象被用于字符串环境中时，此方法会被自动调用。

下面脚本将创建一个 Boolean 对象，并把它转换成字符串：

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(true);
document.write(boo.toString());
</script>

脚本输出：true。

先看一例：

1
2
3
4
5
6
7
8
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中实验！

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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方法……另一个我们暂时可以理解为===操作符不进行隐式转换，因此不调用它们。为了追究真相，我们需要更严谨的实验。

1
2
3
4
5
6
7
8
9
10
11
12
13
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。

1
2
3
4
5
6
7
8
9
10
11
12
13
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那里继承过来的，我们再去掉它看看。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
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

如果只重写了toString，对象转换时会无视valueOf的存在来进行转换。但是，如果只重写了valueOf方法，在要转换为字符串的时候会优先考虑valueOf方法。在不能调用toString的情况下，只能让valueOf上阵了。对于那个奇怪的字符串拼接问题，可能是出于操作符上，翻开ECMA262-5 发现都有一个getValue操作。嗯，那么谜底应该是揭开了。重写会加大它们调用的优化高，而在有操作符的情况下，valueOf的优先级本来就比toString的高。

可以这样说，所有JS数据类型都拥有valueOf和toString这两个方法，null除外。它们俩解决javascript值运算与显示的问题。在程序应用非常广泛。下面我们逐一来给大家介绍下。

JavaScript 的 valueOf() 方法

valueOf() 方法可返回 Boolean 对象的原始值。

用法booleanObject.valueOf()，返回值为booleanObject 的原始布尔值。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(false);
document.write(boo.valueOf());
</script>

以上脚本会输出false。

JavaScript 的 toString() 方法

toString() 方法可把一个逻辑值转换为字符串，并返回结果。

用法 booleanObject.toString()，返回值根据原始布尔值或者 booleanObject 对象的值返回字符串 "true" 或 "false"。如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。

在 Boolean 对象被用于字符串环境中时，此方法会被自动调用。

下面脚本将创建一个 Boolean 对象，并把它转换成字符串：

1
2
3
4
<script type="text/javascript">
var boo = new Boolean(true);
document.write(boo.toString());
</script>

脚本输出：true。

先看一例：

1
2
3
4
5
6
7
8
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中实验！

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
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方法……另一个我们暂时可以理解为===操作符不进行隐式转换，因此不调用它们。为了追究真相，我们需要更严谨的实验。

1
2
3
4
5
6
7
8
9
10
11
12
13
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。

1
2
3
4
5
6
7
8
9
10
11
12
13
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那里继承过来的，我们再去掉它看看。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
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

如果只重写了toString，对象转换时会无视valueOf的存在来进行转换。但是，如果只重写了valueOf方法，在要转换为字符串的时候会优先考虑valueOf方法。在不能调用toString的情况下，只能让valueOf上阵了。对于那个奇怪的字符串拼接问题，可能是出于操作符上，翻开ECMA262-5 发现都有一个getValue操作。嗯，那么谜底应该是揭开了。重写会加大它们调用的优化高，而在有操作符的情况下，valueOf的优先级本来就比toString的高。

转载一篇关于toString和valueOf的更多相关文章

  1. javascript之toString()和valueOf()函数

    1.我们为什么要了解这两种方法 众所周知,toString()函数和valueOf函数,这两个函数是Object类的对象生来就拥有的,而且他们还可以允许我们重写,那么,这两个函数到底有什么用呢? 从名 ...

  2. JavaScript系列-----Object之toString()和valueOf()方法 (2)

    深入理解toString()和valueOf()函数 1.我们为什么要了解这两种方法 众所周知,toString()函数和valueOf函数,这两个函数是Object类的对象生来就拥有的,而且他们还可 ...

  3. toString和valueOf使得对象访问时显示一个特定格式的字符串，但是可以进行数字运算

    作用 toString()的作用是返回一个反映这个对象的字符串; valueOf()的作用是返回它相应的原始值; 异同点 共同点:在 JavaScript 中,toString()方法和valueOf ...

  4. 简单说 JavaScript中的tostring( ) 与 valueOf( )方法

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

  5. 探究toString()和valueOf()

    1.用法如下:toString()方法:返回对象的字符串表示. 对象 操作 Array 将 Array 的元素转换为字符串.结果字符串由逗号分隔,且连接起来. Boolean 如果 Boolean 值 ...

  6. js函数--关于toString和valueOf

    js函数--关于toString和valueOf 标签(空格分隔): JavaScript 今天看到一个试题,实现如下语法的功能: var a = add(2)(3)(4); //9 这个就是一个高阶 ...

  7. JavaScript引用类型之Array数组的toString()和valueof()方法的区别

    一.转换方法 1.在JavaScript中几乎所有对象都具有toLocaleString().toString和valueof()方法,因为,所有的对象都继承自Object,而前面所说的方法都是Obj ...

  8. 上一篇括号配对让人联想起catalan数，顺便转载一篇归纳的还不错的文章

    转载请注明来自souldak,微博:@evagle 怎么样才是合法的组合? 只要每一时刻保证左括号的数目>=右括号的数目即可. 直接递归就行,每次递归加一个括号,左括号只要还有就能加,右括号要保 ...

  9. 区分javascript中的toString(),toLocaleString(),valueOf()方法

    首先我们随意创建一个对象,这很简单,打开FF浏览器的Firebug切换到控制台或者打开webkit浏览器的审查元素功能. 输入以下内容: var obj1=[1,2,3,4,5] var obj2=[ ...

随机推荐

  1. linux下ssh远程连接工具SecureCRT和xshell编码设置

    默认的编码有时候显示乱码,需要切换到utf-8 xshell的设置 多个会话窗口执行同样命令 中文界面:

  2. ArrayList源码分析笔记（jdk1.8）

    1.特点: ArrayList 是一个动态数组,它是线程不安全的,允许元素为null 可重复,插入有序 读写快,增删慢 扩容:默认容量 10,默认扩容1.5倍 建议指定容量大小,减少扩容带来的性能消耗 ...

  3. LeetCode（61）：旋转链表

    Medium! 题目描述: 给定一个链表,旋转链表,将链表每个节点向右移动 k 个位置,其中 k 是非负数. 示例 1: 输入: 1->2->3->4->5->NULL, ...

  4. python 全栈开发，Day61(库的操作,表的操作,数据类型,数据类型(2),完整性约束)

    昨日内容回顾 一.回顾 定义:mysql就是一个基于socket编写的C / S架构的软件 包含: ---服务端软件 - socket服务端 - 本地文件操作 - 解析指令(mysql语句) ---客 ...

  5. python 全栈开发，Day47(行级块级标签,高级选择器,属性选择器,伪类选择器,伪元素选择器,css的继承性和层叠性,层叠性权重相同处理,盒模型,padding,border,margin)

    一.HTML中的行级标签和块级标签 块级标签 常见的块级标签:div,p,h1-h6,ul,li,dl,dt,dd 1.独占一行,不和其他元素待在同一行2.能设置宽高3.如果不设置宽高,默认为body ...

  6. Navicat for Oracle 绿色版 连接 Oracle 12c

    亲测可用,留下文章以备忘记. Navicat for Oracle 绿色版 地址 链接:http://pan.baidu.com/s/1qY5wMok 密码:kw06 解压到一个目录下. 然后还需要O ...

  7. Chakra调试笔记 TypedArray

    一.TypedArray类型 TypedArray是漏洞中常见到的结构,手册用法有四 1.new TypedArray(length); //byteLength=length * sizeof(Ty ...

  8. git的入门摸索和入门研究

    git官网:https://git-scm.com/ git教程---菜鸟教程:http://www.runoob.com/git/git-tutorial.html git教程---廖雪峰:http ...

  9. HDU4686 Arc of Dream 矩阵

    欢迎访问~原文出处——博客园-zhouzhendong 去博客园看该题解 题目传送门 - HDU4686 题意概括 a0 = A0 ai = ai-1*AX+AY b0 = B0 bi = bi-1* ...

  10. Centos下基于Hadoop安装Spark（分布式）

    前提 Hadoop可成功在分布式系统下启动 下载scala  链接是https://downloads.lightbend.com/scala/2.12.7/scala-2.12.7.tgz Mast ...