Ruby's Louvre

每天学习一点点算法

导航

< 2025年3月 >
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

javascript 在字符串嵌入表达式

在C语言中,有一个叫printf的方法,我们可以在后面添加不同的类型的参数嵌入到将要输出的字符串,这是非常有用的方法,因为在javascript有大量这样的字符串拼接操作。如果涉及逻辑,我们可以用模板,如果轻量点,我们发现在主流框架,都提供了一个叫substitute的方法(在Prototype为interpolate, Base2为format)。嘛,由于我比较喜欢ruby,因此使用ruby式的标记法——#{}。#{}里面可以为一个单词,这时第二参数为一个对象,键名即为此单词。如果#{}为一个数字,这时使用Python format的用法,这时就存在多个参数,依次对应其里面的数字(记得qwrap里面的StringH.format也这样用。)

源码:

//2011.3.6 by 司徒正美
     + function(){
        var reg_format =  /\\?\#{([^{}]+)\}/gm, A_slice = Array.prototype.slice;
        this.dom = this.dom || {};
        dom.format = function(str, object){
          var array = A_slice.call(arguments,1);
          return str.replace(reg_format, function(match, name){
            if (match.charAt(0) == '\\')
              return match.slice(1);
            var index = Number(name)
            if(index >=0 )
              return array[index]
            if(object && (object[name]!==void 0))
              return  object[name]
            return  '' ;
          });
        }
      }()

     dom.require("lang",function(){
         var a = dom.format("style.#{name}=((isEnd ? #{end} : adapter.#{type}( #{from}, #{change},'#{easing}',per ))|0)+'#{unit}';",{
           name:"width",
           end:"400",
           type:"_default",
           from:"200",
           change:"200",
           easing:"linear",
           unit:"px"
         })   ;
         dom.log(a)
       });
//style.width=((isEnd ? 400 : adapter._default( 200, 200,'linear',per ))|0)+'px';

另一种拼接字符串的方法:

/**
      * 用于拼接多行HTML片断,免去写<与>与结束标签之苦
      * @param {String} tag 可带属性的开始标签
      * @param {String} innerHTML 可选
      * @param {Boolean} xml 可选 默认false,使用HTML模式,需要处理空标签
      * @example var html = T("P title=aaa",T("span","111111")("strong","22222"))("div",T("div",T("span","两层")))("H1",T("span","33333"))('',"这是纯文本");
      * console.log(html+"");
      * @return {Function}
      */
     rnoclose = /^(area|base|basefont|bgsound|br|col|frame|hr|img|input|isindex|link|meta|param|embed|wbr)$/i,
     tag: function (start, content, xml){
         xml = !!xml
         var chain = function(start, content, xml){
             var html = arguments.callee.html;
             start && html.push("<",start,">");
             content = ""+(content||"");
             content && html.push(content);
             var end = start.split(" ")[0];//取得结束标签
             if(end && (xml || !rnoclose.test(end))){
                 html.push("</",end,">");
             }
             return chain;
         }
         chain.html = [];
         chain.toString = function(){
             return this.html.join("");
         }
         return chain(start,content,xml);
     },    

如果您觉得此文有帮助,可以打赏点钱给我支付宝1669866773@qq.com ,或扫描二维码

posted on   司徒正美  阅读(3957)  评论(4编辑  收藏  举报

编辑推荐:
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
历史上的今天:
2010-03-06 纯CSS实现表头固定
点击右上角即可分享
微信分享提示