JSP - chapter01(2)

45792 단어 jspjsp

🧨메서드 이름 규칙

  • 첫글자 ? 문자(알파벳 대소문자) 또는 _로 시작
  • 첫글자 제외한 나머지 ? 문자와 숫자, _의 조합
  • 메서드 이름은 대소문자 구분함

-자바빈 규약 : 카멜케이스 표기법, getter, setter를 지킴

🧨선언부의 함수-1

<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%! //선언부 시작
/*
	스크립트릿이나 표현식에서 사용할 수 있는 함수를 작성 할 때 사용
	선언부의 함수는 자바의 메서드와 동일
	정수 값 : int, short, long
	실수 값 : float, double
*/

public int multiply(int a, int b) {
	int c = a * b;
    return c;
}
%>
<!DOCTYPE html>
<html>
<head>
<title>선언부의 함수연습</title>
</head>
<body>
10 * 25 = <%=multiply(10, 25)%>
</body>
</html>

출력 : 10 * 25 = 250

🧨선언부의 함수-2

<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<%! 
public int add(int a, int b) {
	int c= a + b;
    return c;
}
public int subtract(int a, int b){
	int c = a - b;
	return c;
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>선언부의 함수연습</title>
</head>
<body>
3 + 9 = <%=add(3, 9) %>
<br>
3 - 9 = <%=subtract(3, 9) %>
</body>
</html>

출력 :
3 + 9 = 12
3 - 9 = -6

🧨구구단 연습

<%@ page language="java" contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>구구단</title>
</head>
<body>
	<table border="1">
		<tr>
			<%
			for(int i=2; i<=9; i++){
				%>
				<th><%=i %>단</th>
				<%
			}
			%>
		</tr>
		<%
		for(int j=1; j<=9; j++){
			%>
			<tr>
			<%
			for(int i=2; i<=9; i++){
				%>
					<td><%=i %> * <%=j %> = <%=i*j %></td>
				<%
			}
			%>
			</tr>
			<%
		}
		%>
	</table>
</body>
</html>

출력:

<request 기본 객체>

  1. 웹 브라우저(클라이언트)가 웹 컨테이너(tomcat/웹서버)에 전송한 요청 관련 정보 제공

  2. JSP 페이지에서 가장 많이 사용되는 기본 객체. 웹 브라우저의 요청과 관련이 있음

  3. 웹 브라우저에 웹 사이트의 주소를 입력하면, 웹 브라우저는 해당 웹 서버에 연결한 후 요청 정보를 전송. 이 때, 이 요청 정보를 제공

  4. 주요 기능

  • 클라이언트(웹 브라우저)와 관련된 정보 읽기
  • 서버와 관련된 정보 읽기
  • 클라이언트가 전송한 요청 파라미터 읽기
  • 클라이언트가 전송한 요청 헤더 읽기
  • 클라이언트가 전송한 쿠키 읽기
  • 속성도 처리해줌

🧨계산기

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%! //선언부 사용
	public int add(int a, int b) {
		return a + b;
	}
	public int minus(int a, int b) {
		return a - b;
	}
	public int multi(int a, int b) {
		return a * b;
	}
	public int sub(int a, int b) {
		return a / b;
	}
%> 
<%

	String  firstStr = request.getParameter("a")==null? "0" : request.getParameter("a");
	String  sikStr = request.getParameter("sik")==null? "+" : request.getParameter("sik");
	String  secondStr = request.getParameter("b")==null? "0" : request.getParameter("b");
	
	
	int firstInt = Integer.parseInt(firstStr); //첫번째 숫자
	int secondInt = Integer.parseInt(secondStr); //두번째 숫자
	int resultInt = 0; //연산결과
	
	if(sikStr.equals("+")) { //덧셈
		resultInt = add(firstInt, secondInt);
	}else if(sikStr.equals("-")) {//뺄셈
		resultInt = minus(firstInt, secondInt);
	}else if(sikStr.equals("*")) { //곱셈
		resultInt = multi(firstInt, secondInt);
	}
%>   
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>jsp계산기</title>
<script type="text/javascript" src="../../js/lib/jquery-3.6.0.js"></script>
<script type="text/javascript">
	function fncA(geta, getb) {
		/* alert(geta + "," + getb); */
		console.log(geta + "," + getb);
		var vara = document.getElementById("a");
		var varSik = document.getElementById("sik");
		var varb = document.getElementById("b");
		if(vara.value == "") { //첫번째 값이 없을 때 첫번째 값을 입력
			if(getb == 0){ //7클릭하면 7, 0임(숫자일 경우만 체크 [0: 숫자, 1: 연산자, 3: 실행])
				vara.value = geta;
			}
		}else { //첫번째 값이 있을 때 두번째 값으로 입력
			if(getb == 0) {
			varb.value = geta;
			}
		}
		//연산자를 입력함
		if(getb == "1") {
			varSik.value = geta;
		}
	}
	
	function fn_chk() {
		var vara = document.getElementById("a");
		var varSik = document.getElementById("sik");
		var varb = document.getElementById("b");
		
		if(vara.value == "") {
			alert("첫번째 숫자를 입력해주세요.");
			return false;
		}
		if(varSik.value == "") {
			alert("연산자를 입력해주세요.");
			return false;
			
		}
		if(varb.value =="") {
			alert("두번째 숫자를 입력해주세요.");
			return false;
			
		}
		return true; //submit이 실행됨
		//localhost:8090/chapter02/calc2.jsp?a=7&sik=x&b=2&txtResult=
	}
</script>

</head>
<body>
<form name="frm" id="frm" method="get" action="/chapter02/calc2.jsp" onsubmit="return fn_chk()"> <!-- onsubmit : name있는거 빈값인지 전부 확인 후 submit함 -->
<input type="hidden" name="a" id="a" value="">&nbsp;
<input type="hidden" name="sik" id="sik" value="">&nbsp;
<input type="hidden" name="b" id="b" value=""><br>
	<table border="1" style="width: 400px;">
		<tr>
			<th colspan="4"><input style="width: 90%; text-align: right;" type="text" id="txtResult" name="txtResult" value="<%=resultInt %>" ></th>
		</tr>
		<tr>
			<th><input type="button" value="7" onclick="fncA('7', '0')"></th>
			<th><input type="button" value="8" onclick="fncA('8', '0')"></th>
			<th><input type="button" value="9" onclick="fncA('9', '0')"></th>
			<th><input type="button" value="*" onclick="fncA('*', '1')"></th>
		</tr>
		<tr>
			<th><input type="button" value="4" onclick="fncA('4', '0')"></th>
			<th><input type="button" value="5" onclick="fncA('5', '0')"></th>
			<th><input type="button" value="6" onclick="fncA('6', '0')"></th>
			<th><input type="button" value="-" onclick="fncA('-', '1')"></th>
		</tr>
		<tr>
			<th><input type="button" value="1" onclick="fncA('1', '0')"></th>
			<th><input type="button" value="2" onclick="fncA('2', '0')"></th>
			<th><input type="button" value="3" onclick="fncA('3', '0')"></th>
			<th><input type="button" value="+" onclick="fncA('+', '1')"></th>
		</tr>
		<tr>
			<th><input type="button" value="" onclick=""></th>
			<th><input type="button" value="0" onclick="fncA('0', '0')"></th>
			<th><input type="button" value="" onclick=""></th>
			<th><input type="submit" value="="></th>
		</tr>
	</table>
</form>
</body>
</html>

출력 : 5 + 2 출력 결과

좋은 웹페이지 즐겨찾기