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 相关文章推荐
jsvascript图像处理—(计算机视觉应用)图像金字塔
Jan 15 Javascript
javascript:void(0)使用探讨
Aug 27 Javascript
jquery单行文字向上滚动效果的实现代码
Sep 05 Javascript
js onmousewheel事件多次触发问题解决方法
Oct 17 Javascript
精通JavaScript的this关键字
May 28 Javascript
fullpage.js全屏滚动插件使用实例
Sep 06 Javascript
Js动态设置rem来实现移动端字体的自适应代码
Oct 14 Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
Nov 09 Javascript
javascript删除html标签函数cIsHTML
Jan 09 Javascript
JavaScript调试的多个必备小Tips
Jan 15 Javascript
Vue实现仿iPhone悬浮球的示例代码
Mar 13 Javascript
js实现详情页放大镜效果
Oct 28 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数组排序之sort、asort与ksort用法实例
2014/09/08 PHP
PHP实现数组向任意位置插入,删除,替换数据操作示例
2019/04/05 PHP
详解laravel passport OAuth2.0的4种模式
2019/11/04 PHP
javascript attachEvent绑定多个事件执行顺序问题
2010/10/20 Javascript
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
2010/12/08 Javascript
jQuery 源码分析笔记(5) jQuery.support
2011/06/19 Javascript
Javascript 面向对象(三)接口代码
2012/05/23 Javascript
Javascript writable特性介绍
2015/02/27 Javascript
jquery+html5烂漫爱心表白动画代码分享
2015/08/24 Javascript
解析Node.js异常处理中domain模块的使用方法
2016/02/16 Javascript
浅谈JavaScript 函数参数传递到底是值传递还是引用传递
2016/08/23 Javascript
javascript实现图片左右滚动效果【可自动滚动,有左右按钮】
2016/09/19 Javascript
IONIC自定义subheader的最佳解决方案
2016/09/22 Javascript
vue组件发布到npm简单步骤
2017/11/30 Javascript
spirngmvc js传递复杂json参数到controller的实例
2018/03/29 Javascript
详解vue-router传参的两种方式
2018/09/10 Javascript
微信小程序冒泡事件及其阻止方法实例分析
2018/12/06 Javascript
Vue实现商品分类菜单数量提示功能
2019/07/26 Javascript
nuxt+axios实现打包后动态修改请求地址的方法
2020/04/22 Javascript
vue使用map代替Aarry数组循环遍历的方法
2020/04/30 Javascript
Python开发的单词频率统计工具wordsworth使用方法
2014/06/25 Python
python获取微信企业号打卡数据并生成windows计划任务
2019/04/30 Python
python3 property装饰器实现原理与用法示例
2019/05/15 Python
Python 实现文件读写、坐标寻址、查找替换功能
2019/09/11 Python
pytorch 图像中的数据预处理和批标准化实例
2020/01/15 Python
python读取图片的几种方式及图像宽和高的存储顺序
2020/02/11 Python
python 基于wx实现音乐播放
2020/11/24 Python
Luxplus瑞典:香水和美容护理折扣
2018/01/28 全球购物
外科实习自我鉴定
2013/10/06 职场文书
应届生新闻编辑求职信
2013/11/19 职场文书
暑期社会实践先进个人主要事迹
2014/05/22 职场文书
创新社会管理心得体会
2014/09/12 职场文书
党员学习中共十八大报告思想汇报
2014/09/15 职场文书
孔庙导游词
2015/02/04 职场文书
彻底解决MySQL使用中文乱码的方法
2022/01/22 MySQL
TypeScript 使用 Tuple Union 声明函数重载
2022/04/07 Javascript