美文网首页
5行代码的简易模板解析函数

5行代码的简易模板解析函数

作者: TOPro | 来源:发表于2018-02-23 17:11 被阅读7次

不喜欢拼字符串,es6也没法使用,很捉急
没办法只能出大招,自己动手丰衣足食

function simpleTpl(tpl,opts){
    return tpl.replace(/(\{.+?\})/g,function(all,cap1){
        return opts[cap1.replace(/\}|\{/g,"")] || "";
    })
}

举个栗子

var file="css/index.less";
var command = simpleTpl(
    "lessc {file} {fileNotExt}.css --js -x --source-map={fileNotExt}.css.map",
    {
        file:file,
        fileNotExt:file.split(/\.[^.]+?$/)[0]
    }
)
console.log(command)
//lessc css/file.less css/index.css  --js -x --source-map=css/file.css.map

与没有使用模板函数的情况相比,可读性还是有一定区别的


var file="css/index.less";
var fileNotExt = file.split(/\.[^.]+?$/)[0];
var command = "lessc "+file+" "+fileNotExt+".css" + 
" --js -x --source-map="+fileNotExt + ".css.map";
console.log(command)
//lessc css/file.less css/index.css  --js -x --source-map=css/file.css.map

相关文章

  • 5行代码的简易模板解析函数

    不喜欢拼字符串,es6也没法使用,很捉急没办法只能出大招,自己动手丰衣足食 举个栗子 与没有使用模板函数的情况相比...

  • GoWeb基础——Text/HTML模板

    模板函数 创建一个名字为name的模板 解析模板字符串 解析文件 执行模板,将结果写入wr 注册函数给模板,注册之...

  • 模板解析

    模板解析函数 测试 测试结果

  • Vue的整个实现流程

    第一步,解析模板成render函数 with的用法 模板中所有信息都被render函数包含 模板中用到的data中...

  • EditPlus工具的使用及相关配置

    修改EditPlus模板函数 editplus默认的java模板函数的代码格式与我们平常使用的Java代码格式有一...

  • 06Vue 源码解析3

    Vue 源码解析3 模板编译 模板编译的主要目标是将模板(template)转为渲染函数(render) 模板编译...

  • SpringBoot整合Thymeleaf所遇到的那些坑

    模板标签解析错误 如上代码默认情况下 thymeleaf 对于模板的解析是严格模式的,某些元素没有使用 "/" 结...

  • 模板(template):快捷函数

    快捷函数  为了减少加载模板、渲染模板的重复代码,django 提供了快捷函数  render_to_st...

  • 静态链接(五)

    C++相关 重复代码消除 可能产生重复代码的位置:模板外部内联函数虚函数表 对应的方法: 全部保留 每个模板的实例...

  • 函数模板与类模板

    函数模板 函数模板的概念 为了提高效率,实现代码复用,C++提供了一种处理机制,即使用函数模板。定义函数模板的格式...

网友评论

      本文标题:5行代码的简易模板解析函数

      本文链接:https://www.haomeiwen.com/subject/uwbxxftx.html