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 相关文章推荐
根据地区不同显示时间的javascript代码
Aug 13 Javascript
javascript eval和JSON之间的联系
Dec 31 Javascript
jquery $.getJSON()跨域请求
Dec 21 Javascript
js data日期初始化的5种方法
Dec 29 Javascript
jQuery制作可自定义大小的拼图游戏
Mar 30 Javascript
完美实现js选项卡切换效果(二)
Mar 08 Javascript
vue-cli的webpack模板项目配置文件分析
Apr 01 Javascript
浅谈sass在vue注意的地方
Aug 10 Javascript
详解plotly.js 绘图库入门使用教程
Feb 23 Javascript
小程序自定义导航栏兼容适配所有机型(附完整案例)
Apr 26 Javascript
VsCode里的Vue模板的实现
Aug 12 Javascript
vue-router路由懒加载及实现的3种方式
Feb 28 Vue.js
基于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 广告调用类代码(支持Flash调用)
2011/08/11 PHP
深入mysql_fetch_row()与mysql_fetch_array()的区别详解
2013/06/05 PHP
PHP结合jQuery实现找回密码
2015/07/22 PHP
php实现批量上传数据到数据库(.csv格式)的案例
2017/06/18 PHP
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
让JavaScript 轻松支持函数重载 (Part 1 - 设计)
2009/08/04 Javascript
JavaScript 事件记录使用说明
2009/10/20 Javascript
document.getElementById介绍
2011/09/13 Javascript
jQuery内容过滤选择器用法示例
2016/09/09 Javascript
windows 下安装nodejs 环境变量设置
2017/02/02 NodeJs
js 获取图像缩放后的实际宽高,位置等信息
2017/03/07 Javascript
react-router实现按需加载
2017/05/09 Javascript
Web制作验证码功能实例代码
2017/06/19 Javascript
微信小程序实现图片选择并预览功能
2019/07/25 Javascript
Node 代理访问的实现
2019/09/19 Javascript
webpack.DefinePlugin与cross-env区别详解
2020/02/23 Javascript
UEditor 自定义图片视频尺寸校验功能的实现代码
2020/10/20 Javascript
[03:38]2014DOTA2西雅图国际邀请赛 VG战队巡礼
2014/07/07 DOTA
Python中无限元素列表的实现方法
2014/08/18 Python
使用Python的Twisted框架构建非阻塞下载程序的实例教程
2016/05/25 Python
python中星号变量的几种特殊用法
2016/09/07 Python
全面了解python中的类,对象,方法,属性
2016/09/11 Python
python3读取csv和xlsx文件的实例
2018/06/22 Python
python批量检查两个对应的txt文件的行数是否一致的实例代码
2020/10/31 Python
台湾母婴用品限时团购:妈咪爱
2018/08/03 全球购物
JD Sports西班牙:英国领先的运动服装公司
2020/01/06 全球购物
公关关系专员的自我评价分享
2013/11/20 职场文书
党员一句话承诺大全
2014/03/28 职场文书
教师求职信范文
2014/05/24 职场文书
超市促销活动总结
2014/07/01 职场文书
项目合作协议书
2014/09/23 职场文书
2014年质量工作总结
2014/11/22 职场文书
关于公司年会的开幕词
2016/03/04 职场文书
导游词之江南周庄
2019/12/06 职场文书
详解Html5项目适配系统深色模式方案总结
2021/04/14 HTML / CSS
ConditionalOnProperty配置swagger不生效问题及解决
2022/06/14 Java/Android