toString()一个会自动调用的方法


Posted in Javascript onFebruary 08, 2010

这一特性显然有助于你偷懒,当然也有利于实现一些特定的功能。为了说明这一特性,下面从一个实际开发案例说起。

如果在你的WEB项目中,有很多地方都需要输出像下面这样的一个列表HTML:

<ul> 
<li>JavaScript事件冒泡应用实例</li> 
<li>执行AJAX返回HTML片段中的JavaScript脚本</li> 
</ul>

很显然这是一个LI结构,也许你会想每次要输出这样结构的HTML,难道自己都要去拼这些LI标签吗?我能不能每次调用一个方法仅输入LI中间的文本内容,最终简单地得到一个完整的UL HTML结构呢。当然可以,程序的实现有N种方法,看看下面这种方法,这种方法显然简单而且科学:
function ulBuilder() 
{ 
var lis = ''; 
this.addLi = function(liText) 
{ 
lis += '<li>' + liText + '</li>'; 
}; this.toString = function() 
{ 
return '<ul>' + lis + '</ul>'; 
}; 
} 
var ulHtml = new ulBuilder(); 
ulHtml.addLi('JavaScript事件冒泡应用实例'); 
ulHtml.addLi('执行AJAX返回HTML片段中的JavaScript脚本'); 
alert(ulHtml);

在上面的代码中,我们定义了一个类叫ulBuilder,它有两个公开方法addLi、toString,addLi方法是添加一个包含内容的LI标签,而toString方法是生成最终需要的UL HTML。在这个类的实际使用过程中,你根本没有看到toString方法的调用,但是alert(ulHtml)却显示了完整的UL结构的HTML。

实际上alert()的时候,脚本解析器会自动检查alert变量或对象的toString方法并调用它。在上面的例子中,是我们重写了toString方法,而恰好这个方法会由程序自动调用执行。

话题扩展:
1、在一些面向对象的开发语言中,比如C#、JAVA都有构造函数,这个构造函数显然作为类的一个成员方法,要想执行里面的代码,并不需要我们手动去调用这个方法,这个方法内部定义的代码会在类实例化的时候自动执行。当然,为了让系统能自动执行一些特定的方法,往往程序架构会对这些方法的命名规则有规定,比如构造方法的名称要与类名相同。像上面的例子中,如果把this.toString改成this.toUL,那么要想得到正确的结果只能像这样调用了alert(ulHtml. toUL())。

2、由于toString方法可以被重写,有时候显的特别有用。看看下面的例子,试一下没有重写与重写后输出的结果有什么不同。这个例子显然很不健壮,比如对数组嵌套的情况没有作处理,而且实际意义也不大,只为让你知道可以这样做。

Array.prototype.toString = function() 
{ 
return '[\'' + this.join('\',\'') + '\']'; 
}; 
var companys = ['Adobe','Apple','Google','Intel','Microsoft','Oracle','IBM','SUN']; 
alert(companys);

下面再举一个例子,这个例子比上面例子实用些。正常情况下你alert(JSON)的时候,并不能看到JSON的真正结构,只弹出[object Object],试试下面的实现,也许这是你想要的结果。当然这个方法也是很不完善的,真要使用这样的功能,请到JSON官方站点去下载相关JS库吧:
var userInfo = 
{ 
"name": "Mike", 
"age": 23, 
"phone": "020-87654321", 
"toString": function() 
{ 
var objStr = ''; 
for (var key in this) 
{ 
if (typeof(this[key]) == 'string') 
objStr += '"' + key + '":"' + this[key] + '",'; 
} 
return '{' + objStr.replace(/,$/, '') + '}'; 
} 
} 
alert(userInfo);

作者:WebFlash
Javascript 相关文章推荐
JavaScript创建命名空间(namespace)的最简实现
Dec 11 Javascript
使用POST方式弹出窗口的两种方法示例介绍
Jan 29 Javascript
JS实现的网页背景闪电闪烁效果代码
Oct 17 Javascript
Node.js如何自动审核团队的代码
Jul 20 Javascript
[原创]SyntaxHighlighter自动识别并加载脚本语言
Feb 07 Javascript
详解在vue-cli中引用jQuery、bootstrap以及使用sass、less编写css
Nov 08 jQuery
js原生方法被覆盖,从新赋值原生的方法
Jan 02 Javascript
简单的Vue SSR的示例代码
Jan 12 Javascript
vue.js实现数据库的JSON数据输出渲染到html页面功能示例
Aug 03 Javascript
vue柱状进度条图像的完美实现方案
Aug 26 Javascript
jQuery - AJAX load() 实例用法详解
Aug 27 jQuery
详解Vue2的diff算法
Jan 06 Vue.js
jQuery AJAX回调函数this指向问题
Feb 08 #Javascript
JavaScript Event学习第九章 鼠标事件
Feb 08 #Javascript
JavaScript 类似flash效果的立体图片浏览器
Feb 08 #Javascript
js 省地市级联选择
Feb 07 #Javascript
js 自定义的联动下拉框
Feb 07 #Javascript
比较搞笑的js陷阱题
Feb 07 #Javascript
javascript 鼠标拖动图标技术
Feb 07 #Javascript
You might like
浅谈php serialize()与unserialize()的用法
2013/06/05 PHP
CodeIgniter基于Email类发邮件的方法
2016/03/29 PHP
PHP mysqli事务操作常用方法分析
2017/07/22 PHP
Javascript的IE和Firefox兼容性汇编
2006/07/01 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
2014/10/17 Javascript
javascript框架设计之种子模块
2015/06/23 Javascript
高性能JavaScript DOM编程(1)
2015/08/11 Javascript
详解js中构造流程图的核心技术JsPlumb
2015/12/08 Javascript
JavaScript_ECMA5数组新特性详解
2016/06/12 Javascript
javascript经典特效分享 手风琴、轮播图、图片滑动
2016/09/14 Javascript
用js将long型数据转换成date型或datetime型的实例
2017/07/03 Javascript
two.js之实现动画效果示例
2017/11/06 Javascript
Servlet3.0与纯javascript通过Ajax交互的实例详解
2018/03/18 Javascript
微信小程序云开发(数据库)详解
2019/05/17 Javascript
vue开发拖拽进度条滑动组件
2019/09/21 Javascript
python 测试实现方法
2008/12/24 Python
pip 错误unused-command-line-argument-hard-error-in-future解决办法
2014/06/01 Python
Nginx搭建HTTPS服务器和强制使用HTTPS访问的方法
2015/08/16 Python
Python实现的寻找前5个默尼森数算法示例
2018/03/25 Python
python实现关键词提取的示例讲解
2018/04/28 Python
python 遍历目录(包括子目录)下所有文件的实例
2018/07/11 Python
Python HTML解析器BeautifulSoup用法实例详解【爬虫解析器】
2019/04/05 Python
python解析命令行参数的三种方法详解
2019/11/29 Python
Pytorch中.new()的作用详解
2020/02/18 Python
python 判断一组数据是否符合正态分布
2020/09/23 Python
全球最大的中文旅行网站:去哪儿网
2017/11/16 全球购物
西班牙最好的在线购买葡萄酒的商店:Vinoseleccion
2019/10/30 全球购物
德国前卫设计师时装在线商店:Luxury Loft
2019/11/04 全球购物
班子成员四风问题自我剖析材料
2014/09/29 职场文书
领导班子个人查摆问题对照检查材料
2014/10/02 职场文书
考试没考好检讨书(精选篇)
2014/11/16 职场文书
2015年安康杯竞赛活动总结
2015/03/26 职场文书
上班迟到检讨书
2015/05/06 职场文书
2015年保险公司个人工作总结
2015/05/22 职场文书
学习党章心得体会2016
2016/01/15 职场文书
RPM包方式安装Oracle21c的方法详解
2021/08/23 Oracle