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 相关文章推荐
让低版本浏览器支持input的placeholder属性(js方法)
Apr 03 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
Oct 17 Javascript
AngularJS语法详解(续)
Jan 23 Javascript
JavaScript检测上传文件大小的方法
Jul 22 Javascript
jquery制做精致的倒计时特效
Jun 13 Javascript
全面了解函数声明与函数表达式、变量提升
Aug 09 Javascript
JS实现将链接生成二维码并转为图片的方法
Mar 17 Javascript
jQuery操作cookie的示例代码
Jun 05 jQuery
webpack4.0+vue2.0利用批处理生成前端单页或多页应用的方法
Jun 28 Javascript
element-ui中Table表格省市区合并单元格的方法实现
Aug 07 Javascript
node.js实现简单的压缩/解压缩功能示例
Nov 05 Javascript
nuxt引入组件和公共样式的操作
Nov 05 Javascript
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基础知识:类与对象(2) 自动加载对象
2006/12/13 PHP
PHP 程序员应该使用的10个组件
2009/10/31 PHP
关于PHP中Object对象的笔记分享
2011/06/28 PHP
PHP获取和操作配置文件php.ini的几个函数介绍
2013/06/24 PHP
thinkPHP利用ajax异步上传图片并显示、删除的示例
2018/09/26 PHP
详细对比php中类继承和接口继承
2018/10/11 PHP
Centos7 Yum安装PHP7.2流程教程详解
2019/07/02 PHP
JavaScript DOM 学习第二章 编辑文本
2010/02/19 Javascript
jQuery不使用插件及swf实现无刷新文件上传
2014/12/08 Javascript
JS 通过系统时间限定动态添加 select option的实例代码
2016/06/09 Javascript
javascript类型系统——undefined和null全面了解
2016/07/13 Javascript
全面解析标签页的切换方式
2016/08/21 Javascript
Angular.JS中指令ng-if、ng-show/ng-hide和ng-switch的使用教程
2017/05/07 Javascript
backbone简介_动力节点Java学院整理
2017/07/14 Javascript
JavaScript实现移动端页面按手机屏幕分辨率自动缩放的最强代码
2017/08/18 Javascript
小程序兼容安卓和IOS数据处理问题及坑
2018/09/18 Javascript
详解vue-cli+es6引入es5写的js(两种方法)
2019/04/19 Javascript
在vue中使用echars实现上浮与下钻效果
2019/11/08 Javascript
webpack 最佳配置指北(推荐)
2020/01/07 Javascript
python控制台显示时钟的示例
2014/02/24 Python
python基础教程之面向对象的一些概念
2014/08/29 Python
详解Swift中属性的声明与作用
2016/06/30 Python
python3读取MySQL-Front的MYSQL密码
2017/05/03 Python
PyQt5每天必学之带有标签的复选框
2018/04/19 Python
pandas使用get_dummies进行one-hot编码的方法
2018/07/10 Python
python如何输出反斜杠
2020/06/18 Python
python3获取控制台输入的数据的具体实例
2020/08/16 Python
大唐电信科技股份有限公司java工程师面试经历
2016/12/09 面试题
小学校园活动策划
2014/01/30 职场文书
2014五一国际劳动节活动总结范文
2014/04/14 职场文书
机械电子工程专业自荐书
2014/06/10 职场文书
股东出资证明书范例
2014/10/04 职场文书
党员作风建设自查报告
2014/10/23 职场文书
项目合作意向书
2015/05/08 职场文书
2016党校学习心得体会
2016/01/07 职场文书
Django基础CBV装饰器和中间件
2022/03/22 Python