Web开发中前台与后台技术小结

　　在我们日常Web开发中，常常用到EL表达式，JSTL标签，还有可能用到JavaScript中的eval()。下面就这样技术和函数小小说明一下。

　　EL(Expression Language)，全称表达式语言，既然是开发语言，那么就像Java等语言一样是用来写语句的，通常是用在JSP页面中，我们为了获取JSP提供的内置对象的属性值,

我们通常会使用到EL表达式，比如开发中常见的一个需求就是获取项目的根目录，如果项目的名值变化了，我们在指定路径时，如果把项目的根目录用一个变量来表示的话，那么就不

需要修改我们代码，所以此时我们通常会使用到一个常见的表达式${pageContext.request.contextPath},这个表达式的基本解释就是获取JSP的内置对象pageContext的request

对象的属性contextPath的值。到此我们可以举一个小例子来看看${pageContext.request.contextPath}的使用：

比如我们的项目结构是下面：

　　--demo

　　　　--src

　　　　--WebRoot

　　　　　　--WEB-INF

　　　　　　--css

　　　　　　--js

　　　　　　--img

　　　　　　--font

　　　　　　--page

　　如果我们的jsp文件全部放在page目录下面，其中有一个文件demo.jsp引用了img文件夹下的一张图片nav.jpg,核心代码如下：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
　　<head>

　　　　<title>demo演示页面</title>

　　</head>

　　<body>

　　</body>

</html>

如果这个项目发布到服务器中去了，以后有需求，说项目名得修改为demonstration，如果我们上面的代码中不使用EL表达式来获取项目名的话，上面的代码可能就是下面的样子

<img src='/images/loading.gif' data-original="http://www.cnblogs.com//demo/img/nav.jpg">，这时如果修改了项目名demo为demonstration,我们demo.jsp代码就得跟着修改为下面的样子

<img src='/images/loading.gif' data-original="http://www.cnblogs.com//demonstration/img/nav.jpg">。

　　所以我们使用EL表达式语言的第一个直观的好处就是从页面中抽取可能变化的部分，将其封装为一个变量，这样就方便了代码的维护。当然除了这一点外，我们在开发中还是会

大量使用到EL表达式的，比如获取page域、request域、session域或者application域中的参数和变量，我们经常在页面中写上这样的EL表单式：

<input id="" name="username" type="text" value="${username}" > 这样的input输入框通常出现在表单中，那么后面的value="${username}是什么含义

呢? 因为表单一般是用来封装用户提交的数据，那么如果用户输入有误，表单提交给后台程序处理，后台程序提示报错不能正常按照业务逻辑走下去，比如用户登陆表单中有上面的

<input>输入框，用户输错了用户名，那么就不能正常登陆，页面应该跳转到登陆页面，提示相应的错误，那么如果用户名很长，输入不是很方便的话，我们希望将用户输入的用户

名回显的话，那么${username}，就是完成这一功能的。它会从上面讲到的page域开始查找是否有一个变量username，并通过${}来把变量的值获取到，如果没有再从request

域中查找...如果还没有就从session域中查找，如果还没有找到的话，最后会从application域查找，如果有就输出其值，如果还没有找到，就返回''(或者null).所以页面中<input>

第一次是没有值的，如果用户输入了错误的值，页面跳转回来的时候会把用户输入的错误的值回显出来。

　　所以EL表达式的第二个用处就是常用来做数据的回显。讲到此处，顺便说下，EL用来做页面数据回显的好处，因为EL底层也是使用Java语言写的，所以使用EL可以轻松获取

Java类型的数据，然而jsp页面最终通过服务器"翻译"成html的时候，只认识string类型的数据，这时使用EL它会自动完成基本数据类型的转换，比如int类型数据，Date类型的数

据。这一点是JavaScript无法比拟的，因为JavaScript是无法直接解析后台传过来的Java类型数据。

　　那么开发中常常使用EL的地方还有吗？很显然还是有的，但是它喜欢带上它的朋友JSTL一起。他们通常会一起合作来完成一些工作。比如我们有一个需求就是判断用户是否登

陆，如果登陆则显示相应的操作菜单，我们通常这么使用:

<c:if test="${user != null}">

　　<ul >

　　</ul>

</c:if>

所以可以看出来JSTL有点像标签，没错JSTL就是 JSP标准标签库,标签的底层实际上也是使用Java编写的，它通常和逻辑判断有关联，同时呢，它的判断条件很多时候又依赖EL来

获取，所以说JSTL和EL是一对好朋友，互相帮助，彼此协作。JSTL还是有很多的功能的，限于时间和篇幅，我就把开发中常见的JSTL标签的使用场景列举一下：

（1）使用JSTL标签的core标签，常常使用别名c,比如<c:set>设置值，用来来时存储一个值，一般是是供function标签使用的、<c:out>输出值，可以实现自动转义，防止脚本攻

击，<c:url>可以拼接url路径并带上参数，这样也可以防止提交参数乱码；

（2）还有刚才说到function标签，我们可以截取内容显示，fn:substring()；

（3）除此之外我们还常常用到数据的格式化显示别名fmt的标签，实现格式化显示日期，数据，货币。

　　最后说明一下，JavaScript中的eval()，首先它是一个函数，它的功能是：可计算某个字符串，并执行其中的的 JavaScript 代码,但是我们很少直接使用，我们使用它的情况是

使用eval()来将json格式的数据的字符串解析成一个对象，比如下面的例子：

var data = '{"return_code":0,"return_message":"success","data":{"data":[{"id":"1","question":"公主令牌在哪交？"},{"id":"2","question":"公主护使有什么用？"},{"id":"3","question":"角斗场在哪？"},{"id":"4","question":"北部断层在哪？"},{"id":"5","question":"欢乐令有什么用？"},{"id":"6","question":"令牌积分有什么用？"},{"id":"7","question":"南部断层在哪？"},{"id":"8","question":"大妖魔令牌交给谁？"},{"id":"9","question":"神工坊在哪？"},{"id":"10","question":"警戒妖珠有什么用？"}]}}';

我们可以通过下面的代码获取上面类Map对象数据：

var obj = eval("("+data+")");

alert("return_code:"+obj["return_code"]);

alert("第一个问题id：" + obj["data"]["data"][0]["id"]);

　　好了，时间不早了，祝自己做一个拯救世界的好梦！世界不早了，Good Night ,World !

原标题：Web开发中前台与后台技术小结

关键词：web