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语言中的Literal Syntax特性分析
Mar 08 Javascript
javascript 面向对象编程 万物皆对象
Sep 17 Javascript
js中判断Object、Array、Function等引用类型对象是否相等
Aug 29 Javascript
jQuery:节点(插入,复制,替换,删除)操作
Mar 04 Javascript
js清空表单数据的两种方式(遍历+reset)
Jul 18 Javascript
jQuery中append()方法用法实例
Jan 08 Javascript
TypeScript 中接口详解
Jun 19 Javascript
基于javascript实现仿百度输入框自动匹配功能
Jan 03 Javascript
JavaScript 中有关数组对象的方法(详解)
Aug 15 Javascript
vue-cli3 karma单元测试的实现
Jan 18 Javascript
小程序实现自定义导航栏适配完美版
Apr 02 Javascript
浅析JavaScript中的事件委托机制跟深浅拷贝
Jan 20 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实现删除空目录的方法
2015/03/16 PHP
php实现网页缓存的工具类分享
2015/07/14 PHP
PHP Ajax实现无刷新附件上传
2016/08/17 PHP
麦鸡的TAB切换功能结合了javascript和css
2007/12/17 Javascript
jquery入门—访问DOM对象方法
2013/01/07 Javascript
JavaScript加入收藏夹功能(兼容IE、firefox、chrome)
2014/05/05 Javascript
14款NodeJS Web框架推荐
2014/07/11 NodeJs
使用JavaScript刷新网页的方法
2015/06/04 Javascript
js实现Select列表内容自动滚动效果代码
2015/08/20 Javascript
浅析在javascript中创建对象的各种模式
2016/05/06 Javascript
JS定义类的六种方式详解
2016/05/12 Javascript
JavaScript学习笔记整理_关于表达式和语句
2016/09/19 Javascript
详解jquery validate实现表单验证 (正则表达式)
2017/01/18 Javascript
react native仿微信PopupWindow效果的实例代码
2017/08/07 Javascript
vue单页面应用打开新窗口显示跳转页面的实例
2018/09/21 Javascript
JavaScript两种计时器的实例讲解
2019/01/31 Javascript
vue组件之间通信方式实例总结【8种方式】
2019/02/22 Javascript
Django模板继承 extend标签实例代码详解
2019/05/16 Javascript
vue项目中mock.js的使用及基本用法
2019/05/22 Javascript
jQuery实现移动端下拉展现新的内容回弹动画
2020/06/24 jQuery
python使用append合并两个数组的方法
2015/04/28 Python
python的else子句使用指南
2016/02/27 Python
python下调用pytesseract识别某网站验证码的实现方法
2016/06/06 Python
Python给你的头像加上圣诞帽
2018/01/04 Python
flask中使用蓝图将路由分开写在不同文件实例解析
2018/01/19 Python
使用pandas对矢量化数据进行替换处理的方法
2018/04/11 Python
flask框架视图函数用法示例
2018/07/19 Python
Python使用Opencv实现图像特征检测与匹配的方法
2019/10/30 Python
pycharm中import呈现灰色原因的解决方法
2020/03/04 Python
Python基于类路径字符串获取静态属性
2020/03/12 Python
科颜氏英国官网:Kiehl’s英国
2019/11/20 全球购物
土木建筑学生自我评价
2014/01/14 职场文书
社区敬老月活动实施方案
2014/02/17 职场文书
归途列车观后感
2015/06/17 职场文书
2016年大学生暑期社会实践活动总结
2016/04/06 职场文书
java固定大小队列的几种实现方式详解
2021/07/15 Java/Android