[Web] 커스텀 태그와 EL

2022. 10. 22. 00:12·Programming/Web
728x90

커스텀 태그

커스텀 태그(Custom Tag)란 사용자 정의 태그를 의미한다. 즉 스크립트릿 사용을 줄이고 태그와 같은 형태로 프로그램 코드를 대체하거나 재활용 가능한 구조를 통해 태그 라이브러리로 활용하고자 개발된 규격이다. 외형적인 형태는 XML(HTML) 태그 구조이지만 서블릿 형태로 변환될 때 자바 코드로 변경되어 통합되는 방식이다.

커스텀 태그를 사용하기 위해서는 taglib 지시어를 사용하여 커스텀 태그가 어디에 정의되어 있는지를 먼저 선언해야 하며 태그에 사용할 접두어를 지정해야 한다.

 

커스텀 태그는 잘 사용하면 매우 편리하지만 커스텀 태그 자체가 서버에서 해석되는 구조이며, 프로젝트 특정 커스텀 태그에 종속될 수 있다는 문제 때문에 커스텀 태그를 직접 만드는 방식은 점차 줄어들고 있다.

 

대신 커스텀 태그 기술로 만들어진 JSTL(JSP Standard Tag Library)이 자바 웹 개발에 꼭 필요한 요소가 되었다.

다음은 특정 상품 코드를 전달하면 해당 상품에 대한 세부 정보를 출력하기 위해 커스텀 태그를 사용한 예시다.

<%@ taglib tagdir="/WEB-INF/tags" prefix="m" %>

<m.printData pid="87459989" />
  • 태그 파일로 정의된 커스텀 태그를 사용하며 'WEB-INF/tags/printData.tag' 파일로부터 태그 정의를 가지고 온다.
  • m은 태그 앞에 붙일 접두어로 태그 파일명이 태그 이름이 된다.

useBean 액션 역시 커스텀 태그 기술을 통해 만들어진 것으로 기본 JSP 규격에 포함되어 있기 때문에 ''표준액션(Standard Action)"이라 불린다.

표준 액션과 커스텀 태그
커스텀 태그는 태그 구조로 기능을 구현하는 방식으로 개발자가 필요에 따라 커스텀 태그를 구현해 프로그램에 활용할 수 있다. <jsp:useBean> 또는 <jsp:setProperty> 역시 커스텀 태그로 jsp에 기본적으로 포함되어 있어 표준 액션이라고 부르며 taglib 지시어 없이 바로 사용할 수 있다.

EL

표현 언어(Expression Language)는 주로 EL이라고 불리며 현재 페이지의 자바 객체 혹은 application,  session, request, page와 같은 scope object에 저장된 자바 빈 객체를 손쉽게 접근하고 사용할 수 있게 해준다. 기본적으로 데이터를 표현하기 위한 용도로 설계되었지만 제한된 객체 참조가 가능하며 해당 객체의 메서드 호출도 가능하다.

EL은 단순한 출력 외에도 사칙연산, 비교연산, 논리연산, 3항 연산 등을 지원한다. 이러한 연산 기능은 핵심 로직의 구현보다는 상황에 따라 출력값을 변경하는 정도의 용도로 사용하는 것이 좋다.

 

EL의 장점

  • 간단한 구문으로 손쉽게 변수/객체를 참조할 수 있다.
  • 데이터가 없거나 null 객체를 참조할 때 에러가 발생하지 않는다.

자바 빈 접근

EL을 통해 scope object에 저장된 자바 빈 객체를 참조하는 방법은 다음과 같다.

${저장이름.변수명}
class Member { // 클래스 선언
    private int id;
    private String name;
    private String email;
    ...
    public void setId(int id) { // setter 메서드 선언
    	this.id = id
    }
    public int getId() { // getter 메서드 선언
    	return id;
    }
    ...
}

Member 클래스의 멤버 정보에 접근하기 위해서는 다음과 같이 작성한다 (컨트롤러에 의해 session에 저장하는 과정이 있었다고 가정한다).

<h2>멤버 정보</h2>
이름: ${m.name} <br>
  • 이미 session에 'm'이라는 이름으로 저장된 Member 객체가 있으므로 해당 객체를 사용하여 접근한다.

Member 클래스에 name 변수는 private으로 선언되어 있기 때문에 직접 참조가 불가능하고 getName() 등의 메서드 호출이 필요하다. 이때 클래스에 getter 메서드가 있다면 EL에서는 해당 변수명을 사용하여 내부적으로 getter 메서드를 호출할 수 있다.

EL을 사용하지 않을 경우 다음과 같이 표현식을 사용하거나 <jsp:getProperty> 액션으로 출력할 수도 있다.

이름: <%= m.name %> </br> // 표현식 사용

이름: <jsp:getProperty name="m" property="name" /> <br> // 액션 사용

EL 연산

기본적인 사칙연산, 비교연산, 논리연산, 3항연산 등이 가능하다.

${10 + 20}	// 사칙연산, 30
${10 * 20}	// 사칙연산, 200
${true && false} // 논리연산, false
${10 >= 20}	// 논리연산, falsa
${user.name == "홍길동"? "교수" : "학생"} // 3항 연산, 이름이 홍길동이면 교수 출력

배열, 맵 데이터 연동

참조하는 객체가 배열이나 맵 형태인 경우 다음과 같이 사용한다.

${myList[0]}	// 배열인 경우
${myMap["name"]}  // 맵인 경우

Scope Object 접근

 EL은 기본적으로 모든 scope에서 자바 빈 객체를 갖는다. 만일 특정 scope만을 대상으로 참조하려면 '내장객체명Scope.속성이름'으로 사용할 수 있다. 예를 들어 session과 request 모두에 'm'이라는 이름으로 저장된 객체가 있다고 할 때, request scope에 있는 객체를 참조하려면 다음과 같이 사용할 수 있다.

이름: ${requestScope.m.name}

만일 scope object에 속성으로 저장된 것이 아니라 request의 파라미터로 전달된 값의 경우라면 위 형식처럼 참조할 수 없다. 이 경우에는 request.getParameter("uname")와 같이 사용하며 EL에서는${param.uname}으로 사용한다.

보통은 특정 scope를 지정하지 않고 모든 scope를 대상으로 하기 때문에 ${m.name}의 형태를 주로 사용한다.

 

'Programming > Web' 카테고리의 다른 글

[Web] MVC 패턴  (0) 2022.10.22
[Web] JSTL(JSP Standard Tag Library)  (0) 2022.10.22
[Web] 액션 태그 (useBean, include, forward)  (0) 2022.10.21
[Web] 템플릿 데이터와 스크립트 요소(<%! %>, <%= %>, <% %>)  (0) 2022.10.20
[Web] JSP의 개요(JSP의 장단점, page지시어, include지시어, taglib지시어)  (0) 2022.10.20
'Programming/Web' 카테고리의 다른 글
  • [Web] MVC 패턴
  • [Web] JSTL(JSP Standard Tag Library)
  • [Web] 액션 태그 (useBean, include, forward)
  • [Web] 템플릿 데이터와 스크립트 요소(<%! %>, <%= %>, <% %>)
arajo
arajo
  • arajo
    아라 메모장
    arajo
  • 전체
    오늘
    어제
    • 분류 전체보기 (509)
      • Language (298)
        • HTML (55)
        • CSS (11)
        • JavaScript (70)
        • TypeScript (8)
        • Python (33)
        • Java (119)
        • C (0)
        • C# (2)
      • Programming (92)
        • Programming (14)
        • Web (51)
        • Apache (1)
        • MySQL (23)
        • AWS (3)
      • Framework | Library (26)
        • Framework | Library (3)
        • Vue.js (2)
        • React.js (5)
        • React Native (4)
        • Node.js (1)
        • Ajax (1)
        • Bootstrap (8)
        • Spring (1)
        • Flutter (1)
      • etc (2)
      • 휴식 (19)
        • 책 (13)
        • 일기 (5)
        • 게임 일기 (1)
      • A (71)
        • 공부 (18)
        • 기타 (6)
        • 일 (47)
  • 블로그 메뉴

    • 홈
    • 태그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    변수
    JavaScript
    MySQL
    event
    자바스크립트
    HTML
    TypeScript
    객체
    Python
    파이썬
    array
    web
    Java
    CSS
    next.js
    리액트
    제어문
    타입스크립트
    react
    object
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.1
arajo
[Web] 커스텀 태그와 EL
상단으로

티스토리툴바