Prototype源码浅析 String部分(四)之补充


Posted in Javascript onJanuary 16, 2012
替换 interpolate  | sub |  scan |  truncate | gsub
interpolate : 将字符串看作一个模板,并使用 object 的属性填充它。
sub : 将字符串中前指定个个与 pattern 指定的模式匹配的子串用 replacement 替换
scan : 遍历字符串中与参数 pattern 指定的模式匹配的所有子串。返回原始字符串本身。
truncate : 将字符串截短为指定的长度(包含后缀部分), 并添加一个后缀。
gsub :将字符串中所有与 pattern 指定的模式匹配的值全部用 replacement 替换掉

上面的方法中,最重要的一个方法是gsub,具体说明参见《浅析Prototype的模板类--Template》
sub除了可以限定次数外,其他与gsub完全一致。

function sub(pattern, replacement, count) { 
replacement = prepareReplacement(replacement); 
count = Object.isUndefined(count) ? 1 : count; 
return this.gsub(pattern, function(match) { 
if (--count < 0) return match[0]; 
return replacement(match); 
}); 
}

scan也是一样的,不过scan最后返回的是字符串本身而已。
interpolate 是将字符串当做模板来用,核心还是gsub
truncate 是唯一有点区别的(我现在依稀感觉我分错类了)。
以字符串'fuck the gfw'为例,truncate 的执行'fuck the gfw'.truncate(10,'****')的步骤是:
1、获得前面10 - '****'.length个字符 'fuck t'
2、拼上后缀'****',得到 'fuck t****',长度为10.
处理很简单,源码也简单:
function truncate(length, truncation) { 
length = length || 30;//默认长度30 
truncation = Object.isUndefined(truncation) ? '...' : truncation;//默认后缀... 
return this.length > length ? 
this.slice(0, length - truncation.length) + truncation : String(this); 
}

另:Prototype的一个方便之处就是随时可以抽取有用的代码作为单独的部分或者收为自己用。下面是单独提出来的模板方法。

function Template(template, pattern){ 
this.template = template; 
this.pattern = pattern || /(^|.|\r|\n)(#\{(.*?)\})/; 
} 
Template.prototype = (function(){ 
function evaluate(obj){ 
return gsub.call(this,function(match){ 
if(obj == null){ 
return match[0] + ''; 
} 
var before = match[1] || ''; 
if(before == '\\'){ 
return match[2]; 
} 
var ctx = obj; 
var expr = match[3]; 
var pattern = /^([^.[]+|\[((?:.*?[^\\])?)\])(\.|\[|$)/; 
match = pattern.exec(expr); 
if (match == null){ 
return before; 
} 
while (match != null) { 
var comp = match[1].search(/^\[/) != -1 ? match[2].replace(/\\\\]/g, ']') : match[1]; 
ctx = ctx[comp]; 
if (null == ctx || '' == match[3]) break; 
expr = expr.substring('[' == match[3] ? match[1].length : match[0].length); 
match = pattern.exec(expr); 
} 
return before + (ctx === null ? '' : String(ctx)); 
}); 
} 
function gsub(replacement){ 
var pattern = this.pattern; 
var result = ''; 
var match = null; 
var source = this.template; 
if (!(pattern.length || pattern.source)) { 
replacement = replacement(''); 
return replacement + source.split('').join(replacement) + replacement; 
} 
while (source.length > 0) { 
if (match = source.match(pattern)) { 
result += source.slice(0, match.index); 
result += replacement(match) === null ? '' : String(replacement(match)); 
source = source.slice(match.index + match[0].length); 
}else { 
result += source; 
source = ''; 
} 
} 
return result; 
} 
return { 
constructor : Template, 
evaluate : evaluate 
} 
})();

var template = new Template('my age is : #{name.age}'); 
console.log(template.evaluate({name : {age : 24}}));//my age is : 24

String部分(完)
Javascript 相关文章推荐
jQuery 处理网页内容的实现代码
Feb 15 Javascript
基于JavaScript 数据类型之Boolean类型分析介绍
Apr 19 Javascript
js 通过html()及text()方法获取并设置p标签的显示值
May 14 Javascript
深入理解javascript原型链和继承
Sep 23 Javascript
javascript学习笔记(三)BOM和DOM详解
Sep 30 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
Dec 20 Javascript
vuejs2.0运用原生js实现简单的拖拽元素功能示例
Feb 24 Javascript
Centos6.8下Node.js安装教程
May 12 Javascript
浅析JavaScript中的平稳退化(graceful degradation)
Jul 24 Javascript
vue父组件通过props如何向子组件传递方法详解
Aug 16 Javascript
JS简单生成由字母数字组合随机字符串示例
May 25 Javascript
laypage+SpringMVC实现后端分页
Jul 27 Javascript
Prototype源码浅析 String部分(二)
Jan 16 #Javascript
深入理解JavaScript系列(11) 执行上下文(Execution Contexts)
Jan 15 #Javascript
深入理解JavaScript系列(10) JavaScript核心(晋级高手必读篇)
Jan 15 #Javascript
深入理解JavaScript系列(9) 根本没有“JSON对象”这回事!
Jan 15 #Javascript
深入理解JavaScript系列(8) S.O.L.I.D五大原则之里氏替换原则LSP
Jan 15 #Javascript
深入理解JavaScript系列(7) S.O.L.I.D五大原则之开闭原则OCP
Jan 15 #Javascript
深入理解JavaScript系列(6):S.O.L.I.D五大原则之单一职责SRP
Jan 15 #Javascript
You might like
mac下使用brew配置环境的步骤分享
2011/05/23 PHP
YII框架实现自定义第三方扩展操作示例
2019/04/26 PHP
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
2013/06/24 Javascript
js网页版计算器的简单实现
2013/07/02 Javascript
jquery实现的3D旋转木马特效代码分享
2015/08/25 Javascript
jquery验证邮箱格式并显示提交按钮
2015/11/07 Javascript
原生js代码实现图片放大境效果
2016/10/30 Javascript
微信小程序 石头剪刀布实例代码
2017/01/04 Javascript
BootStrap中jQuery插件Carousel实现轮播广告效果
2017/03/27 jQuery
通俗解释JavaScript正则表达式快速记忆
2017/08/23 Javascript
jQuery图片加载失败替换默认图片方法汇总
2017/11/29 jQuery
vue页面加载闪烁问题的解决方法
2018/03/28 Javascript
如何以Angular的姿势打开Font-Awesome详解
2018/04/22 Javascript
AngularJS自定义过滤器用法经典实例总结
2018/05/17 Javascript
vue-cli 脚手架基于Nightwatch的端到端测试环境的过程
2018/09/30 Javascript
微信小程序template模版的使用方法
2019/04/13 Javascript
layui 中select下拉change事件失效的解决方法
2019/09/20 Javascript
原生JS与JQ获取元素的区别详解
2020/02/13 Javascript
vue项目打包为APP,静态资源正常显示,但API请求不到数据的操作
2020/09/12 Javascript
Python3实现的腾讯微博自动发帖小工具
2013/11/11 Python
python单例模式实例分析
2015/04/08 Python
Python中的复制操作及copy模块中的浅拷贝与深拷贝方法
2016/07/02 Python
CentOS7.3编译安装Python3.6.2的方法
2018/01/22 Python
用openCV和Python 实现图片对比,并标识出不同点的方式
2019/12/19 Python
Python celery原理及运行流程解析
2020/06/13 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
美国杂志订阅折扣与优惠网站:Magazines.com
2016/08/31 全球购物
介绍下Java的输入输出流
2014/01/22 面试题
大学生职业生涯规划方案
2014/01/03 职场文书
出纳员岗位职责风险
2014/03/06 职场文书
军训口号
2014/06/13 职场文书
学生上课看漫画的检讨书
2014/09/26 职场文书
提档介绍信范文
2015/10/22 职场文书
《我的伯父鲁迅先生》教学反思
2016/02/16 职场文书
导游词之青城山景区
2019/09/27 职场文书
南阳市白酒市场的调查报告
2019/11/08 职场文书