- primitive data type들을 객체로 사용 가능하게 해주는 class. - Wrapper class는 산술 연산을 위해 정의된 클래스가 아니므로, 인스턴스*에 저장된 값을 변경할 수 없다. - 값을 참조하기 위해 새로운 인스턴스를 생성하고, 생성된 인스턴스의 값만을 참조할 수 있다.
primitive data type 과 상응하는 wrapper class
primitive data type
wrapper class
byte
Byte
short
Short
int
Integer
long
Long
float
Float
double
Double
boolean
Boolean
char
Character
Boxing 과 Unboxing
- Boxing : 기본 타입의 데이터를 래퍼 클래스의 인스턴스로 변환하는 과정 - Unboxing : 래퍼 클래스의 인스턴스에 저장된 값을 다시 기본 타입의 데이터로 꺼내는 과정
* 인스턴스(Instance) : 객체가 메모리에 할당되어 실제 사용될 때 인스턴스라고 부른다.
package kr.or.ksmart;
public class AA01 {
public void aaa() {
System.out.println("01 aaa 실행");
}
}
aa01_call.jsp
<%@page import="com.sun.xml.internal.bind.v2.schemagen.xmlschema.Import"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@page import="kr.or.ksmart.AA01"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
AA01 a = new AA01();
a.aaa();
%>
aa01_call.jsp 실행
<console>
01 aaa 실행
② 리턴 X 입력 O
package kr.or.ksmart class BB01
package kr.or.ksmart;
public class BB01 {
public void sum(int one, int two) {
System.out.println("one 변수에 담긴 값 : "+one);
System.out.println("two 변수에 담긴 값 : "+two);
int hap = one + two;
System.out.println(hap + "<- hap");
}
}
bb01_call.jsp
<%@page import="kr.or.ksmart.BB01"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
BB01 b = new BB01();
b.sum(5, 3);
%>
bb01_call.jsp 실행
<console>
one 변수에 담긴 값 : 5 two 변수에 담긴 값 : 3 8<- hap
③ 리턴 O 입력 X
package kr.or.ksmart class CC01
package kr.or.ksmart;
public class CC01 {
public String cc() {
System.out.println("cc메서드 실행");
return "김또깡";
}
}
cc01_call.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<%@ page import = "kr.or.ksmart.CC01" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
CC01 c =new CC01();
String re = c.cc();
out.println(re + "<--re <br/><br/><br/>");
%>
cc01_call.jsp 실행
<console>
cc메서드 실행
<브라우저>
김또깡<--re
④ 리턴 O 입력 O
package kr.or.ksmart class DD01
package kr.or.ksmart;
public class DD01 {
public int sum(int one, int two) {
System.out.println("one 변수에 담긴 값 : "+one);
System.out.println("two 변수에 담긴 값 : "+two);
int hap = one + two;
System.out.println(hap + "<- hap");
return hap;
}
}
dd01_call.jsp
<%@page import="kr.or.ksmart.DD01"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
DD01 d = new DD01();
int result = d.sum(5, 15);
out.println(result + "<- result <br/><br/><br/>");
%>
dd01_call.jsp 실행
<console>
one 변수에 담긴 값 : 5 two 변수에 담긴 값 : 15 20<- hap
<브라우저>
20<- result
실습하기
form으로 입력받은 String data type의 두 수를 int data type으로 변환하여 packagekr.or.ksmartclassDD01 method sum 을 이용해 합산하여 화면에 출력하기
packagekr.or.ksmartclassDD01 (위의 ④에서 생성함.)
package kr.or.ksmart;
public class DD01 {
public int sum(int one, int two) {
System.out.println("one 변수에 담긴 값 : "+one);
System.out.println("two 변수에 담긴 값 : "+two);
int hap = one + two;
System.out.println(hap + "<- hap");
return hap;
}
}
input_form.jsp >> 두 수를 입력받을 form 생성
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>
<form action="<%=request.getContextPath()%>/cal/sum_call.jsp" method="post">
1 : <input type = "text" name = "one"> <br/>
2 : <input type = "text" name = "two"> <br/>
<input type ="submit" value = "전송">
</form>
</body>
</html>
sum_call.jsp >> form으로 입력받은 String data type의 두 수를 int data type으로 변환 ( Integer.parseInt() ) kr.or.ksmart.DD01 import 후 method sum 호출
<%@page import="kr.or.ksmart.DD01"%>
<%@ page language="java" contentType="text/html; charset=EUC-KR"
pageEncoding="EUC-KR"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%
String one = request.getParameter("one");
String two = request.getParameter("two");
int a = Integer.parseInt(one);
int b = Integer.parseInt(two);
DD01 dd = new DD01();
dd.sum(a,b);
out.println("입력한 수 1 : " + a + "<br/>");
out.println("입력한 수 2 : " + b + "<br/><br/>");
out.println("두 수의 합 : " + dd.sum(a,b));
%>
input_form.jsp 실행
<브라우저 - 입력화면>
<console>
one 변수에 담긴 값 : 1234 two 변수에 담긴 값 : 4321 5555<- hap
표현식 아이디 출력 : <%= u_id %> <br/>
표현식 비 번 출력 : <%= u_pw %> <br/>
표현식 권 한 출력 : <%= u_level %> <br/>
표현식 이 름 출력 : <%= u_name %> <br/>
표현식 이메일 출력 : <%= u_email %> <br/>
CREATE DATABASE db01 DEFAULT CHARACTER SET UTF8;
/* 영향 받은 행: 1 찾은 행: 0 경고: 0 지속 시간 1 쿼리: 0.016 sec. */
table 생성
CREATE TABLE costomer (
c_id VARCHAR(100) NOT NULL PRIMARY KEY
,c_pw VARCHAR(100) NOT NULL
,c_name VARCHAR(100) NOT NULL
,c_birth DATE
,c_add VARCHAR(100) NOT NULL
,c_phone VARCHAR(100) NOT NULL
,c_balance INT NOT NULL
,c_update DATE NOT NULL
);
mokaroo에서 field name, type, table name을 알맞게 설정하고 랜덤한 데이터를 생성
관계형 데이터베이스 관리 시스템 (RDBMS)의 데이터를 관리하기 위해 설계된 특수 목적의 프로그래밍 언어
DDL
(Data Definition Language)
DML
(Data Manipulation Language)
DCL
(Data Control Language)
- 데이터를 담는 그릇을 정의하는 언어
- 관계형 데이터베이스의 구조 정의
데이터의 생명주기(삽입, 삭제, 갱신)를 제어하는 언어
데이터에 대한 액세스를 제어하는 언어
CREATE
ALTER
DROP
TRUNCATE
INSERT
SELECT
UPDATE
DELETE
GRANT REVOKE COMMIT -TCL ROLLBACK -TCL CHECKPOINT -TCL
DDL (Data Definition Language)
CREATE - 데이터베이스 오브젝트를 생성
ALTER - 데이터 오브젝트를 변경
DROP - 데이터 오브젝트를 삭제
TRUNCATE - 데이터 오브젝트 내용 삭제
DML (Data Manifulation Language)
INSERT - 테이블의 신규 내용을 삽입 SELECT - 테이블의 내용을 조회 UPDATE - 테이블의 내용을 변경 DELETE - 테이블의 내용을 삭제
CRUD (creat read update delete)
CRUD는 대부분의 컴퓨터 소프트웨어가 가지는 기본적인 데이터 처리 기능인 Create(생성), Read(읽기), Update(갱신), Delete(삭제)를 묶어서 일컫는 말이다. 사용자 인터페이스가 갖추어야 할 기능(정보의 참조/검색/갱신)을 가리키는 용어로서도 사용된다.
DCL(Data Control Language)
GRANT -DCL - 데이터베이스 사용자 권한 부여 REVOKE -DCL - 데이터베이스 사용자 권한 회수 COMMIT -TCL - 트랜잭션 확정 ROLLBACK -TCL - 트랜잭션 취소 CHECKPOINT -TCL - 복귀지점 설정
Table의 구성요소 - 식별자 :각 인스턴스를 구분할 수 있는 키 -튜플 : 행, row, record -애트리뷰트 : 속성 -Cardinality : 튜플의 수 -Degree : 애트리뷰트의 수 -Domain : 릴레이션에 포함된 각각의 속성들이 가질 수 있는 값들의 집합
DBMS 데이터 구성
데이터베이스를 이용하는 방식에서는 각 업무 처리에 필요한 자료들의 중복을 최소화하여 한 곳에 모아서 구성한다.
DBMS 필수기능
① 정의(Definition)기능 - 모든 응용 프로그램들이 요구하는 데이터 구조를 지원하기 위해 데이터베이스에 저장될 데이터의 형(Type)과 구조에 대한 정의, 이용 방식, 제약 조건 등을 명시하는 기능
② 조작(Manipulation)기능 - 데이터 검색, 갱신, 삽입, 삭제 등을 체계적으로 처리하기 위해 사용자와 데이터베이스 사이의 인터페이스 수단을 제공하는 기능
③ 제어(Control)기능 - 데이터베이스를 접근하는 갱신, 삽입, 삭제 작업이 정확하게 수행되어 데이터의 무결성이 유지 - 정당한 사용자가 허가된 데이터만 접근할 수 있도록 보안을 유지하고 권한을 검사 - 여러 사용자가 데이터베이스를 동시에 접근하여 데이터를 처리할 때 처리결과가 항상 정확성을 유지하도록 병행제어(Concurrency Control)을 할 수 있어야 한다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>함수</title>
<script type="text/javascript">
/*
함수란?
1. 코드를 저장하였다가 실행하거나 실행하여 결과값을 도출해내는 것.
2. 함수 선언 : function 키워드를 사용.
3. 기본 함수, 익명 함수
*/
//기본함수
function myFn() {
//alert('안녕하세요'); <<- window 객체에 포함된 함수.
console.log('안녕하세요');
var n1 = 10;
var n2 = 20;
console.log(n1*n2);
}
//함수실행
myFn();
//익명함수
var myFn2 = function(){
//함수 실행시 외부함수 실행
myFn();
}
myFn2();
var myFn3 = function(){
//지역변수의 내부함수
var myFn = function(){
console.log('내부함수 실행');
}
myFn ();
console.log('myFn3 실행');
}
myFn3();
//재귀함수 호출 - 함수를 자기 자신 안에서 실행
var num = 0;
var myFn4 = function(){
num++;
//myFn4();
}
myFn4();
console.log(num);
</script>
</head>
<body>
</body>
</html>
함수 실습
/*
실습 7. 함수 fn을 실행하고, 이 함수의 내부함수인 subFn을 실행시켜 num 값이 50이 되도록 한 뒤 num값을 콘솔에 출력시켜라.
*/
var fn = function(){
var num = 0;
var subFn = function(){
num = 50;
}
subFn();
console.log(num);
}
fn();
/*
실습 8. 함수 fn2를 실행하고, 이 함수의 내부 함수인 subFn를 실행시켜
num의 값이 10이 되도록 하고 num 값을 콘솔에 출력시켜라.
반복문 사용
*/
var fn2 = function(){
var num = 0;
var subFn = function(){
num++;
}
for(var i = 0; i <10 ; i++ ){
subFn();
}
console.log(num);
}
fn2();
/*
실습 9. 함수 fn3에 인수 10,20을 넣어 실행시키고
이 함수의 내부 함수인 subFn을 fn3의 매개변수로 받은 값을 넣어 실행시켜라.
subFn 함수에서는 첫번째 매개변수 값 만큼 반복문을 돌리고
반복문의 인덱스*2번째 매개변수 값을 콘솔창에 출력시켜라.
(반복문 사용)
*/
var fn3 = function(n1, n2){
var subFn = function(sn1, sn2){
for(var i = 0; i <sn1 ; i++){
console.log(i * sn2);
}
}
subFn(n1, n2);
}
fn3(10,20);
/*
실습 10. 함수 fn4는 구구단을 출력하기 위한 함수이다.
fn4를 실행시키면서 삽입하는 인수값 기준으로 구구단을 출력하는 함수를 완성시켜라.
*/
var fn4 = function(n){
for(var i=1; i <= 9; i++){
console.log(n*i);
}
}
fn4(8);
//return : 데이터를 반환하거나 함수를 빠져나올 때 쓴다.
var myFn5 = function(n){
console.log('리턴확인1');
if(n <5){
return;
}
console.log('리턴확인2');
if (n < 10){
return;
}
console.log('리턴확인3');
}
myFn5(2);
//return : 데이터를 반환하기
var myFn6 = function(n1,n2){
return n1 * n2;
}
var getData = myFn6(10, 20);
console.log(getData);
/*
실습 11. 아래의 배열값을 fn함수에서 매개변수로 받아 배열의 총 합산값을 리턴하여라.
*/
var arr = [10,20,30,40,50,60,70,80,90];
var fn = function(nArr){//2. 매개변수 받기 : 함수를 실행하면서 배열울 인수값으로 넣어 실행했기 때문에 매개변수 값을 배열로 받을 수 있다.
var re = 0;
//3. 인수로 배열을 넣었기 때문에 매개변수 값은 배열이다.
//배열의 속성인 length를 사용할 수 있다.
for(var i = 0 ; i < nArr.length ; i++){
re += nArr[i];
}
return re;
}
//1. 함수 실행하면서 배열을 인수값에 넣어 실행하기
console.log(fn(arr));
/*
실습 12. 아래 arr2 배열 값을 함수 fn2에서 매개변수로 받아 배열의 3의 배수값만 합산시켜 리턴하여라.
*/
var arr2 = [2, 3, 5, 7, 9, 12, 13 , 14, 15];
var re2 = 0;
var fn2 = function(a){
for(var i = 0; i < a.length ; i++){
if(a[i] % 3 == 0 ){
re2 += a[i];
}
}
return re2;
}
console.log(fn2(arr2));
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체 + 함수</title>
<script type="text/javascript">
/*
실습 13. 객체 obj에 속성 name과 메서드 myFn이 있다.
name 속성의 값은 이순신이다.
메서드 myFn을 실행했을 때 name 속성의 값이 홍길동으로 변환되게 하여라.
*/
var obj = {
name : '이순신',
myFn : function(){
this.name = '홍길동';
}
}
obj.myFn();
</script>
</head>
<body>
</body>
</html>
/*
실습 14. 객체 obj2에 속성 name과 메서드 myFn이 있다.
메서드 myFn 실행 시 인수값을 이름으로 넣어 name 값을 변경시켜라.
*/
var obj2 = {
name : '이순신',
myFn : function(name){
this.name = name;
}
}
obj2.myFn('변경명');
/*
실습 15. 객체 obj3에 속성 arr(배열)과 num(숫자), 메서드 myFn이 있다.
메서드 myFn 실행 시 arr 배열의 속성의 합산값을 num에 대입하여라.
*/
obj3 = {
arr : [10,20,30,40,50,60,70,80,90],
num : 0,
myFn : function(){
for(var i = 0 ; i < this.arr.length ; i++){
this.num += this.arr[i];
}
}
}
obj3.myFn();
console.log(obj3.num);
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>객체</title>
<script type="text/javascript">
/*
객체란?
형체가 있는 대상, 메모리에 올라간 데이터
- 기본 자료형 혹은 내장 객체의 값으로 변수 생성 후 데이터 삽입시
해당 자료형으로 활용할 수 있는 메서드, 속성이 생성된다.
- 객체를 object라고 표현한다.
개발자가 직접 객체 생성하기
this
*/
//객체는 키와 값으로 이루어져 있다.
//객체의 값은 문자, 숫자, 배열, 객체, 함수 등 모든 것을 포함할 수 있다.
var obj = {
myName : '홍길동',
myArray : new Array(),
myObj : {
add : '전주시',
},
};
//객체 내의 배열에 값을 삽입 및 속성값 변경
obj.myName = '이순신';
obj.myArray.push('내 배열');
</script>
</head>
<body>
</body>
</html>
객체 생성 실습
1.
/*
실습 1. obj 라는 변수에 name, age의 속성을 포함한 객체를 완성하여라
*/
var obj = {
name : '브래들리',
age : 20,
};
2.
/*
실습 2. obj2라는 변수에 arr는 배열객체, myObj는 객체의 속성을 포함한 객체를 만들고
arr는 '홍길동', '이순신' 값을 myObj는 name과 age 속성을 가지도록 하여라.
*/
var obj2 = {
arr : new Array('홍길동', '이순신'),
myObj : {
name : '크리스',
age : 20,
},
};
/* var obj2 = {
arr : ['홍길동', '이순신'],
myObj : {
name : '크리스',
age : 20,
},
}; */
3.
/*
실습 3. obj3라는 객체가 있다. 객체 obj3의 속성 중
arr라는 배열을 가지고 name이라는 속성의 값과 일치하는 값만 콘솔에 출력하여라
*/
var obj3 = {
arr : ['홍길동','이순신'],
name : '홍길동'
};
for(var i = 0 ; i < obj3.arr.length ; i++){
if(obj3.arr[i] == obj3.name){
console.log(obj3.arr[i]);
}
};
4.
/*
실습 4. 객체 obj4에 속성 number 와 numArr이 있다.
number의 값은 10이고 numArr은 배열이다.
속성 number의 값만큼 반복문을 돌려 numArr에 삽입하여라.
*/
var obj4 = {
number : 10,
numArr : [],
};
for (var i = 0; i < obj4.number ; i++ ){
obj4.numArr.push(i);
};
5.
/*
실습 5. 객체 obj5에 속성 memberArray, targetMember 가 있다.
targetMember과 memberArray는 배열이다.
속성 targetMember 안에는 객체가 또 존재하며 속성 name과 age가 있다.
age가 20 이상인 대상의 이름만 memberArray에 삽입하여라.
*/
var obj5 = {
memberArray : [],
targetMember : [
{name : '홍길동', age : 21},
{name : '홍길순', age : 19},
{name : '이순신', age : 25},
{name : '둘리', age : 18},
]
};
for(var i =0; i <obj5.targetMember.length ; i++){
if(obj5.targetMember[i].age >= 20){
obj5.memberArray.push(obj5.targetMember[i].name);
}
};
console.log(obj5);
6.
/*
실습 6. 객체 obj6에 속성 numArray, avg가 있다.
속성 numArray는 배열, avg의 값은 0이다.
배열numArray 값 들의 평균값을 avg에 삽입하고,
obj6을 콘솔창에 출력하여라.
*/
var obj6 = {
numArray : [20, 30, 40, 50, 60, 70, 80, 90],
avg : 0
};
var sum = 0;
for(var i = 0 ; i < obj6.numArray.length ; i ++){
sum += obj6.numArray[i];
};
obj6.avg = sum/obj6.numArray.length;
console.log(obj6);
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열 선언</title>
<script type="text/javascript">
/*
배열이란 ?
하나의 저장소에 여러개의 데이터를 저장하기 위한 객체
- 배열 객체 생성시 배열에 관련된 메서드 및 속성을 사용할 수 있다.
- 배열에 데이터가 저장될 때 인덱스라는 주소가 할당된다.
*/
//기본 배열 선언 방법1
var arr1 = new Array();
//배열을 객체화하며 배열의 값을 지정하는 방법1
var arr2 = new Array('홍길동','홍길순');
//배열을 객체화하며 배열의 값을 지정하는 방법2
var arr3 = ['홍길동','홍길순'];
//기본 배열 선언 방법2
var arr4 = [];
/*
length : 배열의 크기를 알 수 있는 속성
*/
console.log('arr1.length : ', arr1.length);
console.log('arr2.length : ', arr2.length);
console.log('arr3.length : ', arr3.length);
console.log('arr4.length : ', arr4.length);
/*
배열의 값에 접근 및 대입하기
- 변수명[인덱스] : 배열에 값을 가지고 올 수 있다.
- 변수명[인덱스] = 값 : 값을 대입할 수 있다.
*/
arr1[0] = '홍길동';
console.log('arr1.length : ', arr1.length,' arr1[0] : ', arr1[0]);
/*
배열의 값을 메서드로 활용하여 삽입하기
*/
arr1.push('홍길순');
console.log('arr1.length : ', arr1.length);
/*
배열의 마지막 인덱스의 값을 제거하기
*/
arr1.pop();
console.log('arr1.length : ', arr1.length);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열과 반복문</title>
<script type="text/javascript">
/*
배열의 크기를 가지고와 배열의 크기만큼 반복문으로 활용하여
원소값(배열의 값)에 접근이 가능하다.
*/
var arr1 = ['홍길동', '홍길순'];
for(var i=0; i < arr1.length ; i++){
console.log('인덱스 i : ', i, arr1[i]);
}
</script>
</head>
<body>
</body>
</html>
배열실습1.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열</title>
<script type="text/javascript">
/*
실습 1. 아래의 배열의 값 중 홍길동이라고 되어있는 값을 이순신으로 교체하라.
*/
var arr = ['홍길동', '둘리', '홍길순'];
arr[0] = '이순신';
console.log(arr);
/*
실습 2. 위 배열의 끝에 유관순이라는 값을 추가하여 콘솔에 배열을 출력시켜라.
*/
arr.push('유관순');
console.log(arr)
</script>
</head>
<body>
</body>
</html>
배열과 반복문 실습
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열과 반복문</title>
<script type="text/javascript">
/*
실습 3 . 1단부터 9단까지이 구구단을 출력시키고
구구단의 값이 3의 배수인 값만 arr 라는 변수에 배열을 할당하여 담고
arr변수를 콘솔에 출력하여라.
*/
var arr = new Array();
for(var a = 1; a <= 9; a++){
for(var b = 1; b <= 9; b++){
if(a*b % 3 == 0){
arr.push(a*b);
}
}
}
console.log(arr);
/*
실습 4. 위의 3의 배수를 담은 arr변수의 배열을 반복문으로 풀고
그의 배열의 모든 값을 합산시켜 최종값만 출력하여라.
*/
var re = 0;
for(var i = 0; i < arr.length; i++ ){
re += arr[i];
}
console.log(re);
</script>
</head>
<body>
</body>
</html>
반복문 + 배열 + 조건문 실습1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>반복문 + 배열 + 조건문</title>
<script type="text/javascript">
/*
실습 5. 아래의 배열 값 중 2의 배수의 값에는 + 10을 적용하고
적용 완료 후 합산시켜 최종 값을 출력하여라.
(for 2번 . 1번째 +10, 2번째 합산)
*/
var arr = [2,5,7,8,11,20,25,28,30];
for(var i = 0; i < arr.length ; i++){
if(arr[i] % 2 == 0){
arr[i] = arr[i]+10; // arr[i] += 10;
}
}
var re = 0;
for(var i = 0; i < arr.length ; i++){
re += arr[i];
}
console.log(re);
</script>
</head>
<body>
</body>
</html>
배열 + 반복문 + 조건문 실습2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열 + 반복문 + 조건문</title>
<script type="text/javascript">
/*
실습 6 . 아래의 배열의 값에서 동일명인 사람 뒤에는 증가시킨 숫자를 붙여 완성하여라.
예) ['홍길동', '홍길동'] --> ['홍길동0', '홍길동1']
*/
var arr = ['고길동','이순신','홍길동', '이순신', '유관순', '이순신'];
var n = 0;
for(var i = 0; i <arr.length ; i++){
if(arr[i] == '이순신'){
arr[i] += n;
n++;
}
}
console.log(arr);
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>조별 실습 - 반복문 + 배열 + 조건문</title>
<script type="text/javascript">
/*
실습 7 . (조별) 아래 배열의 학생과 좌석이 있다.
배열에 담긴 학생들을 순차적으로 좌석 배치를 시키도록 하여라.
--------------------------------------
1 | 2 | 3
--------------------------------------
4 | 5 | 6
--------------------------------------
7 | 8 | 9
--------------------------------------
결과) 출력로그가 좌석 순서대로 3명씩 3줄 출력.
*/
var memberArray = ['홍길동','고길동','이순신','유관순','둘리','손오공','루피','사오정','에이스'];
for(i = 0; i < memberArray.length ; i++){
if( i % 3 == 0){
console.log('-------------------------------------');
console.log (' '+memberArray[i]+' | '+memberArray[i+1]+' | '+memberArray[i+2]);
}
}
console.log('-------------------------------------');
/*
>>>>>>>>>>증감식으로 if 조건 대체
for(i = 0; i < memberArray.length ; i+=3){
console.log('-------------------------------------');
console.log (' '+memberArray[i]+' | '+memberArray[i+1]+' | '+memberArray[i+2]);
}
console.log('-------------------------------------');
*/
</script>
</head>
<body>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>조별 실습 - 반복문 + 배열 + 조건문</title>
<script type="text/javascript">
/*
실습 8 . (조별) 아래 배열의 학생과 좌석이 있다.
배열에 담긴 학생들을 순차적으로 좌석 배치를 시키도록 하여라.
결과) 출력로그가 좌석 순서대로 3명씩 3줄 출력.
*/
var memberArray = ['홍길동','고길동','이순신','유관순','둘리','손오공','루피','사오정','에이스'];
var t = "<table border = 1 >";
for(var i = 0; i < memberArray.length ; i++){
if( i % 3 == 0){
t +=
"<tr>"
+"<td>"+memberArray[i]+"</td>"
+"<td>"+memberArray[i+1]+"</td>"
+"<td>"+memberArray[i+2]+"</td>"
+"</tr>";
}
}
t += "</table>";
console.log(t);
document.write(t);
</script>
</head>
<body>
</body>
</html>
배열 + 반복문 실습
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>배열+반복문</title>
<script type="text/javascript">
/*
실습9. 아래의 배열이 있다. 아래의 배열값을 이용해
테이블을 생성하고 동일한 값을은 병합을 시키도록 하여라.
(
document.write() 메서드를 활용해 table의
테그를 완성하고 인수값을 넣어 화면을 완성
)
참고페이지 : 85페이지
*/
var arr = ['홍길동', '홍길동', '이순신', '둘리', '둘리'];
var str = '';
str += '<h1>결과값</h1>';
str += '<table>';
//반복문 실행
//1차 반복문 테그 완성하기
var name = '';
for(var i=0; i < arr.length; i++){
str += '<tr>';
var len = 0;
if(name != arr[i]){
name = '';
}
for(var j=0; j < arr.length; j++){
if(arr[i] == arr[j]){
len ++;
}
}
if(len == 1){
str += '<td>';
str += arr[i];
str += '</td>';
}else{
if(name == ''){
str += '<td rowspan="' +len+ '">';
str += arr[i];
str += '</td>';
name = arr[i];
}
}
str += '</tr>';
}
str += '</table>';
document.write(str);
</script>
</head>
<body>
<h1>결과값</h1>
<table>
<tr>
<td rowspan="2">홍길동</td>
</tr>
<tr>
</tr>
<tr>
<td>이순신</td>
</tr>
<tr>
<td rowspan="2">둘리</td>
</tr>
<tr>
</tr>
</table>
</body>
</html>
