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 相关文章推荐
面向对象的Javascript之三(封装和信息隐藏)
Jan 27 Javascript
Js实现无刷新删除内容
Apr 29 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
Aug 26 Javascript
JavaScript操作select元素和option的实例代码
Jan 29 Javascript
分享JS数组求和与求最大值的方法
Aug 11 Javascript
javascript实现的左右无缝滚动效果
Sep 19 Javascript
微信小程序 页面跳转传值实现代码
Jul 27 Javascript
关于element-ui的隐藏组件el-scrollbar的使用
May 29 Javascript
layui表单验证select下拉框实现验证的方法
Sep 05 Javascript
VUEX 数据持久化,刷新后重新获取的例子
Nov 12 Javascript
js实现简单点赞操作
Mar 17 Javascript
JavaScript实现优先级队列
Dec 06 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
php下尝试使用GraphicsMagick的缩略图功能
2011/01/01 PHP
Javascript 中文字符串处理额外注意事项
2009/11/15 Javascript
actionscript与javascript的区别
2011/05/25 Javascript
关于 文本框默认值 的操作js代码
2012/01/12 Javascript
js实现目录定位正文示例
2013/11/14 Javascript
JS 屏蔽键盘不可用与鼠标右键不可用的方法
2013/11/18 Javascript
BAT及各大互联网公司2014前端笔试面试题--JavaScript篇
2014/10/29 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
2015/02/13 Javascript
jquery模拟实现鼠标指针停止运动事件
2016/01/12 Javascript
js实现百度地图定位于地址逆解析,显示自己当前的地理位置
2016/12/08 Javascript
jQuery.cookie.js使用方法及相关参数解释
2017/03/06 Javascript
Vue学习之路之登录注册实例代码
2017/07/06 Javascript
vue.js声明式渲染和条件与循环基础知识
2017/07/31 Javascript
vue滚动轴插件better-scroll使用详解
2017/10/17 Javascript
Nuxt项目支持eslint+pritter+typescript的实现
2019/05/20 Javascript
使用express获取微信小程序二维码小记
2019/05/21 Javascript
Vue项目打包压缩的实现(让页面更快响应)
2020/03/10 Javascript
使用 UniApp 实现小程序的微信登录功能
2020/06/09 Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
2020/09/11 Javascript
js实现鼠标拖曳效果
2020/12/30 Javascript
python和pyqt实现360的CLable控件
2014/02/21 Python
python多线程编程中的join函数使用心得
2014/09/02 Python
Python的collections模块中的OrderedDict有序字典
2016/07/07 Python
python3实现斐波那契数列(4种方法)
2019/07/15 Python
django2.2安装错误最全的解决方案(小结)
2019/09/24 Python
Python pandas自定义函数的使用方法示例
2019/11/20 Python
python中threading开启关闭线程操作
2020/05/02 Python
Anaconda详细安装步骤图文教程
2020/11/12 Python
美国最大的农村生活方式零售店:Tractor Supply Company(TSC)
2017/05/15 全球购物
美国紧身牛仔裤品牌:NYDJ
2017/05/24 全球购物
Kangol帽子官网:坎戈尔袋鼠
2018/09/26 全球购物
Fossil美国官网:化石手表、手袋、首饰及配饰
2019/02/17 全球购物
最美乡村教师观后感
2015/06/11 职场文书
nginx location优先级的深入讲解
2021/03/31 Servers
Linux中sftp常用命令整理
2022/06/28 Servers
Redis sentinel哨兵集群的实现步骤
2022/07/15 Redis