3. 함수

Notice

Recent Posts

Recent Comments

Link

« 2025/01 »
일	월	화	수	목	금	토
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28	29	30	31

Tags more

Archives

Today

Total

관리 메뉴

안녕, 세상!

3. 함수 본문

It공부/JavaScript

3. 함수

dev_Lumin 2020. 7. 24. 17:56

함수는 하나의 모듈로서 참조되고 실행될 수 있는 문장들의 블록을 지칭하는 것으로 독립적으로 처리할 수 있는 작업을 기술하는 프로그램 단위입니다.

(1) 함수의 정의 및 호출

자바스크립트의 사용자 정의 함수는 "function"으로 시작하며 문장들 사이에 함수의 시작과 끝을 구분하기 위하여 중괄호 "{ }"를 사용합니다.

함수를 정의하는 위치는 <head>와 </head> 태그 사이에 정의되고, 리턴 값의 자료형(return type)과 매개변수의 자료형(argument type)은 지정하지 않아도 됩니다.

형식은 다음과 같습니다.

function 함수명 (매개변수) {

함수실행문;

return 반환 값; // 반환 값 존재 시 return 사용

}

사용자 정의 함수 호출의 형식은 다음과 같습니다.

함수명 (매개변수)

(2) 지역 변수와 전역 변수의 차이

함수 내에서의 지역변수와 전역 변수의 차이입니다.

지역변수 - var 명령을 이용하여 변수를 선언하고 함수 안에서만 적용이 가능한 변수

전역변수 - var 명령어를 사용하지 않고, 변수를 직접 선언할 있으며, 문장 전체에 변수의 내용이 적용되는 변수

형식은 다음과 같습니다.

function 함수명() {

var 변수 // 지역 변수

변수 // 전역 변수

.... 함수의 실행문....

}

다음은 함수 정의 및 호출 코드의 예제입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

<HTML>
<HEAD><title>함수 호출</title>
  <SCRIPT language="javascript">
  function sumf(su){
    var i,a=0;
    for(i=0;i<=su;i++){
      a+=i;
    }
    return a;
  }
  </SCRIPT>
</HEAD>
<BODY>
  <h3>함수 호출하기</h3>
  <SCRIPT language="javascript">
      n=prompt("수를 입력하세요: ",0);
      s=sumf(n);
      document.write("0부터 "+n+"까지의 합은 "+s+"입니다.");
  </SCRIPT>
</BODY>
</HTML>
Colored by Color Scripter

cs

(3) 내장 함수

자바스크립트 자체에서 지원하는 함수를 의미하며 독립적으로 객체의 참조 없이 어느 위치에서든 혹은 어느 객체에서도 호출할 수 있는 함수를 말합니다.

다음은 자바스크립트 내장 함수들입니다.

함수 종류	설명
alert (string)	확인 버튼이 있는 알림 대화상자를 생성해 주는 함수
confirm( )	확인과 취소 버튼이 있고, 확인/취소 대화상자를 생성해 주는 함수
prompt( )	확인과 취소 버튼이 있고, 입력상자가 있는 대화상자를 생성해 주는 함수
parseint(문자열, [진수])	문자열을 정수형으로 변환하여 리턴함. 진수는 8, 10, 16진수 중에서 하나를 설정할 수 있으며 생략하면 10진수로 간주됨
parsefloat(문자열)	문자열을 실수값으로 변환하여 리턴함. 만약 첫번째 글자를 숫자로 변환하지 못할 경우에는 NaN(Not a Number)를 리턴함
isNaN(검색할 숫자)	제공된 숫자가 타당하지 않은 연산결과가 발생할 경우에는 true를 반환하고 반대의 경우에는 false를 리턴
isFinite(검색할 숫자)	숫자가 양의 무한대나 음의 무한대를 가지는 경우에는 false를 리턴하고 유한의 수일 경우 true를 리턴함
escape(특정 문자)	A~Z a~z 1234567890 @ * - _ + . / 를 제외한 모든 문자를 %16진수의 아스키 코드값으로 변환 1바이트문자는 %XX 형태로, 2바이트문자는 %uXXXX 형태로 변환함
unescape(아스키 코드)	%16진수의 아스키 코드 값을 문자로 변환함
eval(수식문자열)	문자열을 숫자로 변환한 후 그 결과값을 리턴함

① alert 내장 함수

확인 버튼이 있는 알림 또는 경고 대화 상자를 생성해 화면에 표시시켜 주는 함수입니다.

alert("문자열")

예제는 다음과 같습니다.

1
2
3
4
5
6
7
8

<HTML>
<HEAD><title>alert sample</title></HEAD>
<BODY>
  <SCRIPT language="javascript">
      alert("자바스크립트 경고창!");
  </SCRIPT>
</BODY>
</HTML>
Colored by Color Scripter

cs

② conform 내장 함수

확인과 취소 버튼이 있는 알림 대화 상자를 생성해 화면에 표시하고, 확인 버튼을 누르면 True 값이 반환되고 취소 버튼을 누르면 False 값이 반환되는 함수입니다.

ret = conform("문자열") // ret는 confirm 함수가 반환할 값(true 또는 false)을 넘겨받을 변수

다음은 comform 내장 함수의 예제입니다.

1
2
3
4
5
6
7
8
9
10
11

<HTML>
<HEAD><title>confirm sample</title></HEAD>
<BODY>
  <SCRIPT language="javascript">
      var result;
      result=confirm("계속하겠습니까?");
      if(result) document.write("묵고 떠블로 가부러!");
      else document.write("쫄았습니까...");
  </SCRIPT>
</BODY>
</HTML>
Colored by Color Scripter

cs

③ prompt 내장함수

사용자로부터 값을 입력받을 수 있는 대화 상자를 생성하여 표시시켜주는 함수입니다.

ret=prompt("문자열1", "문자열2")

// ret는 함수가 반환할 입력 상자 입력값을 넘겨받을 변수

// 문자열 1은 대화 상자에 표시시킬 문자열로 큰따옴표 내에 표시

// 문자열 2는 대화 상자 내의 입력 상자에 표시시킬 문자열로 큰따옴표 내에 표시

다음은 prompt 내장 함수 예제입니다.

1
2
3
4
5
6
7
8
9
10

<HTML>
<HEAD><title>prompt sample</title></HEAD>
<BODY>
  <SCRIPT language="javascript">
      var result;
      result=prompt("당신의 나이를 입력하세요.","나이입력");
      document.write("당신의 나이는 "+result+"살 입니다.");
  </SCRIPT>
</BODY>
</HTML>
Colored by Color Scripter

cs

④ 나머지 내장함수

나머지 내장 함수는 예시를 통해서 설명하겠습니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<HTML>
<HEAD><title>prompt sample</title></HEAD>
<BODY>
  <SCRIPT language="javascript">
      document.write(eval("1+2+3")+"<br>"); // 문자열을 숫자로 변환및 계산
      document.write(parseInt("243",8)+"<br>");  // 문자열을 8진수로 변환
      document.write(parseFloat("3.14")+"<br>");  //문자열을 실수로 변환
      document.write(escape("abc가나다")+"<br>"); //특정 문자를 아스키 코드로 변환
      document.write(unescape("%uAC00%uB098%uB2E4")+"<br>");  // 아스키코드를 특정 문자로 변환
      document.write(isFinite(1357)+"<br>");   //무한대 판단하기
      document.write(isNaN("가나다")+"<br>");  // 숫자인지 판단하기
  </SCRIPT>
</BODY>
</HTML>
 
Colored by Color Scripter

cs

escape 내장함수는 위에서 설명했듯이 영어부분은 아스키코드로 바뀌지 않은 것을 확인할 수 있습니다.

⑤ 재귀적 함수 호출 (Recursive Call)

함수 안에서 자기 자신의 함수를 다시 호출하는 방법입니다.

팩토리얼을 재귀적 함수 호출을 이용하면 다음과 같이 표현할 수 있습니다.

function factorial(num) {

if(num==0) return 1;

else return(num*facorial(num-1))

}

저작자표시 비영리 변경금지

'It공부 > JavaScript' 카테고리의 다른 글

6. 웹브라우저 내장객체 (0)	2020.07.28
5. 이벤트와 이벤트 핸들러 (0)	2020.07.27
4. 객체 (0)	2020.07.26
2. 연산자와 제어 구조 (0)	2020.07.24
1. 자바스크립트 개요 (0)	2020.07.23