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 相关文章推荐
JS 参数传递的实际应用代码分析
Sep 13 Javascript
JavaScript 继承机制的实现(待续)
May 18 Javascript
js 数组的for循环到底应该怎么写?
May 31 Javascript
JavaScript栏目列表隐藏/显示简单实现
Apr 03 Javascript
struts2+jquery组合验证注册用户是否存在
Apr 30 Javascript
jQuery实现简洁的导航菜单效果
Nov 23 Javascript
JS获取随机数和时间转换的简单实例
Jul 10 Javascript
vue实现图书管理demo详解
Oct 17 Javascript
原生JavaScript实现的简单放大镜效果示例
Feb 07 Javascript
vue加载自定义的js文件方法
Mar 13 Javascript
vue-router重定向和路由别名的使用讲解
Jan 19 Javascript
Node.js实现批量下载图片简单操作示例
Jan 18 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 危险函数解释 分析
2009/04/22 PHP
PHP5中使用DOM控制XML实现代码
2010/05/07 PHP
完善CodeIgniter在IDE中代码提示功能的方法
2014/07/19 PHP
PHP提示Deprecated: mysql_connect(): The mysql extension is deprecated的解决方法
2014/08/28 PHP
php实现的Cookies操作类实例
2014/09/24 PHP
php简单备份与还原MySql的方法
2016/05/09 PHP
event.keyCode键码值表 附只能输入特定的字符串代码
2009/05/15 Javascript
基于JavaScript实现继承机制之原型链(prototype chaining)的详解
2013/05/07 Javascript
js自动生成对象的属性示例代码
2013/10/28 Javascript
JQuery 使用attr方法实现下拉列表选中
2014/10/13 Javascript
JS动态改变表格边框宽度的方法
2015/03/31 Javascript
JavaScript中的Math.atan2()方法使用详解
2015/06/15 Javascript
javascript同步服务器时间和同步倒计时小技巧
2015/09/24 Javascript
JavaScript事件类型中UI事件详解
2016/01/14 Javascript
js生成随机颜色方法代码分享(三种)
2016/12/29 Javascript
Angular中ng-options下拉数据默认值的设定方法
2017/06/21 Javascript
vue学习教程之带你一步步详细解析vue-cli
2017/12/26 Javascript
nodejs更改项目端口号的方法
2018/05/13 NodeJs
微信小程序自定义tabBar组件开发详解
2020/09/24 Javascript
Python重新引入被覆盖的自带function
2014/07/16 Python
Python中的localtime()方法使用详解
2015/05/22 Python
在Django中创建第一个静态视图
2015/07/15 Python
Python基于property实现类的特性操作示例
2018/06/15 Python
创建Django项目图文实例详解
2019/06/06 Python
Python中的 sort 和 sorted的用法与区别
2019/08/10 Python
opencv转换颜色空间更改图片背景
2019/08/20 Python
python getpass模块用法及实例详解
2019/10/07 Python
使用Python脚本从文件读取数据代码实例
2020/01/19 Python
keras分类之二分类实例(Cat and dog)
2020/07/09 Python
分享一个页面平滑滚动小技巧(推荐)
2019/10/23 HTML / CSS
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
公证书
2019/04/17 职场文书
导游词之贵州织金洞
2019/10/12 职场文书
Nginx禁止ip访问或非法域名访问
2022/04/07 Servers
vue实现省市区联动 element-china-area-data插件
2022/04/22 Vue.js
MySQL中JOIN连接的基本用法实例
2022/06/05 MySQL