Math메서드, 배열메서드

JSP  ||  DAY5  ||  Math메서드, 배열메서드

---

 0. Math._____메서드 

Math.max (숫자1,숫자2,숫자3, 숫자4 . . .);   : 괄호 안의 숫자 중 가장 큰 값을 반환한다.
Math.min (숫자1,숫자2, 숫자3, 숫자4);       : 괄호 안의 숫자 중 가장 작은 값을 반환한다.

Math.round (num);    : 소수점 첫째자리에서 반올림해 정수를 반환함.
Math.floor (숫자);      : 소숫점 첫쨰자리에서 무조건 내림해서 정수를 반환함.
Math.ceil (숫자);        : 소수점 첫째자리에서 무조건 올림해서 정수를 반환함.

Math.random ( );       : 숫자 0.0과 1.0 사이의 랜덤값을 발생시켜 반환한다.
Math.PI ;                 : 원주율 상수를 반환한다.

 

# 0.0~1.0 해당범위에 해당하지 않는 숫자를 랜덤하게 반환받으려면?

1. 만약 0~10까지의 정수로만 난수를 발생시켜 반환받으려면 Math.floor( ) 메서드를 활용해야한다.
-> Math.floor( Math.random*11 );   :   ( 0.0000000n * 11 ) ~ (0.999999n * 11) 발생값 소수점 버림.

2. 120~150 사이의 난수를 정수로만 발생시키기
-> Math.floor( Math.random()*31 );    :  0~30 사이의 난수를 발생시킴
-> Math.floor( Math.random()*31) + 120;   :  0~30사이의 난수에 120을 더함

# 난수를 발생시커 원하는구간의 정수인 난수를 구하는 공식
Math.floor( Math.random( ) * (최대값-최소값) + 1) ) + 최솟값;

 

# 예제) Math.random( ) 메서드를 활용하여 컴퓨터와 가위바위보 게임하기

<script type="text/javascript">
 	
// 1. 웹사이트 방문자의 답변을 받아 t에 저장.
 	document.write("<h1> 컴퓨터의 가위, 바위, 보 맞추기! </h1>")
 	var t = prompt("가위 / 바위 / 보 중 하나를 입력하세요!", "가위");
 	
// 2. 방문자의 문자열 입력값을 switch문을 활용해 tNum변수에 저장. 
 	var tNum;
 	switch (t) {
	case "가위": // 사용자가 입력한 값이 가위인 경우, tNum에 1 저장해서 숫자데이터로 변환
		tNum = 1;
		break;
		
	case "바위": // 사용자가 입력한 값이 바위인 경우, tNum에 2 저장
		tNum = 2;
		break;
			
	case "보": // 사용자가 입력한 값이 보인경우, tNum 에 3저장
		tNum = 3;
		break;

	default: 
		alert("잘못된 값입니다!");
		location.reload(); // 웹브라우저를 통해 현재의 html을 재요청&새로고침하기
		break;	
	}
 	    
// 3. 컴퓨터의 난수생성(com) & 1~3의 범위를 갖도록 지정.
	var com = Math.ceil(Math.random() * 3 );
	
// 4. 난수와 이미지파일 경로를 결합하여 대응하는 이미지불러오기
	document.write("<img src='images/math_img_" + com + ".jpg'/>");
	
// 5. 사용자가 입력한 값(tNum)와 컴퓨터가 생성한 값(com)과 일치한지 조건검사하기
	if (tNum == com) {
		alert("맞췄습니다. 축하합니다!");
	} else {
		alert("꽝! 다음기회에 도전해주세요");
	}

</script>

---

 1. 배열 

# 배열객체 메모리 생성방법

*** 자바에서는 다른 자료형의 데이터를 같은 배열메모리에 저장할 수 없지만, 자바스크립트는 가능함.

1.  var 참조변수 = new Array(값1, 값2, 값3 ...);
ex) var d = new Array(30, "홍길동", true);

2. var 참조변수 = [값1, 값2, 값3] ;
ex) var d = [30, "홍길동", true];

 

# for문을 이용하여 배열의 데이터 출력하기

for (var i = 0; i < d.length; i++) {
  document.write(d[i], "<br>");
}

 

# 향상된 for문

: 배열d의 인덱스 값이 i에 차례로 저장되면서 { . . . }의 실행문이 순차적으로 출력된다.

for ( var i in d) {
  document.write(d[i],"<br>");	
}

---

 2. 배열메서드 

join("연결문자")      : "연결문자"를 기준으로 1개의 문자열로 결합함.
concat( )    : 두개의 배열객체메모리를 하나로 결합함.

reverse( )            : 배열에 저장된 데이터의 순서를 거꾸로 바꾼 후 배열을 반환함.
sort( )                : 배열에 저장된 데이터를 오름차순 정렬 후 배열을 반환함.

splice( a , b , c)     :  a인덱스의 b개의 데이터를 삭제, c데이터를 삽입함.
slice( a , b )       :  a인덱스부터 b이전까지의 데이터만 선택해서 반환함.

pop( )       : 마지막 인덱스에 저장된 데이터를 삭제함
push( )      : 마지막 인덱스에 새 데이터를 삽입함
shift( )       : 첫번째 인덱스에 저장된 데이터를 삭제함
unshift( )    : 첫번째 인덱스에 새 데이터를 삽입함

length속성   : 배열에 저장된 총 데이터의 개수를 반환함

 

# 예제

splice( ) 와 slice( ) 연습하기

var greenLine = ["사당", "교대", "방배", "강남"];

// splice(a,b,c)
greenLine.splice(2,1,"서초", "역삼"); // 2인덱스-1개의 데이터 삭제-그위치에 "서초", "역삼" 삽입

// slice(a,b)
document.write(greenLine.slice(1,3)); // 교대, 방배