V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
n37r06u3
V2EX  ›  JavaScript

js 如何优雅的拼接 字符串

  •  
  •   n37r06u3 · 2014-07-30 16:12:17 +08:00 · 11042 次点击
    这是一个创建于 3799 天前的主题,其中的信息可能已经有所发展或是发生改变。
    最近写个前端界面

    要用js来动态添加input

    发现写长了就乱了 改起来也麻烦

    大家一般用什么方法?
    23 条回复    2014-07-31 11:13:27 +08:00
    TangMonk
        1
    TangMonk  
       2014-07-30 16:13:16 +08:00
    不是有个handlebars模板引擎吗
    Tonni
        2
    Tonni  
       2014-07-30 16:15:42 +08:00   ❤️ 8
    现在看到如何优雅的XXX就觉得恶心,这是病么?
    PS:如果字符串过长,直接把模板写到HTML的script标签里面,属性设置为"text/template",然后直接用jQuery的html()方法取字符串,如果涉及到模板变量、逻辑语句的话就换underscore试试,
    wesley
        3
    wesley  
       2014-07-30 16:16:52 +08:00
    dom最优雅
    nocoo
        4
    nocoo  
       2014-07-30 16:23:09 +08:00
    var cache = [];
    cache.push('a');
    cache.push('b');
    cache.push('c');
    var result = cache.join(''); // abc
    n37r06u3
        5
    n37r06u3  
    OP
       2014-07-30 16:24:49 +08:00
    @TangMonk 用的django 模板 要冲突了
    n37r06u3
        6
    n37r06u3  
    OP
       2014-07-30 16:37:39 +08:00
    @Tonni underscore 不错
    spark
        7
    spark  
       2014-07-30 17:04:58 +08:00 via iPhone
    str = "Say #{hello}"

    这种如何?Coffee
    hkongm
        8
    hkongm  
       2014-07-30 17:42:47 +08:00   ❤️ 1
    push过时了。。。

    俺用
    var str = '\
    <div> \
    </div> \
    ';
    Sivan
        9
    Sivan  
       2014-07-30 17:45:50 +08:00
    可以用模板的话最方便。push 相对「优雅」,但拼字符串可能是最快的。
    bombless
        10
    bombless  
       2014-07-30 17:49:23 +08:00
    看标题还在想加号难道还不够你用么…

    也许你是需要一个模板库…
    rekey
        11
    rekey  
       2014-07-30 17:50:25 +08:00
    @Tonni 赞恶心优雅的 XXX
    vvtommy
        12
    vvtommy  
       2014-07-30 18:26:20 +08:00
    嗯… 之前做过测试,juicer最快。
    song940
        13
    song940  
       2014-07-30 18:40:25 +08:00 via iPhone   ❤️ 1
    tamamaxox
        14
    tamamaxox  
       2014-07-30 19:58:04 +08:00
    handlebars coffee
    izoabr
        15
    izoabr  
       2014-07-30 20:38:32 +08:00
    @Tonni 赞+1
    fuxkcsdn
        16
    fuxkcsdn  
       2014-07-30 21:35:48 +08:00
    [
    "<div>",
    "<input type='text' />",
    " </div>"
    ].join('');
    看起来还算“优雅”
    dant
        17
    dant  
       2014-07-30 22:56:03 +08:00 via iPhone
    这浓浓的知乎风是怎么回事。。
    dreampuf
        18
    dreampuf  
       2014-07-31 00:47:24 +08:00
    如果把优雅换成 best practice 大家会不会容易接受点?或者用“地道、接地气”?

    V2EX里出现“优雅”的发问比知乎早很多
    https://www.google.com/search?q=site:v2ex.com/t%20%E4%BC%98%E9%9B%85&gws_rd=ssl

    =====

    Coffee 的内嵌语法无疑是最优美的,拼接的糙活儿都给你做了。
    反斜杠只是解决了将一行字符串分成多行,没有解决拼接的问题。
    Array.push 方法在语法层面利用数组特性避免了连接符号,但是带来的开销是非常慢(真的非常慢,现代浏览器都会对静态字符串做优化 http://jsperf.com/string-concatenation/79
    multiline利用注释和Function.toString做的小把戏,如果有一些预处理(UglifyJS)会影响结果。

    最佳实践都是日常积累而来,如果光问个结论可能不会让自己收获多少,也许这就是人们反感“优雅的XXX”的原因。
    Venshy
        19
    Venshy  
       2014-07-31 08:46:04 +08:00
    用过mustache,蛮好用的。underscore还躺在starred
    abelyao
        20
    abelyao  
       2014-07-31 09:38:47 +08:00   ❤️ 1
    ChiChou
        21
    ChiChou  
       2014-07-31 10:14:32 +08:00
    @abelyao 黑科技~
    sxd
        22
    sxd  
       2014-07-31 10:20:12 +08:00
    @song940 你这个和 sindresorhus 的有什么区别?
    song940
        23
    song940  
       2014-07-31 11:13:27 +08:00
    @sxd 是他给我灵感, 这个库只能在 Nodejs 下, 而我只是做了 浏览器端和 Nodejs 端的兼容 . 另外尽量简单实用 .
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1531 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 16:54 · PVG 00:54 · LAX 08:54 · JFK 11:54
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.