2020년 12월 23일

업데이트:

첫 시작 화면

홈화면

index.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>EL / JSTL</title>
</head>
<body>
	<h3>EL</h3>
	<ul>
		<li><a href="01_el/el.do">01.EL이란?</a>
		<li><a href="views/01_el/02_elParam.jsp">02.EL - param</a>
		<li><a href="01_el/elObject.do">03.EL - Object</a>
		<li><a href="views/01_el/04_elOperation.jsp">04.el - operation</a>
	</ul>
	
	<hr>

	<h3>JSP Action Tag</h3>	
	<ul>
		<li><a href="views/02_action/01_action.jsp">JSP Action Tag - include</a></li>
	</ul>
	
	<hr>
	
	<h3>JSTL</h3>	
	<ul>
		<li><a href="views/03_jstl/01_jstl.jsp">01.JSTL - core(기초)</a></li>
		<li><a href="views/03_jstl/02_jstl_core_if.jsp">02.JSTL - core(if)</a></li>
		<li><a href="views/03_jstl/03_jstl_core_choose.jsp">03.JSTL - core(choose)</a></li>
		<li><a href="views/03_jstl/04_jstl_core_forEach.jsp">04.JSTL - core(forEach-1)</a></li>
		<li><a href="views/03_jstl/05_jstl_core_forEach2.jsp">05.JSTL - core(forEach-2)</a></li>
		<li><a href="views/03_jstl/06_jstl_core_forTokens.jsp">06.JSTL - core(forTokens)</a></li>
		<li><a href="views/03_jstl/07_jstl_core_url.jsp">07.JSTL - core(url)</a></li>
		<li><a href="views/03_jstl/08_jstl_core_redirect.jsp">08.JSTL - core(redirect)</a></li>
		
		<li><a href="views/03_jstl/09_jstl_fmt.jsp">09.JSTL - fmt</a></li>
		
		<li><a href="views/03_jstl/10_jstl_fn.jsp">10.JSTL - fn</a></li>
	</ul>
</body>
</html>



EL이란?

Experssion Language(표현언어)의 약자.
<%= %> 와 같은 JSP 출력에 사용되는 java코드를 간결하게 사용하는 방법으로
화면에 표현하고자 하는 코드를 ${ value } 형식으로 작성하는 것.

01_el.jsp

<%@page import="com.kh.el.model.vo.Person"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<h3>EL 이란?</h3>
	<pre>
		Experssion Language(표현언어)의 약자.
		&lt;%= %&gt; 와 같은 JSP 출력에 사용되는 java코드를
		간결하게 사용하는 방법으로 화면에 표현하고자 하는 코드를
		${ value } 형식으로 작성하는 것.
	</pre>


Person.vo

package com.kh.el.model.vo;

public class Person {
	private String name;
	private int age;
	private char gender;

	public Person() {}

	public Person(String name, int age, char gender) {
		super();
		this.name = name;
		this.age = age;
		this.gender = gender;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public int getAge() {
		return age;
	}

	public void setAge(int age) {
		this.age = age;
	}

	public char getGender() {
		return gender;
	}

	public void setGender(char gender) {
		this.gender = gender;
	}

	@Override
	public String toString() {
		return "person [name=" + name + ", age=" + age + ", gender=" + gender + "]";
	}

	@Override
	public int hashCode() {
		final int prime = 31;
		int result = 1;
		result = prime * result + age;
		result = prime * result + gender;
		result = prime * result + ((name == null) ? 0 : name.hashCode());
		return result;
	}

	@Override
	public boolean equals(Object obj) {
		if (this == obj)
			return true;
		if (obj == null)
			return false;
		if (getClass() != obj.getClass())
			return false;
		Person other = (Person) obj;
		if (age != other.age)
			return false;
		if (gender != other.gender)
			return false;
		if (name == null) {
			if (other.name != null)
				return false;
		} else if (!name.equals(other.name))
			return false;
		return true;
	}
}


ElServlet1

package com.kh.el.controller;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

import com.kh.el.model.vo.Person;


// @WebServlet 어노테이션
// 서버 주소로 요청이 왔을 때 이를 매핑 해주는 web.xml 구문을 대체하는 어노테이션
@WebServlet("/01_el/el.do")
public class ELServlet1 extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    public ELServlet1() {
        super();
    }

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		// servlte / jsp 에서의 객체 범위(scope)
		// 1. page scope : 해당 페이지(servlet/jsp)
		// 2. request scope : 요청 받은 페이지 + 요청 위임 페이지
		// 3. session scope : 브라우저가 종료되거나 세션이 만료되기 전 까지(범위 : 브라우저)
		// 4. application scope : 프로젝트 전체에서 사용 가능한 범위

		// int a; --> page scope
	
		
		// request scope
		request.setAttribute("classRoom", "A강의장");
		request.setAttribute("person",new Person("홍길동", 20, '남'));
		
		
		// session scope
		// Session 객체 얻어오기
		HttpSession session = request.getSession();
		session.setAttribute("academyName", "KH 정보교육원");
		
		// request, session 객체가 동일한 속성명의 속성을 가진 경우
		request.setAttribute("scope", "request scope");
		session.setAttribute("scope", "session scope");
		
		
		
		// 요청 위임
		RequestDispatcher view = request.getRequestDispatcher("/views/01_el/01_el.jsp");
								// views 앞에 '/' : 최상단 폴더(WebContent)를 나타낸다. 
		
		view.forward(request, response);
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

1. scriptlet을 이용하여 request,session 객체에 저장된 속성 화면 출력하기

scriptlet이용

<h3>1. scriptlet을 이용하여 request,session 객체에 저장된 속성  화면 출력하기</h3>

    <%
    // 1. request, session 객체에 저장된 속성 scriptlet을 이용하여 화면 출력하기
    String classRoom = (String)request.getAttribute("classRoom");
    Person person = (Person)request.getAttribute("person");
    
    // Session scope 속성값 얻어오기
    String academyName = (String)request.getSession().getAttribute("academyName");
%>


학원명 : <%= academyName %><br>
강의장 : <%= classRoom %><br>
<br>
수강생 정보
<ul> 
    <li>이름 : <%= person.getName() %> </li>
    <li>나이 : <%= person.getAge() %> </li>
    <li>성별 : <%= person.getGender() %> </li>
</ul>  

<hr>


2. el을 이용하여 request, session 객체에 저장된 속성 화면 출력하기

el이용

  • Session Scope Test 클릭 시 ->
    session
<!-- 위임받은 request에 있는 파라미터 값을 얻어오지 않아도 출력이 된다. -->
<h3>2. el을 이용하여 request, session 객체에 저장된 속성 화면 출력하기</h3>
학원명 : ${academyName}<br>
강의장 : ${classRoom}<br>
<%-- ${classRoom} == <%= request.getAttribute("classRoom") %> 
    
    ${ 속성명 } 을 작성한 경우 
    page -> request -> session -> application 범위 순서로 접근하며
    일치하는 속성명이 있는 경우 해당 속성의 값을 얻어와 출력함.

--%>

<br>
수강생 정보
<ul> 
    <li>이름 : ${person.name}</li>
    <li>나이 : ${person.age }</li>
    <li>성별 : ${person.gender }</li>
    <%-- 
        EL은 객체에 저장된 필드값을 얻어올 
        ${객체명.필드명} 작성하면
        자동적으로 해당 필드의 getter 메소드를 이용하여 값을 얻어온다.
        -> 반대로 생각하면 EL을 이용해서 객체의 필드값을 얻어 올려면 
                객체에 반드시 getter/setter가 작성되어 있어야한다.
        --%>
</ul>

<a href="/EL_JSTL/views/01_el/sessionTest.jsp">
    Session Scope Test
</a> 

<hr>


sessionTest.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

	학원명(session scope) : ${academyName}<br>
	강의장(request scope) : ${classRoom}<br>
	
	<button onclick="history.back()">돌아가기</button>
	<!-- history : 돌아가기/앞으로가기 가능해짐 -->
</body>
</html>


3. el 사용 시 내장객체에 저장된 속성명이 같은 경우

<h3>3. el 사용 시 내장객체에 저장된 속성명이 같은 경우</h3>
    

<pre>
웹 애플리케이션에서 객체는 4가지 영역(범위)를 가짐
page, request, session, application 
1. page 영역
    - 하나의 JSP 페이지 내에서만 객체 공유
    -> forward 되더라도 해당 페이지에 지정된 변수를 사용할 수 없다.
    - pageContext라는 JSP 내장 객체를 사용해도 선언 가능
    
2. request 영역
    - 요청을 하는 페이지 + 요청을 위임 받은(응답) 페이지 에서 객체 공유
    - Servlet에서 JSP로 객체를 공유하는 경우
    -> request.setAttribute("속성명", 객체); 로 전달
    -> JSP에서는 Object obj = request.getAttribute("속성명"); 으로 받음.
    
3. session 영역
    - 하나의 브라우저당 1개의 session 객체가 생성되며 같은 브라우저 내에서 객체를 공유.
    - 브라우저가 종료되거나 session이 만료되면 반환됨.
    - request.getSession() 메소드를 호출하여 session영역 객체를 얻어옴

    
4. application 영역
    - 하나의 웹 애플리케이션당 하나의 application 객체가 생성됨.
    - 애플리 케이션이 종료되기 전 까지 모든 페이지에서 객체 공유
    - request.getServletContext() 메소드를 호출하여 application 영역 객체를 얻어옴.
    
모든 웹 애플리케이션 객체는 
setAttribute("속성명", 객체)로 세팅,
getAttribute("속성명")로 객체를 얻어올 수 있음.

el은 page -> request -> session -> applicationScope 순으로 속성을 찾는다.

</pre>

<br><br>
<hr>


4. 특정 내장 객체에 저장된 속성 다루기

특정 내장 객체

<h3>4. 특정 내장 객체에 저장된 속성 다루기</h3>
	scope 출력 : ${scope }<br>
			<!-- request, session 중 범위가 작은 request가 출력됨 -->
	session에 있는 scope를 출력하고 싶을 때 : ${sessionScope.scope }<br>
	request에 있는 scope를 정확하게 지정해서 출력하고 싶을 때 : ${requestScope.scope }<br>
			
</body>
</html>



EL - Param

파라미터 값 얻어와서 변수에 저장할 필요 없음.
param : 전달된 단일 파라미터값을 얻어올 때 사용.
paramValues : 전달된 복수 파라미터값을 배열로 얻어올 때 사용.

param 테스트

응답

02_elParam.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>EL - Param</title>
</head>
<body>
	<h2>EL param 테스트 </h2>
	<form action="02_elParamEnd.jsp">
		<input type="text" name="pname" placeholder="제품명을 입력하세요.">
		<br>
		<input type="number" name="pcount" placeholder="수량을 입력하세요">
		<br>
		<input type="text" name="option" placeholder="옵션1">
		<br>
		<input type="text" name="option" placeholder="옵션2">
		<br>
		<input type="submit" value="제출">
	</form>
</body>
</html>


02_elParamEnd.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>El - Param</title>
</head>
<body>
	<h3>스크립팅 원소로 파라미터를 얻어와 출력하기</h3>

	<%
		String pname = request.getParameter("pname");
		String pcount = request.getParameter("pcount");
		String[] optionArr = request.getParameterValues("option");
	%>
	
	상품명 : <%=pname %> <br>
	수량 : <%=pcount %> <br>
	옵션1 : <%=optionArr[0] %> <br>
	옵션2 : <%=optionArr[1] %> 
	
	<hr>
	
	<h3> EL의 param을 이용하여 출력하기</h3>
	<p>
		파라미터 값 얻어와서 변수에 저장할 필요 없음.<br>
		param : 전달된 단일 파라미터값을 얻어올 때 사용.<br>
		paramValues : 전달된 복수 파라미터값을 배열로 얻어올 때 사용.
	</p>
	
	상품명 :${param.pname } <br>
	수량    :${param.pcount } <br>
	옵션1 :${paramValues.option[0] } <br>
	옵션2 :${paramValues.option[1] } <br>

</body>
</html>



EL - Object

그 밖의 EL 내장객체 : cookie, initParam, header, pageContext

ELObjectServlet

package com.kh.el.controller;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

@WebServlet("/01_el/elObject.do")
public class ELObjectServlet extends HttpServlet {
   private static final long serialVersionUID = 1L;
       
    public ELObjectServlet() {
        super();
    }

   protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      // Cookie 생성
      // Cookie란?
      // 웹 페이지에서 사용할 정보를 클라이언트 측에
      // 저장하고 불러다 사용할 수 있는 파일
      // ex) 아이디 저장
      
      Cookie cookie = new Cookie("saveId", "user01");
      cookie.setMaxAge(7 * 24 * 60 * 60); // 1주일
      // 쿠키가 저장되는 시간은 ()안에 초 단위로 적는다.
      
      // 생성한 쿠키 객체를 응답 객체에 추가
      // -> 응답 성공 시 클라이언트 컴퓨터에 쿠키 파일을 자동 저장
      response.addCookie(cookie);
      
      RequestDispatcher view = request.getRequestDispatcher("/views/01_el/03_elObject.jsp");
      view.forward(request, response);

   }

   protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
      doGet(request, response);
   }

}


elObject.jsp

<%@page import="java.util.Enumeration"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>EL - Object</title>
</head>
<body>
	<h2>그 밖의 EL 내장객체 : cookie, initParam, header, pageContext</h2>


쿠키

<h3>cookie</h3>

쿠키에서 얻어온 saveId 값 : ${cookie.saveId.value }<br>
id : <input type="text" name="userId" value="${cookie.saveId.value }"><br>
<br><br>
쿠키에 저장되지 않은 값을 얻어와 출력해보기 :${cookie.savePwd.value}

<pre>
EL의 장점 중 하나는 EL을 처리하는 도중 NullPointerException이 발생해도 예외를 발생시키지 않고 빈칸으로 처리한다.
만약 산술 연산에 null이 포함되면 0, 논리 연산에 null이 포함되면 false로 처리함.
10 + null = 10, true && null = false	
</pre>	

<hr>


컨텍스트 초기화 파라미터 : initParam

initparam

<h3>컨텍스트 초기화 파라미터 : initParam</h3>
<p>web.xml에 설정한 초기화 파라미터값을 가져옴. 서블릿초기화 파라미터 아님</p>
컨텍스트파라미터(EL 방법) : ${initParam.email } <br/>
컨텍스트파라미터(스크립팅 방법) : <%= application.getInitParameter("email") %>

<hr>


web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
  <display-name>EL_JSTL</display-name>
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>
		  
  <!-- 
  	web.xml 파일은 배포와 관련된 설명, 설정을 작성하는 파일로
   	서버 배포 시 최우선적으로 읽어지는 파일이다.
   -->
  <context-param>
	<param-name>email</param-name>  	
	<param-value>baegopa@naver.com</param-value>
  </context-param>
	   
</web-app>


기타 request객체의 메소드를 el로 호출하기

기타 request

<h3>기타 request객체의 메소드를 el로 호출하기</h3>
<!-- 
    굉장히 중요함 . 절대 경로의 시작으로 많이 사용함.
    표현식이 더 짧고 사용하기 쉬움
-->

프로젝트의 시작 주소(context-root)를 얻어오는 방법<br>
표현식 : <%= request.getContextPath() %> <br>
EL : ${pageContext.request.contextPath }


</body>
</html>



EL - Operation

el을 가지고 어떤 연산을 처리하지 않음. 속성값들을 화면에 뿌리기 위한 용도임.
하지만, 산술연산 및 논리연산을 지원함. 간단한 논리연산은 자주 사용함.

04_elOperation.jsp

<%@page import="com.kh.el.model.vo.Person"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>EL - Operation</title>
</head>
<body>
	<h2>EL연산 </h2>
	<p>
		el을 가지고 어떤 연산을 처리하지 않음. 속성값들을 화면에 뿌리기 위한 용도임. <br />
		하지만, 산술연산 및 논리연산을 지원함. 간단한 논리연산은 자주 사용함.
	</p>

산술연산

산술

<h3>산술연산</h3>

10 더하기 5 = ${10 + 5}<br>
10 빼기 5 = ${10 - 5}<br>
10 곱하기 5 = ${10 * 5}<br>
10 나누기 5 = ${10 / 5} 또는<%--  ${10 div 5} --%><br>
<!-- 주석을 제거하면 에러가 발생하겠지만 실행하면 문제없음 -->

10 나누기 7의 나머지 = ${10 % 7} 또는 ${10 mod 7}<br>

<hr>

여러 가지 연산 - 객체비교

객체비교

<h4>객체 비교 연산</h4>
<%
    String sOne = "안녕";
    String sTwo = new String("안녕");
    
    // Person VO 만들기
    Person pOne = new Person("홍길동",20,'');
    Person pTwo = new Person("홍길동",20,'');
    
    // page socpe 범위(현재 페이지)  세팅
    pageContext.setAttribute("sOne", sOne);
    pageContext.setAttribute("sTwo", sTwo);
    pageContext.setAttribute("pOne", pOne);
    pageContext.setAttribute("pTwo", pTwo);
    
%>	

<table border="1">
    <tr>
        <th>비교식</th>
        <th>scriptlet</th>
        <th>el</th>
    </tr>
    <tr>
        <td>sOne == sTwo</td>
        <td><%=sOne == sTwo %></td>
        <td>${sOne == sTwo} 또는 ${sOne eq sTwo }</td>
        <!-- el의 == 연산은 equals()와 같은 동작을 함 -->
    </tr>
    <tr>
        <td>sOne != sTwo</td>
        <td><%=sOne != sTwo %></td>
        <td>${sOne != sTwo} 또는 ${sOne ne sTwo }</td>
    </tr>
    <tr>
        <td>pOne == pTwo</td>
        <td><%=pOne == pTwo %></td>
        <td>${pOne == pTwo} 또는 ${pOne eq pTwo }</td>
        <!-- el의 == 연산은 equals()와 같은 동작을 함 -->
    </tr>
    <tr>
        <td>pOne != pTwo</td>
        <td><%=pOne != pTwo %></td>
        <td>${pOne != pTwo} 또는 ${pOne ne pTwo }</td>
    </tr>
</table>
<br><br>


여러 가지 연산 - 숫자형 자동 형변환

숫자자동형변환

<h4>숫자형 자동 형변환</h4>
<%
    // int형 값인 10, 3 세팅 했지만
    //  애플리케이션 객체에 setAttribute된 값은 Obejct 타입으로 저장됨
    pageContext.setAttribute("big", 10);
    pageContext.setAttribute("small", 3);
%>
scriptlet : <%-- <%=  pageContext.getAttribute("big") + pageContext.getAttribute("small")%> --%>
<!-- Object 타입 끼리 더하기가 성립되지 않음 -->
<br>

<!-- el은  scope에 속성으로 담긴타입은 Object를 자동으로 인식하여 형변환 후 연산을 처리함 -->
el : ${big + small }
<br>


여러 가지 연산 - 숫자형 자동 형변환 + 비교 연산

자동형변환비교

<h4>숫자형 자동 형변환 + 비교 연산</h4>
big>small : ${big > small } 또는 ${big gt small } <br>
big&lt;small : ${big<small } 또는 ${big lt small } <br><br>
big>=small : ${big >= small } 또는 ${big ge small } <br>
big&lt;=small : ${big <= small } 또는 ${big le small }<br><br>

    \${big+small } : ${big+small } <br /><br /> 


여러 가지 연산 - 객체가 null 또는 비어있는지 체크

널

<%   
    Person person = null; // 아무것도 참조하지 않는 참조 변수 선언
    List<String> list = new ArrayList<>();
    
    pageContext.setAttribute("person",person); // page scope에 세팅
%>

\${empty person } = ${empty person} <br><br>
\${empty list } = ${empty list} <br><br>

<h1 style="color:red">EL은 NullPointerException을 발생시키지 않는 특징이 있음!</h1>
${person.name }

여러 가지 연산 - 논리연결연산자/부정연산자

 <h4>논리연결연산자/부정연산자</h4>
    ${true and false } 또는 ${true && false } <br>
    ${true or false } 또는 ${true || false } <br>
    ${! (big<small) }
</body>
</html>





댓글남기기