javascript下利用arguments实现string.format函数


Posted in Javascript onAugust 24, 2010

下面摘抄一下源码,深入分析一下他的设计实现思路:

function format(string) { 
var args = arguments; 
var pattern = new RegExp("%([1-" + arguments.length + "])", "g"); 
return String(string).replace(pattern, function(match, index) { 
return args[index]; 
}); 
};

通过format函数,下面的代码:
format("And the %1 want to know whose %2 you %3", "papers", "shirt", "wear");

就会返回:"And the papers want to know whose shirt you wear" 。
果然有点像c#下string.format函数一样传参调用。
总体说来,好像真没什么技术含量。但是真的没有技术含量吗?楼猪大胆根据自己对javascript和arguments的浅薄认识和理解,再来剖析一下这段程序:
1、正则表达式
非常巧妙地new了一个以%开头匹配1到argument个数的一个正则pattern,这个正则是下面第2点字符串替换的重要前提准备;
2、string的Replace函数
replace函数的第二个参数是function,这点非常令人“意外”。通过定义,变量args实际上就是arguments,接着通过args[index]就能取到第index个参数,而且index>=1且index<arguments.length又能保证获取参数的正确。

函数如此短小精悍,和强大的功能形成巨大反差,令人拍案。
可能有许多像楼猪一样被c#惯坏的开发者,会迷恋c#的string.format的写法(大部分还是使用习惯在作怪吧?),好事楼猪稍微改动了一下源码:

function format(string) { 
var args = arguments; 
var pattern = new RegExp("{([0-" + arguments.length + "])}", "g"); 
return String(string).replace(pattern, function(match, index) { 
var currentIndex = parseInt(index); 
if (currentIndex + 1 > args.length || currentIndex < 0) { 
throw new Error("参数索引出错"); 
} 
return args[currentIndex + 1]; 
}); 
}; 
document.write(format("And the {0} want to know whose {1} you {2}", "papers", "shirt", "wear"));//大括号,索引从0开始...

这样看上去就可以像c#的编写风格一样调用format函数了。
最后查看此文的写作时间是在2008年,楼猪在08年的时候觉悟还算蛮高的,正自发努力学习javascript中,但是对arguments认识还很稚嫩,虽然已经知道可以在自定义事件中通过它来定义createFunction函数,用createFunction函数来构造无参数的function给事件使用,但是当时一直抑郁“只知其形,不得其实”。看完Andrew的佳作,豁然开朗,虽然反应迟钝后知后觉,依然感到无比振奋和欣慰。

你看一下Andrew Tetlaw的原文吧。其实下面已经有人指出format函数参数超出9以后,该函数就不起作用了,然后还给出了解决方法:

eric d. Hi, thanks for that brilliant article. Made a lot of things a lot clearer!
Note: new RegExp("%([1-" + arguments.length + "])", "g"); will fail passed 9 arguments (the regexp would be "%([1-10])" so it will only match %0 and %1).

I think an easy fix would be something like:
function format(string) { var args = arguments; var pattern = new RegExp("%([0-9]+)", "g"); return String(string).replace(pattern, function(match, index) { if (index == 0 || index >= args.length) throw "Invalid index in format string"; return args[index]; }); };
(Sorry for nitpicking, I understand it was only an example and brevety is the main objective, but its a great function to have)

Posted on: January 20th 2009, 12:01 am

Javascript 相关文章推荐
网页的标准,IMG不支持onload标签怎么办
Jun 29 Javascript
JavaScript实现将文本框的值插入指定位置的方法
Aug 13 Javascript
将JavaScript的jQuery库中表单转化为JSON对象的方法
Nov 17 Javascript
7个jQuery最佳实践
Jan 12 Javascript
JS实现将数字金额转换为大写人民币汉字的方法
Aug 02 Javascript
javaScript基础详解
Jan 19 Javascript
canvas实现动态小球重叠效果
Feb 06 Javascript
在Vue中使用echarts的方法
Feb 05 Javascript
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
js监听html页面的上下滚动事件方法
Sep 11 Javascript
通过vue手动封装on、emit、off的代码详解
May 29 Javascript
理解Proxy及使用Proxy实现vue数据双向绑定操作
Jul 18 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
Aug 24 #Javascript
js null,undefined,字符串小结
Aug 21 #Javascript
javascript中的float运算精度实例分析
Aug 21 #Javascript
Firebug入门指南(Firefox浏览器)
Aug 21 #Javascript
jquery插件之easing 动态菜单
Aug 21 #Javascript
url地址自动加#号问题说明
Aug 21 #Javascript
jquery中输入验证中一个不错的效果
Aug 21 #Javascript
You might like
香妃
2021/03/03 冲泡冲煮
dede3.1分页文字采集过滤规则详说(图文教程)续二
2007/04/03 PHP
PHP5 面向对象程序设计
2008/02/13 PHP
Youku 视频绝对地址获取的方法详解
2013/06/26 PHP
php中sql注入漏洞示例 sql注入漏洞修复
2014/01/24 PHP
thinkPHP实现多字段模糊匹配查询的方法
2016/12/01 PHP
Yii输入正确验证码却验证失败的解决方法
2017/06/06 PHP
JQuery 拾色器插件发布-jquery.icolor.js
2010/10/20 Javascript
jquery调用wcf并展示出数据的方法
2011/07/07 Javascript
js下将字符串当函数执行的方法
2011/07/13 Javascript
javascript实现图像循环明暗变化的方法
2015/02/25 Javascript
底部悬浮通栏可以关闭广告位的实现方法
2016/06/01 Javascript
BootStrap中Table分页插件使用详解
2016/10/09 Javascript
leaflet的开发入门教程
2016/11/17 Javascript
Angular.Js中ng-include指令的使用与实现
2017/05/07 Javascript
js中split()方法得到的数组长度问题
2018/07/19 Javascript
JavaScript作用域、闭包、对象与原型链概念及用法实例总结
2018/08/20 Javascript
socket io与vue-cli的结合使用的示例代码
2018/11/01 Javascript
解决layer 动态加载select 失效的问题
2019/09/18 Javascript
JavaScript如何判断input数据类型
2020/02/06 Javascript
详解Vue串联过滤器的使用场景
2020/04/30 Javascript
jquery实现异步文件上传ajaxfileupload.js
2020/10/23 jQuery
[36:16]完美世界DOTA2联赛PWL S3 access vs Rebirth 第一场 12.19
2020/12/24 DOTA
Python中的CSV文件使用&quot;with&quot;语句的方式详解
2018/10/16 Python
python中的句柄操作的方法示例
2019/06/20 Python
使用python3批量下载rbsp数据的示例代码
2019/12/20 Python
python3 通过 pybind11 使用Eigen加速代码的步骤详解
2020/12/07 Python
美国药妆网站:EDCskincare.com(防晒、痤疮、抗衰老等)
2017/04/28 全球购物
Spartoo瑞典:鞋子、包包和衣服
2018/09/15 全球购物
澳大利亚巧克力花束和礼品网站:Tastebuds
2019/03/15 全球购物
网络信息管理员岗位职责
2014/01/05 职场文书
竞聘演讲稿开场白
2014/08/25 职场文书
办理房产过户的委托书
2014/09/14 职场文书
毕业生自荐求职信书写的技巧
2019/08/26 职场文书
话题作文之关于呼唤
2019/11/29 职场文书
Java输出Hello World完美过程解析
2021/06/13 Java/Android