在JS中简单实现Formatter函数
2024-08-24 11:14:32
JS原生并没有提供方便使用的Formatter函数,用字符拼接的方式看起来混乱难读,而且使用起来很不方便。个人感觉C#里提供的语法比较好用,如:
String.Format(“Welcome to learn '{0}','{0}' is awesome,you will {1} it!","Javascript","love");
这种有顺序的替换方式,比较清晰,而且在要替换同一内容时候可以省去传递重复参数的情况,下面是JS简单实现版本(没有严格测试):
(function(exports) {
exports.format = function(){
var args = Array.prototype.slice.call(arguments),
sourceStr = args.shift();
function execReplace(text,replacement,index){
return text.replace(new RegExp("\\{"+index+"\\}",'g'),replacement);
}
return args.reduce(execReplace,sourceStr);
}
})(window.utils = window.utils || {});
console.log(utils.format("Welcome to learn '{0}','{0}' is awesome,you will {1} it!","Javascript","love"));
关键的是这句:
args.reduce(execReplace,sourceStr);
这里使用了Array的reduce函数,reduce和reduceRight是ES5新增加的函数,该函数的参数是reduce(callback,initialValue),callback接收4个参数分别是:
- previousValue:
- 在遍历第一次进入该回调函数时,如果指定了initivalValue将直接使用initivalValue,如果没有指定将使用数组的第一个元素
- 第二次及以后的遍历该值是前一次遍历返回的结果
- 最后一次遍历返回的结果将作为reduce函数的返回值
- currentValue: 遍历到的当前item
- index: 当前item在数组中的下标
- array: 原始array
在execReplace中每一次执行时使用前一次替换后的结果作为原始替换字符串,使用当前item的index作为要被替换的内容,依次遍历,最终完成替换内容。
注:reduceRight和reduce函数基本一样,只是它的遍历顺序是由右向左
关于兼容性:
(评论中有提到应该注明兼容性问题,这里非常感谢 @段启锋 同学的建议)
其他浏览器不必说,从IE9开始支持reduce,forEach,map,filter等ES5新函数的
最新文章
- 关于php-fpm子进程达到上限并且浏览器访问显示504错误
- ios textfield / textview长按复制粘贴中文显示
- Tor
- Scala官方作弊条
- debian msyql 5.1 卸载与安装
- linux下各种文件格式的压缩以及解压缩命令
- NaN(Not a Number)问题
- vue-resource promise兼容性问题
- Liunx的常用命令
- Javascript闭包入门(译文)
- mac电脑复制键失灵
- 《开始使用Linux》单元测验 1
- C++进阶--RAII 资源获取即初始化
- 判断Service是否已经启动
- Eclispe让SVN插件显示英文
- windows server2012部署Cognos问题小结
- Jquery获取下拉选择节点名称值赋给textbox文本框 获取 父节点的栏目名称编号
- java- Servlet-session
- BZOJ3261:最大异或和——题解
- 汕头市队赛SRM 20 T1魔法弹
热门文章
- Tensorflow笔记——神经网络图像识别(四)搭建模块化的神经网络八股(正则化,指数衰减学习率,滑动平均等优化)
- 自动手动随便你 Win7驱动程序安装自己设
- 第八章 Mixer 适配器的应用
- PMP Fundamentals
- Android开发入门——ImageView的设置
- leetcode14
- Eclipse 安装Hibernate Tools 工具 提高开发效率
- 为什么nginx error_page遇到后端错误时不跳转?
- Linux学习---linux系统下安装配置Jenkins
- 286被围绕的区域 · Surrounded Regions