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同步Import,同步调用外部js的方法
Jul 08 Javascript
Javascript实现的鼠标经过时播放声音
May 18 Javascript
jquery的$(document).ready()和onload的加载顺序
May 26 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
Apr 20 Javascript
jquery使用ajax实现微信自动回复插件
Apr 28 Javascript
js实现接收表单的值并将值拼在表单action后面的方法
Nov 23 Javascript
jQuery实现搜索页面关键字的功能
Feb 16 Javascript
详解angular 中的自定义指令之详解API
Jun 20 Javascript
浅谈webpack 自动刷新与解析
Apr 09 Javascript
微信小程序带动画弹窗组件使用方法详解
Nov 27 Javascript
Vue之beforeEach非登录不能访问的实现(代码亲测)
Jul 18 Javascript
基于VUE的v-charts的曲线显示功能
Oct 01 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
memcache一致性hash的php实现方法
2015/03/05 PHP
PHP+Mysql+jQuery文件下载次数统计实例讲解
2015/10/10 PHP
php反射类ReflectionClass用法分析
2016/05/12 PHP
laravel自定义分页效果
2017/07/23 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
javascript 面向对象全新理练之数据的封装
2009/12/03 Javascript
JQuery模板插件 jquery.tmpl 动态ajax扩展
2011/11/10 Javascript
页面使用密码保护代码
2013/04/10 Javascript
Js nodeType 属性全面解析
2013/11/14 Javascript
js怎么覆盖原有方法实现重写
2014/09/04 Javascript
原生的html元素选择器类似jquery选择器
2014/10/15 Javascript
jquery实现可拖拽弹出层特效
2015/01/04 Javascript
MVVM模式中ViewModel和View、Model有什么区别?
2015/06/19 Javascript
用最简单的方法判断JavaScript中this的指向(推荐)
2017/09/04 Javascript
parabola.js抛物线与加入购物车效果的示例代码
2017/10/25 Javascript
JS实现的哈夫曼编码示例【原始版与修改版】
2018/04/22 Javascript
深入理解JavaScript的值传递和引用传递
2018/10/24 Javascript
laydate如何根据开始时间或者结束时间限制范围
2018/11/15 Javascript
[03:49]DOTA2英雄基础教程 光之守卫
2014/01/14 DOTA
[01:03]DOTA2新的征程 你的脚印值得踏上
2014/08/13 DOTA
[01:36:17]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第一场 1月31日
2021/03/11 DOTA
python全栈要学什么 python全栈学习路线
2019/06/28 Python
python实现LRU热点缓存及原理
2019/10/29 Python
python GUI库图形界面开发之PyQt5信号与槽多窗口数据传递详细使用方法与实例
2020/03/08 Python
调整Jupyter notebook的启动目录操作
2020/04/10 Python
html5指南-6.如何创建离线web应用程序实现离线访问
2013/01/07 HTML / CSS
ORLY官网:美国专业美甲一线品牌
2019/12/11 全球购物
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
数控技术应届生求职信
2013/11/13 职场文书
2014年开学第一课活动方案
2014/03/06 职场文书
驻村工作先进事迹
2014/08/14 职场文书
八一建军节演讲稿
2014/09/10 职场文书
领导班子“四风问题”“整改方案
2014/10/02 职场文书
《打电话》教学反思
2016/02/22 职场文书
意外事故赔偿协议书
2016/03/22 职场文书
Win11 22H2 2022怎么更新? 获得Win1122H22022版本升级技巧
2022/09/23 数码科技