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 相关文章推荐
js 点击按钮弹出另一页,选择值后,返回到当前页
May 26 Javascript
一次失败的jQuery优化尝试小结
Feb 06 Javascript
在IE和VB中支持png图片透明效果的实现方法(vb源码打包)
Apr 01 Javascript
Jquery多选框互相内容交换的实例代码
Jul 04 Javascript
原生javascript实现图片滚动、延时加载功能
Jan 12 Javascript
JS限制文本框只能输入数字和字母方法
Feb 28 Javascript
jquery validate demo 基础
Oct 29 Javascript
基于javascript html5实现3D翻书特效
Mar 14 Javascript
Vue中定义全局变量与常量的各种方式详解
Aug 23 Javascript
关于vue中 $emit的用法详解
Apr 12 Javascript
使用Vue.observable()进行状态管理的实例代码详解
May 26 Javascript
js事件触发操作实例分析
Jun 21 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
PHP将URL转换成短网址的算法分享
2016/09/13 PHP
PHP搭建大文件切割分块上传功能示例
2017/01/04 PHP
PHP插件PHPMailer发送邮件功能
2017/02/28 PHP
一段好玩的JavaScript代码
2006/12/01 Javascript
用js遍历 table的脚本
2008/07/23 Javascript
jQuery+CSS 实现的超Sexy下拉菜单
2010/01/17 Javascript
JS性能优化笔记搜索整理
2013/08/21 Javascript
js中使用replace方法完成某个字符的转换
2014/08/20 Javascript
jQuery实现鼠标悬停显示提示信息窗口的方法
2015/04/30 Javascript
两种JS实现屏蔽鼠标右键的方法
2020/08/20 Javascript
JavaScript中获取Radio被选中的值
2015/11/11 Javascript
jQuery动画显示和隐藏效果实例演示(附demo源码下载)
2015/12/31 Javascript
js仿百度登录页实现拖动窗口效果
2016/03/11 Javascript
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
2016/05/17 Javascript
谈谈JavaScript中浏览器兼容问题的写法小议
2016/12/17 Javascript
JS对象深度克隆实例分析
2017/03/16 Javascript
微信分享调用jssdk实例
2017/06/08 Javascript
vue多页面项目中路由使用history模式的方法
2019/09/23 Javascript
JavaScript实现公告栏上下滚动效果
2020/03/13 Javascript
Python实现发送QQ邮件的封装
2017/07/14 Python
Python分治法定义与应用实例详解
2017/07/28 Python
Python socket套接字实现C/S模式远程命令执行功能案例
2018/07/06 Python
基于Django静态资源部署404的解决方法
2019/07/28 Python
浅谈Python类中的self到底是干啥的
2019/11/11 Python
Tensorflow 自定义loss的情况下初始化部分变量方式
2020/01/06 Python
python实现快递价格查询系统
2020/03/03 Python
python GUI模拟实现计算器
2020/06/22 Python
python如何设置静态变量
2020/09/07 Python
欧迪办公美国官网:Office Depot
2016/08/22 全球购物
海蓝之谜(LA MER)澳大利亚官方商城:全球高端奢华护肤品牌
2017/10/27 全球购物
SNIDEL官网:日本VIVI杂志人气少女第一品牌
2020/03/12 全球购物
零件设计自荐信范文
2013/11/27 职场文书
酒店副总经理岗位职责范本
2014/02/04 职场文书
高中毕业典礼演讲稿
2014/09/09 职场文书
民事二审代理词
2015/05/25 职场文书
检讨书格式
2019/04/25 职场文书