Ruby China

分享 在 Javascript 中你用什么方式拼接字符串 ?

song940 · 2014年07月17日 · 最后由 qifengle 回复于 2014年07月18日 · 10720 次阅读

以前我是这样做 

var str = "Hello " + name;

后来我知道可以这样做：

var arr = [
  'Hello ',
  name
];

var str = arr.join('');

但是，复杂的拼接就变成了这样 :

var str = '' +
"<!doctype html>" +
"<html>" +
"   <head>" +
"       <title>" + title + "</title>" +
"   </head>" +
"   <body>" +
"       <h1>Hello " + name + ", I'm " + age + " years old. </h1>" +
"   </body>" +
"</html>" +
";

其实我要和大家分享的是 https://github.com/song940/multiline.js 这个库。

他可以让这种工作变简单 . 就像这样 :

var str = multiline(function(){/*
    <!DOCTYPE html>
    <html>
    <head>
        <title>#{ title }</title>
    </head>
    <body>
        <h1>Hello #{name}, I'm #{age} years old. </h1>
    </body>
    </html>
*/}, { name: 'lsong', age: 25, title: 'Homepage' });

console.log(str);

欢迎 Star & Fork .

debugger #1 2014年07月17日

数据和视图都搞在一起了...

sakura79 #2 2014年07月17日

上面的工作可以用_

numbcoder #3 2014年07月17日

拿注释当代码用？压缩之后怎么办？

1 个赞
hz_qiuyuanxin #4 2014年07月17日
  1. underscore
  2. handlerbarsjs
  3. sprocket 里面有 JST
luikore #5 2014年07月17日

简单拼接用 coffeescript 就好了

2 个赞
saiga #7 2014年07月17日

rails 有 coffee 大法，另外 minify 会去掉注释

jjym #8 2014年07月17日

LZ 起标题有一套...

bydmm #9 2014年07月17日

CoffeeScript 大法保平安

ucooling #10 2014年07月17日

这个牛，这几天正好可以用到，试试

zackteng #11 2014年07月17日

诚心诚念 coffee 好，coffee 大法把你保，下次试试楼主的

darkbaby123 #12 2014年07月17日

CoffeeScript 拼接多行 HTML 无压力

text = 'Hello World'
page = """
  <div>
    <h1>#{title}</h1>
  </div>
"""

编译结果：

var page, text;
text = 'Hello World';
page = "<div>\n  <h1>" + title + "</h1>\n</div>";

连 <div> 之前的空格都给你自动省略了，它知道是为了代码缩进。

简单的情况一般就拼字符串凑合，复杂的情况用 template engine 更可靠，毕竟语法支持多一些，还能处理字符串注入。

PS: ES6 马上也有嵌入字符串功能了。

var text = `Hello ${'World'}`;
qifengle #13 2014年07月18日

#12 楼 @darkbaby123 最后还是回到 coffee 了，简单实用啊。

需要 登录 后方可回复, 如果你还没有账号请 注册新账号