작성자

freewebkorea

카테고리

비밀번호

제목

<H2>Math Object</H2>
Math object는 Math라는 글자만 봐도 알 수 있듯이 수학(Mathemetics)에 사용되는 Property와 Method 들을 다루는 Object가 되겠습니다. 사실 저의 경우에는 아래 표에 있는 Property들 중에 PI 를 제외한 나머지 들은 실행해 본 적은 있어도 사용해 본적은 단 한 번도 없구요. 두 번째 표의 Method 중에서는 round(), ceil(), floor(), random(), max(), min() 이렇게 6개 이외에는 실제로 사용해 보지 않았습니다. 그렇지만 이런 Property나 Method가 필요한 사람에게는 꼭 있어야 되는 것 들이겠죠. 별로 사용해 보지 않은 것 들이라 이렇게 강좌로 꾸미려다 보니 NetScape, W3C, MSDN, ECMA 등을 뒤져서 정확성을 기했습니다. 그러고 보니 이 페이지는 강좌라기 보다 제 스스로 공부를 한 셈이로군요...^^ *** JavaScript 대소문자를 정확히 구분한다는 사실을 항상 잊으면 안 되겠습니다...
<TABLE class=attributeTbl cellSpacing=2 cellPadding=0 border=0>
<CAPTION class=general>NN : Netscape Navigator, IE : Internet Explorer (Property와 Method를 처리하는 최소 브라우저 버전)</CAPTION>
<TBODY>
<TR>
<TD class=titleCell colSpan=4>Math Object Properties</TD></TR>
<COLGROUP>
<COL class=syntaxLeftCell width="15%">
<COL class=syntaxRightCell>
<COL class=syntaxRightCell style="TEXT-ALIGN: center" span=2>
<TBODY>
<TR class=syntaxLeftCell>
<TD>Properties</TD>
<TD align=middle>설 명</TD>
<TD width="4%">NN</TD>
<TD width="4%">IE&nbsp;</TD></TR>
<TR>
<TD>E</TD>
<TD>자연 LOG의 밑(base) return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>LN2</TD>
<TD>2의 자연 LOG 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>LN10</TD>
<TD>10의 자연 LOG 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>LOG2E</TD>
<TD>밑(base)이 2인 E의 LOG 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>LOG10E</TD>
<TD>밑(base)이 10인 E의 LOG 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>PI</TD>
<TD>PI(원주율) return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>SQRT1_2</TD>
<TD>1 / 2 제곱근 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>SQRT2</TD>
<TD>2 제곱근 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR></TBODY></TABLE> Math Object Property 예제 <PRE class=input id=math_properties>&lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;Math 관련 Properties&lt;/title&gt;
 &lt;script type="text/javascript"&gt;
 &lt;!--
 document.write("Math.&lt;b&gt;E&lt;/b&gt; = " + Math.E +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;LN2&lt;/b&gt; = " + Math.LN2 +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;LN10&lt;/b&gt; = " + Math.LN10 +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;LOG2E&lt;/b&gt; = " + Math.LOG2E +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;LOG10E&lt;/b&gt; = " + Math.LOG10E +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;PI&lt;/b&gt; = " + Math.PI +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;SQRT2&lt;/b&gt; = " + Math.SQRT2 +"&lt;br&gt;")
 document.write("Math.&lt;b&gt;SQRT1_2&lt;/b&gt; = " + Math.SQRT1_2 )
 // --&gt;
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 
 &lt;/body&gt;
&lt;/html&gt;
</PRE><A href="javascript:copy2Clipboard(math_properties);open_window('../../include/code_executor.asp');"><IMG alt="코드 실행 하기" src="http://www.cadvance.org/doc/images/icon/exec_button.gif" border=0></A> 
<HR class=grayHr>
 Math Object의 Method 
아래의 Method 중에 random(), round(), ceil(), floor(), max(), min() 등은 어느 분야나 쓸 모가 많은 Method이므로 잘 알아 두면 유용하게 사용할 수 있져...
<TABLE class=attributeTbl cellSpacing=2 cellPadding=0 border=0>
<CAPTION class=general>NN : Netscape Navigator, IE : Internet Explorer (Property와 Method를 처리하는 최소 브라우저 버전)</CAPTION>
<TBODY>
<TR>
<TD class=titleCell colSpan=4>Math Object Methods</TD></TR>
<COLGROUP>
<COL class=syntaxLeftCell width="15%">
<COL class=syntaxRightCell>
<COL class=syntaxRightCell style="TEXT-ALIGN: center" span=2>
<TBODY>
<TR class=syntaxLeftCell>
<TD>Methods</TD>
<TD align=middle>설 명</TD>
<TD width="4%">NN</TD>
<TD width="4%">IE</TD></TR>
<TR>
<TD>abs(x)</TD>
<TD>x 의 절대값(absolute Value) return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>acos(x)</TD>
<TD>x 의 arccosine 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>asin(x)</TD>
<TD>x 의 arcsine 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>atan(x)</TD>
<TD>x 의 arctangent 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>atan2(y,x)</TD>
<TD>X 축과 어떤 좌표(x,y)가 이루는 각도(-pi ~ pi 사이의 radian 값) return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>ceil(x)</TD>
<TD>x 가 소수일 경우 무조건 반올림 또는 정수이면 x 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>cos(x)</TD>
<TD>x 의 cosine 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>exp(x)</TD>
<TD>자연 LOG E의 지수 (指數 : exponent) x 값 (Ex :E 의 x 乘 ) return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>floor(x)</TD>
<TD>x 가 소수일 경우 무조건 반내림(절사) 또는 정수이면 x 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>log(x)</TD>
<TD>x 의 자연 LOG 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>max(x,y)</TD>
<TD>x, y 중에서 큰 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>min(x,y)</TD>
<TD>x, y 중에서 작은 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>pow(x,y)</TD>
<TD>x 의 y 승(乘) 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>random()</TD>
<TD>0 ~ 1 사이의 임의의 수 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>round(x)</TD>
<TD>x 의 반올림 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>sin(x)</TD>
<TD>x 의 sine 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>sqrt(x)</TD>
<TD>x 의 제곱근 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR>
<TR>
<TD>tan(x)</TD>
<TD>x 의 tangent 값 return</TD>
<TD>2.0</TD>
<TD>3.0</TD></TR></TBODY></TABLE> Math Object Method 예제 <PRE class=input id=math_methods>&lt;html&gt;
 &lt;head&gt;
 &lt;title&gt;Math 관련 Methods&lt;/title&gt;
 &lt;script type="text/javascript"&gt;
 &lt;!--
 document.write("-3.5의 절대값은 : " + Math.abs(-3.5) + "&lt;br /&gt;")
 document.write("PI의 sine 값은 : " + Math.sin(Math.PI/2) + "&lt;br /&gt;")
 document.write("PI의 cosine 값은 : " + Math.cos(Math.PI/2) + "&lt;br /&gt;")
 document.write("PI의 tangent 값은 : " + Math.tan(Math.PI/2) + "&lt;br /&gt;")
 document.write("0.5의 arcsine 값은 : " + Math.asin(0.5) + "&lt;br /&gt;")
 document.write("0.5의 arccosine 값은 : " + Math.acos(0.5) + "&lt;br /&gt;")
 document.write("0.5의 arctangent 값은 : " + Math.atan(0.5) + "&lt;br /&gt;")
 document.write("좌표 (3, 5)와 X 축의 각도(radian)는 : " + Math.atan2(3,5) + "&lt;br /&gt;")
 document.write("자연 LOG E의 10승은 : " + Math.exp(10) + "&lt;br /&gt;")
 document.write("4.9의 무조건 반내림 값은 : " + Math.floor(4.9) + "&lt;br /&gt;")
 document.write("4.1의 무조건 반올림 값은 : " + Math.ceil(4.1) + "&lt;br /&gt;")
 document.write("10의 자연 LOG 값은 : " + Math.log(10) + "&lt;br /&gt;")
 document.write("3과 5중에 더 큰 수는 : " + Math.max(3,5) + "&lt;br /&gt;")
 document.write("3과 5중에 더 작은 수는 : " + Math.min(3,5) + "&lt;br /&gt;")
 document.write("2의 3승(2&lt;sup&gt;3&lt;/sup&gt;)은 : " + Math.pow(2,3) + "&lt;br /&gt;")
 document.write("0 ~ 1 사이의 임의의 수는 멀까? : " + Math.random() + "&lt;br /&gt;")
 document.write("4.4999의 반올림 값은 : " + Math.round(4.4999) + "&lt;br /&gt;")
 document.write("2의 제곱근 값은 : " + Math.sqrt(2) + "&lt;br /&gt;")
 document.write("0 ~ 100 사이의 임의의 정수는 멀까? : " + Math.round(Math.random() * 100))
 // Math.random() 의 경우는 '실행 결과 보기' 단추를 누를 때 마다 달라집니다.
 // --&gt;
 &lt;/script&gt;
 &lt;/head&gt;
 &lt;body&gt;
 
 &lt;/body&gt;
&lt;/html&gt;
</PRE><A href="javascript:copy2Clipboard(math_methods);open_window('../../include/code_executor.asp');"><IMG alt="코드 실행 하기" src="http://www.cadvance.org/doc/images/icon/exec_button.gif" border=0></A> 
<HR class=grayHr>
 몇 가지 Method 를 이용한 간단한 내기 
어떤 예제를 하면 좋을지 생각하다가 random() 이라는 아주 재미있는 Method를 이용하여 간단한 내기 게임을 하나 만들었습니다. random 이라는 단어는 모르긴 해도 아마 이 사이트의 회원님들이나 이 사이트를 찾아 오신 분이라면 아마 무쟈게 귀에 익은 단어이리라 생각합니다. Te... , Pro... , Zer... 이렇게 3 단어의 일부만 봐도 아! 그거... 하고 아실테죠... 예 맞습니다. 바로 StarCraft 의 Random Player라고 잊지 않습니까... 어떤 종족이 걸릴지 모르는, 아무 종족이나 다 잘하는 그런 Gamer를 뜻하죠. 유명한 선수로는 우리 나라의 최인규, 최진우 등이 있고 푸른 눈의 마법사라고 불리는 기욤 페이트리 같은 선수, 그리고... 바로 이 사람...ㅎㅎ 아래의 예제는 0 ~ 1 사이의 임의의 수를 발생시키는 random Method를 이용하여 2개의 임의의 수를 발생시키고 10을 곱하여 round Method로 0 ~ 10 사이이 정수로 만든 다음 각각 a와 b의 변수에 저장하고 두 수의 크기를 max Method로 비교한 다음 누가 이겼는지 판정해 주는 아무런 조작이 없는 아주 공평한 내기라고 할 수 있습니다. 또 그냥 판정만 하면 거기에 불복할 수도 있기 때문에 Input field에 그 값을 출력하게 하는 과정입니다.입력 <PRE class=input id=gamble>&lt;html&gt;
&lt;head&gt;
 &lt;title&gt;Gambling&lt;/title&gt;
 &lt;script type="text/javascript"&gt;
 &lt;!--
 function who_win(){
 var a = Math.round(Math.random() *10) // 0 ~ 10 사이의 정수를 발행 시켜 a 에 저장
 var b = Math.round(Math.random() *10) // 0 ~ 10 사이의 정수를 발행 시켜 b 에 저장
 var who = Math.max(a, b) // a, b 중 큰 쪽을 who에 저장
 document.gamble.forA.value = a // name이 forA 인 input field에 a값 출력
 document.gamble.forB.value = b // name이 forB 인 input field에 b값 출력
 if(a == b) // a, b 가 같은 값이면
 {
 window.alert("두 선수 비겼습니다. ") // 두 선수 비겼습니다. 를 경고창에 출력
 }
 else if(who == a) // 그렇지 않고 큰 쪽이 a 라면
 {
 window.alert("a 선수가 이겼습니다. ") // a 선수가 이겼습니다. 를 경고창에 출력
 }
 else // 그렇지 않으면, 즉 b가 크면
 {
 window.alert("b 선수가 이겼습니다. ") // b 선수가 이겼습니다. 를 경고창에 출력
 }
 }
 // --&gt;
 &lt;/script&gt;
 &lt;style type="text/css"&gt;
 &lt;!-- 
 input{border:1px solid royalblue; background-color:gold;} /*input field type selector */
 --&gt;
 &lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
 &lt;br /&gt;&lt;br /&gt;&lt;br /&gt;
 &lt;form name="gamble"&gt;
 &lt;p align="center"&gt;
 a 의 결과 : 
 &lt;input type="text" readonly="readonly" name="forA" /&gt;
 ☞ ☜
 &lt;input type="text" readonly="readonly" name="forB" /&gt; : b 의 결과&lt;br /&gt;&lt;br /&gt;
 &lt;button onclick="who_win()"&gt;도박을 위하여 지나친 정신 건강을 삼가합시다.&lt;/button&gt;
 &lt;/p&gt;
 &lt;/form&gt;
&lt;/body&gt;
&lt;/html&gt;
</PRE><A href="javascript:copy2Clipboard(gamble);open_window('../../include/code_executor.asp');"><IMG alt="코드 실행 하기" src="http://www.cadvance.org/doc/images/icon/exec_button.gif" border=0></A> 
<HR class=blackHr>

첨부파일

Tel. 042-353-2371

평일 오전 9시 ~ 오후 7시

기업은행

010-8649-6758

예금주:제주사랑(송진아)