可以这样说，所有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. Go语言规格说明书 之 select语句（Select statements）

    go version go1.11 windows/amd64 本文为阅读Go语言中文官网的规则说明书(https://golang.google.cn/ref/spec)而做的笔记,介绍Go语言的 ...

  2. windows下升级node&npm

    一.升级npm npm install -g npm 二.升级node 1.查询node的安装目录 where node 2.在官网下载最新的安装包,直接覆盖安装即可. https://nodejs. ...

  3. java 语言的主要特点

    java 语言主要特点如下: 1:简单 2:面向对象 3:分布性 4:可移植性 5:安全性 6:健壮性 二:java 主要术语 三:java 核心是面向对象程序设计OOP 四:封装 五:多态 六:继承 ...

  4. java 延时的几种方法方法

    Java 延时常见的几种方法   1. 用Thread就不会iu无法终止 new Thread(new Runnable() { public void run() { while (true) { ...

  5. strchr()的用法

    strchr()主要有2个最有用的用法: 第一个:搜索字符串在另一字符串中的第一次出现.并返回剩余的部分 $str = "hello_chrdai_1993"; $not_incl ...

  6. hdu1561 树形dp，依赖背包

    多重背包是某个物品可以选择多次,要把对物品数的枚举放在对w枚举外面 分组背包是某组的物品只能选一个,要把对每组物品的枚举放在对w枚举内侧 依赖背包是多层的分组背包,利用树形结构建立依赖关系,每个结点都 ...

  7. 性能测试五：jmeter进阶之后置处理器（正则、json提取器）

    如,从get返回的json中提取stock的值 作为post的请求参数 1.JSON提取器 专门对json数据进行提取的后置处理器 Debug Sampler:记录之前的请求的所有参数及数据 2.正则 ...

  8. 去掉m3u8的片头和片尾

    # pip3 install -i https://mirrors.aliyun.com/pypi/simple/ m3u8 # pip3 install -i https://mirrors.ali ...

  9. hdu 1240 3维迷宫 求起点到终点的步数 (BFS)

    题意,给出一个N,这是这个三空间的大小,然后给出所有面的状况O为空地,X为墙,再给出起始点的三维坐标和终点的坐标,输出到达的步数 比较坑 z是x,x是y,y是z,Sample InputSTART 1 ...

  10. Flink（二）CentOS7.5搭建Flink1.6.1分布式集群

    一. Flink的下载 安装包下载地址:http://flink.apache.org/downloads.html  ,选择对应Hadoop的Flink版本下载 [admin@node21 soft ...