ReactJS ：我就是想把代码和HTML混在一起！
作者：网友投稿 时间：2018-08-01 16:24
当我走进这个著名的咖啡馆，这里已经有很多人了，我环顾四周，看到远处的JSP同学和ASP同学正聊得火热，他俩，还有今天没看见的Velocity同学每次都会占据最里边的座位，似乎故意要逃避大家。
从他们的表情看，我就能猜出来这两个家伙又在抱怨人心不古，世风日下，没有程序员使用他们了。
旁边是jQuery和ExtJS， 他俩在低声交谈，时不时朝JSP和ASP方向看两眼， 我估计jQuery又在宣传他那DOM操作大法了。
幸好，还有一个靠窗的空桌，有两个座位， 我走过去坐下，要了一杯咖啡，拿起一本杂志，边喝边看。
代码中混杂HTML
这时候又进来一个年轻人，看到我这一桌还有空位，不客气地坐下， 掏出一张纸，爬在桌子上刷刷刷地写代码。
我偷偷看了一眼，不由得大吃一惊: 怎么能在代码中写HTML呢？
function Welcome(props) {
return <h1>Hello, {props.name}</h1>;
}
这时候服务员正好走过来送咖啡， 也注意到了这段代码， 大叫道：“我赛，这都什么年代了，还在代码里写HTML ！”
这一下便炸了锅，ASP, JSP, jQuery, ExtJS等纷纷围过来看个究竟。
在代码中写HTML，我记得这是上个世纪90年代的事情，那时候连ASP,JSP都没有，只好用C语言写CGI代码，HTML就混杂在C代码中，类似这样：
void main(){
char content[MAXLINE];
sprintf(content,"<html>");
sprintf(content,"<head>");
sprintf(content,"<title>Homepage</title>");
sprintf(content,"</head>");
......其他内容略......
printf("Content-length : %d \r\n",(int)strlen(content));
printf("Content-type:text/html \r\n\r\n");
printf("%s",content);
fflush(stdout);
exit(0);
}
这种模式给修改界面和业务逻辑带来了巨大的麻烦，等到ASP, JSP这样的“模板”语言出现以后，变成了在HTML中写代码：
UI设计师先把HTML页面整体设计好，交给程序员再用<%..%>在其中填入动态的部分， 这种方式可以让设计师和程序员更好地合作。
<%@ Language="VBScript" %>
<html>
<head><title>我的主页</title></head>
<body>
<% For i=3 to 5 %>
<font size=<%=i%> >
你好，欢迎来到我的主页。
</font> <br />
<% Next %>
</body>
</html>
}
现在又有人想在代码中写HTML，简直是疯了！
模板 vs 组件
看到这么多人围过来， 小伙子涨红了脸：“我这不是HTML，我这个是JSX，是JavaScript的一个语法扩展，你们仔细看看，其实和ASP的模板也很像的。”
<h1>Hello, {props.name}</h1>
“那你为什么不直接用模板，为什么要把HTML放到JavaScript当中？这是我们早就抛弃的反模式！” ASP问道。
“对啊，为什么不用模板？ ” 周围的人也随声附和。
“因为我觉得模板难于复用！” 小伙子突然大声说道。
说起复用，这一点我的体会太深了，在开发中，我通常把描述界面结构的HTML，描述展示的CSS， 和操作DOM的JavaScript放在不同的文件当中，在运行时把他们结合起来， 但是这种分离只是技术层面分开管理而已，在逻辑上并没有实现高耦合的组件，也就无法复用。
;){kind=link}
;){kind=link}
;){kind=link}
;){kind=link}