[JSP] JSP 내에서 자바 코드를 간결하게 : EL & JSTL

🔻EL & JSTL

• 두 가지 서로 다른 기술이며, 프로그램 성능에 영향을 끼치진 않지만 구문을 단순하게 하고 가독성을 향상시켜준다.
• 슬로건 : JSP페이지에서 되도록 자바를 쓰지 말자
• 현재는 EL과 JSTL를 사용해서 JSP페이지에서 자바를 잘 쓰지않는다.
• EL 또는 JSTL 작성시 에러는 진짜 에러가 아니므로 실행시켜도 된다.

 

🔻EL 언어

• Expression Language의 약자이다.
• 자바표현식(<%= >) 기능을 대신하기 위해서 만들어진 언어이다.
• 모든 것을 생략하고 key만 적어도 사용가능하다.
• 일반 자원(지역변수, 멤버변수)은 출력할 수 없다.
• 내장 객체(pageContext, request, session, application) 내부의 데이터만 전용으로 출력하는 표현식이다.
• ${} 기호를 사용하여 변수를 참조한다.

 

표현식과 EL 사용법 비교

	<%
		int a = 10;
		pageContext.setAttribute("b", 20);
		request.setAttribute("c", 30);
	%>
	
	<h2>표현식</h2>
	<div>a: <%= a %></div>
	<div>b: <%= pageContext.getAttribute("b") %></div>
	<div>c: <%= request.getAttribute("c") %></div>
	
	<h2>EL</h2>
	<div>a: ${a}</div>	<%-- 빈 값 --%>
	<div>b: ${b}</div>
	<div>c: ${c}</div>

변수 a는 지역변수이므로 EL 표현으로 출력하면 빈 값을 출력한다.

 

 

EL 연산 기능

사칙연산

<div>b+10 = ${b+10}</div>
<div>b-10 = ${b-10}</div>
<div>b*10 = ${b*10}</div>
<div>b/10 = ${b/10}</div>
<div>b%10 = ${b%10}</div>
<div>b mod 10 = ${b mod 10}</div>

연산할 모든 항목은 중괄호 안에 넣어야 연산자로 인식한다. 중괄호 밖에 작성하면 연산자가 아니라 HTML의 PCDATA로 인식하기 때문이다.

'%' 연산자는 'mod'라는 키워드로도 연산이 가능하다. 가끔 특수문자 연산자를 사용할 수 없는 경우 키워드로 치환이 필요하므로 존재하는 것만 알아두면 된다. (외울필요없이 구글링하면 된다)

 

비교 연산

<div>b &gt; 10 = ${b > 10}</div>
<div>b &lt; 10 = ${b < 10}</div>
	
<div>b &gt; 10 = ${b gt 10}</div>
<div>b &lt; 10 = ${b lt 10}</div>

<div>b &gt;= 10 = ${b >= 10}</div>
<div>b &gt;= 10 = ${b ge 10}</div>
	
<div>b == 20 = ${b == 20}</div>
<div>b != 20 = ${b != 20}</div>
	
<div>b == 20 = ${b eq 20}</div>
<div>b != 20 = ${b ne 20}</div>

xml같은 마크업기반의 코드에서는 부등호를 태그의 시작과 끝으로 인식을 하기때문에부등호(< , >)가 인식되지 않을 때가 있다.  코드 내에서 부등호를 사용하기 위해서는 부등호를 키워드로 치환해주어야 한다. 

 

'>' 부등호는 '&gt;' 키워드로 , '<' 부등호는 '&lt;' 키워드로 치환한다.

'==' 기호도 키워드로 치환할 수 있는데 equal의 약자인 'eq'를 사용하면 되고, '!=' 기호도 'ne'를 사용하면 된다.

 

 

논리 연산

<div>${false && true}</div>
<div>${true || false}</div>
<div>${!true}</div>

논리 연산할 때는 'Dead code'를 주의해야 한다.

 

*Dead code

• 쇼트 서킷(Short-circuit) 이라고도 한다.
• 코드가 실행되지 않거나 사용되지 않는 상태를 의미한다. 이는 주로 조건문이나 루프에서 발생한다.
• && 연산자는 양쪽을 다 봐야하고, or 연산자는 한쪽만 true면 true이다.
  • true && true : 왼쪽이 true니깐 오른쪽도 확인해야한다 (정상)
  • false && true : 왼쪽이 false임에 따라 오른쪽 검사를 안해도 되므로 (Dead code)
  • true || false : 왼쪽이 true이므로 오른쪽 검사를 안해도 되므로 (Dead code)

 

삼항연산자

삼항연산자도 가능하다.

<div>${b > 0 ? "양수" : "음수" }</div>

 

 

문자열 비교

equals 메소드 없이 연산자로 비교 가능하며 쌍따옴표("), 꽃따옴표(') 둘 다 지원한다.

<div>${"문자열".equals("문자열")}</div>
<div>${"문자열" == "문자열" }</div>		
<div>${"문자열" == '문자열' }</div>

 

객체 접근(Map)

<%
		HashMap<String, Integer> map = new HashMap<String, Integer>();
		map.put("kor", 100);
		map.put("eng", 90);
		map.put("math", 80);
		
		pageContext.setAttribute("map", map);
%>

EL을 사용하여 배열이나 리스트의 요소에 접근하거나 맵의 키를 사용할 수 있다.

 

표현식으로 접근

<div>국어: <%=map.get("kor") %></div>
<div>영어: <%=map.get("eng") %></div>
<div>수학: <%=map.get("math") %></div>

표현식으로 접근할 때는 get(key) 메소드를 사용하여 접근한다.

 

el로 접근

<div>국어: ${map.get("kor") }</div>
<div>국어: ${map["kor"] }</div>
<div>국어: ${map.kor}</div>

el로 접근할 때는 세가지 방법으로 접근 가능하다.

1. 표현식과 같이 get(key) 메소드로 접근한다. 이러면 el 사용하는 의미가 없어 2,3번을 사용한다.

2. 키인덱스([])로 접근한다.

3. 멤버 접근 연산자(.)로 접근한다.

 

 

객체 접근(일반객체)

<%
		Score score = new Score();
	
		score.setKor(99);
		score.setEng(88);
		score.setMath(77);
		
		pageContext.setAttribute("score", score);
	%>

map은 한번에 하나의 요소를 저장하지만, class는 한 객체에 여러 속성을 담을 수 있어 위와 다른 상황처럼 보인다.

 

 

표현식으로 접근

<div>국어: <%=score.getKor() %></div>

미리 java 파일에 getter 메소드를 만들어서 사용한다.

 

 

el로 접근

<div>국어: ${score.getKor()}</div>
<div>국어: ${score.kor}</div>
<div>국어: ${score["kor"]}</div>

el로 접근할 때는 세가지 방법으로 접근 가능하다.

1. 표현식과 같이 getter 메소드로 접근한다. 이러면 el 사용하는 의미가 없어 2,3번을 사용한다.

2. get를 생략하고 멤버 접근 연산자 + 속성명으로 작성한다.

3. 키인덱스에 속성명을 작성한다.

(2,3 번이 가능한 이유는 EL 내에서 kor에 get를 붙여서 getKor()로 만들어준다.)

 

 

내장 객체 우선순위

• pageContext, request, session, application 이 서로 충돌이 났을 때 EL은 생명주기 순으로 탐색한다.
• 부모와 자식이 충돌나면 자식 먼저 적용되고, 넓은 범위와 좁은 범위가 충돌나면 좁은 범위가 먼저 적용되듯이 생명주기가 확실한 순으로 적용된다.
• 내장 객체명을 Scope와 함께 적으면 해당 내장 객체에 대한 데이터를 가져올 수 있다.

	<%
		pageContext.setAttribute("color", "tomato");		
		request.setAttribute("color", "orange");
		session.setAttribute("color", "gold");					
		application.setAttribute("color", "cornflowerblue");	
	
	
	%>
	
	<div style="background-color:${color};">${color}</div>	<!-- //pageContext -->
	<div style="background-color:${requestScope.color};">${requestScope.color}</div>
	<div style="background-color:${sessionScope.color};">${sessionScope.color}</div>
	<div style="background-color:${applicationScope.color};">${applicationScope.color}</div>

 

---

🔻JSTL

• JSP Standard Tag Library 의 약자이다.
• 표준 태그 라이브러리이지만 실제로는 확장태그이다.
• 자바 프로그래밍 기능을 태그 형식으로 구현했다.
• JSP 페이지에서 자주 사용되는 기능을 태그 형태로 제공하여, JSP 코드를 더 간결하고 유지보수하기 쉽게 만들어주는 라이브러리이다.
• jar 파일이 있어야 사용가능하다.

 

jar 다운로드

1. maven repository 접속

https://mvnrepository.com/

각종 jar 파일 다운로드 받을 수 있다.

 

2. 'JSTL' 검색

상단 검색창에 'JSTL' 검색한다.

2번째 또는 우측 숫자를 보면 사람들이 얼마나 사용하고 있는지를 나타냈는데 가장 높은 것을 선택하면 된다. 

 

3. 버전 선택

최신 버전을 선택한다.

 

4. jar 파일 다운로드

중간 쯤 위치에 jar를 선택하여 파일을 다운로드 받는다.

 

5. 프로젝트와 연결

 lib 폴더 내에 다운로드 받은 jar 파일을 붙여넣는다.

 

 

기본 문법

네임스페이스(namespace) 정의하기

• JSTL을 사용하기 위해서는 JSP 페이지에서 해당 라이브러리를 사용할 수 있도록 네임스페이스(namespace)를 정의해야한다.
• 네임스페이스는 JSTL 태그들을 식별하는데 사용된다.

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

• taglib: 태그 라이브러리를 사용하기 위해 지정하는 JSP 지시자이다.
• prefix: 태그를 식별하기 위한 접두사이다.  개발자끼리의 약속으로 core의 약자로 c로 적는다.
• uri: 태그 라이브러리의 위치를 지정하는 식별자이다. JSTL의 core 태그 라이브러리의 경우, 위의 주소를 사용한다.

이후에는 해당 네임스페이스를 사용하여 JSTL의 태그들을 사용할 수 있다.

 

<c:set var="c" value="30" />

JSTL의 변수를 선언하는 태그로 이를 사용하기 위해 c라는 네임스페이스를 사용했다.

<c:> 태그로 작성한다.

 

 

변수 선언하기 및 수정하기

<c:set var="c" value="300" />

변수 선언과 수정하는 방법은 <c:set> 태그 사용하는 것으로 동일하다.

 

 

변수 삭제하기

<c:remove var="c"/>
<div>c: ${empty c}</div>

<c:remove> 태그를 사용하여 변수를 삭제한다. 

empty 속성은 변수 c가 없으면 true, 있으면 false 반환한다.

 

 

조건문

<c:if>

<c:set var="num" value="10" />

<c:if test="${num > 0}">
	<div>${num}은 양수입니다.</div>
</c:if>
<c:if test="${num < 0}">
	<div>${num}은 양수가 아닙니다.</div>
</c:if>

JSTL에는 else if 절이 없어서, 조건이 여러개 있을 때는 if문을 여러개 작성하는 것과 다중 조건문으로 <c:choose>를 사용한다.

 

다중 조건문

<c:choose>
	<c:when test="${num > 0}">양수</c:when>
	<c:when test="${num < 0}">음수</c:when>
	<c:otherwise>0입니다.</c:otherwise>
</c:choose>

default로 <c:otherwise> 를 사용한다.

 

 

반복문

<c:forEach>

<c:forEach var="i" begin="0" end="9" step="1">
	<div>숫자: ${i}</div>
</c:forEach>

step은 양수(정수)만 가능하다

 

향상된 for문처럼 사용하기

<%
	String[] names = {"홍길동", "아무개", "하하하", "호호호", "후후후"};
	
	pageContext.setAttribute("names", names);
%>

	<c:set var="n" value="0" />
	<table>
		<tr>
			<th>이름</th>
			<th>index</th>
			<th>n</th>
			<th>count</th>
			<th>current</th>
			<th>first</th>
			<th>last</th>
		</tr>
		<c:forEach var="name" items="${names}" varStatus="status">
		<tr>
			<td>${name}</td>
			<td>${status.index}</td>
			<td>${n}</td>
			<td>${status.count}</td>	<!-- 1부터 시작한다. -->
			<td>${status.current}</td>	<!-- 현재 가져온 아아템 값. -->
			<td>${status.first}</td>	<!-- 첫번째 인덱스인지 boolean값으로 반환한다. -->
			<td>${status.last}</td>	<!-- 마지막 인덱스인지 boolean값으로 반환한다. -->
		</tr>
		<c:set var="n" value="${n+1}" />  	<!-- n=n+1 -->
		</c:forEach>
	</table>