Web常用工具 二维码美化 在线压缩 JavaScript AI工具汇总网站 ASP.NET控件源码查询 W3CHTML W3SCHOOL TypeScript 开源中国 51aspx github codeproject SQLBACKUP 几种排序算法比较 SQL中deny权限 MSDN下载 HttpWebRequest类 HTML5 stackoverflow ASP.NET 页生命周期概述 IIS 5.0 和 6.0 的 ASP.NET 应用程序生命周期概述 [SQL Server]视图sys.sysprocesses brnshop学习 SQL视频 Fiddler帮助文档 Sprint.Net SQLServer牛人博客 codeplex IIS官网 IE11 Developer Jquery源码视频上 Jquery源码视频下 Jquery Bugs jquery.miaov.com 正则表达式 Jquery API 1.9 Service Broker Javascript Object中的方法讲解 Microsoft webcast 微信开发接口 ECMAScript5 Underscore Jquery Bugs SQL存储过程事务嵌套 官网SQL事务锁 2345天气插件 Json数据查看 C++ jquery-plugin-validate 博学谷(传智播客) Swift视频 IOS代码论坛 SWIFT设计模式 操作系统下载 AngularJS VueJS ASPNETCORE 前端题库 Node.js ASPNETCORE 腾讯课堂 SwiftUI SwiftUI疑问解答 ADO.NET SMO 数字化企业网 Unicode码查询 Redis使用文档 .NET 微服务:适用于容器化 .NET 应用程序的体系结构 .NETCore5.0微软官方文档 CSS3.0 在 ASP.NET Core 中配置 Windows 身份验证 Maven使用教程 Maven Repository Thymeleaf Thymeleaf中文CSDN Spring官方文档 Spring中文文档 SpringBoot SpringData SVG在线设计工具 SVG教程01 SVG教程02 fontawesome图标库 mybatis官网 mybatis-spring中文 mysql教程 python教程 python的scrapy教程01 python的scrapy教程02 VS开发python xpath教程 腾讯向量数据库教程 JSZip浏览器内存中创建文件与文件夹 axios的使用文档 SheetJS(JS操作excel)的使用文档

huaan011

 

Javascript中valueOf与toString区别

疑问:

  在JS的数据类型中有两个方法 Object.prototype.valueOf 和 Object.prototype.toString,在实例到这两个的区别是什么?

 我们进行如下的实例步骤:

案例1.

    var test={
                        age:20,
                        toString:function(){return this.age-10;},   //重写 toString()
                        valueOf:function(){return this.age+40;}    //重写 valueOf()
                  }    

运行如下代码:

            alert(test>20);//true 调用的是 valueOf
            alert(+test); //60 调用的是 valueOf
            alert(test); //10  调用的是 toString

结论:出现这种结果是由于test在自动的调用 valueOf 或者 toString 方法.

此时产生了新的疑问:什么情况下调用 valueOf,什么情况下调用  toString 呢?

继续看下面的案例:

案例2.

 var test={
                        age:20,
                        toString:function(){console.log('toString');return this.age-10;},   //重写 toString()
                        valueOf:function(){console.log('valueOf');return this.age+40;}    //重写 valueOf()
                  }    

运行如下代码:

       alert(test);// 10 toString
            alert(+test); // 60 valueOf
            alert('' + test); // 60 valueOf
            alert(String(test)); // 10 toString
            alert(Number(test)); // 60 valueOf
            alert(test == '10'); // false valueOf
            alert(test === '10'); // false

结论:转换成字符串时调用的是 toString,转换成数字时调用的是 valueOf,但是有两个例外:一个alert('' + test),已改调用 toString ,反而却调用的是  valueOf, 另外一个 alert(test === '10'),===操作符不进行隐式转换,因此不调用它们。

 为了弄清楚两个例外,我们继续案例:

案例3:

var test = {
                age: 20,
                toString: function () { console.log('toString'); return this.age - 10; }   //重写 toString()
            }

运行如下代码:

        alert(test);// 10 toString
            alert(+test); // 10 toString
            alert('' + test); // 10 toString
            alert(String(test)); // 10 toString
            alert(Number(test)); // 10 toString
            alert(test == '10'); // true toString
            alert(test === '10'); // false

 结论:只重写 toString 的时候,调用的是 toString.

案例4:

var test = {
                age: 20,
                valueOf: function () { console.log('valueOf'); return this.age + 40; }    //重写 valueOf()
            }

运行如下代码:

       alert(test);// [object object]  --继承的是 Object.prototype.toString
            alert(+test); // 60 valueOf
            alert('' + test); // 60 valueOf
            alert(String(test)); // [object object] --Object.prototype.toString
            alert(Number(test)); // 60 valueOf
            alert(test == '10'); // false valueOf
            alert(test === '10'); // false

 结论:对于那个[object Object],我估计是从Object那里继承过来的,我们再去掉它看看。

案例5:

 Object.prototype.toString = null;
            var test = {
                age: 20,
                valueOf: function () { console.log('valueOf'); return this.age + 40; }    //重写 valueOf()
            }
            alert(test);// 60 valueOf
            alert(+test); // 60 valueOf
            alert('' + test); // 60 valueOf
            alert(String(test)); // 60 valueOf
            alert(Number(test)); // 60 valueOf
            alert(test == '10'); // false valueOf
            alert(test === '10'); // false

案例6:

 var test = {
                age: 20
            }
            alert(test);// [object object]
            alert(+test); // NaN
            alert('' + test); // [object object]
            alert(String(test)); // [object object]
            alert(Number(test)); // NaN
            alert(test == '10'); // false 
            alert(test === '10'); // false

案例7:

Object.prototype.toString = null;
            var test = {
                age: 20
            }
            alert(test);//  Uncaught TypeError: Cannot convert object to primitive value
            alert(+test); // Uncaught TypeError: Cannot convert object to primitive value
            alert('' + test); // Uncaught TypeError: Cannot convert object to primitive value
            alert(String(test)); // Uncaught TypeError: Cannot convert object to primitive value
            alert(Number(test)); // Uncaught TypeError: Cannot convert object to primitive value
            alert(test == '10'); // Uncaught TypeError: Cannot convert object to primitive value 
            alert(test === '10'); //false Uncaught TypeError: Cannot convert object to primitive value

 

从上面所有的案例中总结:

1.valueOf应用于运算,toString应用于显示.

2.在进行对象转换成字符串时(例如:alert(test)),将优先调用 toString,如果没有 toString 方法了,就调用 valueOf方法,如果tostring 和 valueOf都没重写,就按照 Object的toString 方法输出.

3.在进行强转字符串类型时将优先调用toString方法,强转为数字时优先调用valueOf。

4.在有运算操作符的情况下,valueOf的优先级高于toString。

    

posted on 2017-03-28 14:59  华安  阅读(1650)  评论(0编辑  收藏  举报

导航