함수(Function)란?
프로그램 원래 위에서 아래로 순차적으로 하나씩 실행되는데 제어문으로 실행 순서 로직을 변경할 수 있다. 그리고 프로그램의 기능별로 묶어서 원하는 기능만 프로그램해서 코드의 묶음(이를Code Block)을 만들어서 필요한 기능만 따로 실행하게 하는 것을 함수라고 한다.
자바스크립트 함수는 그 기능이 자체에 내장되어져 있는 내장함수와 사용자가 직접함수를 정의해서 사용하는 사용자(정의)함수로 나뉜다. 변수나 데이터를 정의해 둔 함수에 매개변수를 지정해서 함수를 호출하므로써 실행시키는데 함수의 실행으로 얻어진 결과 값을 호출 함수에 되돌려주기도 한다. 함수에서의 지역변수와 전역변수의 개념도 있다.
alert() 함수를 사용해서 자바스크립트의 실행 내용을 웹 브라우저에 띄우는데 이도 내장함수이다. 함수는 function 으로 표시하는데 기능, 역할을 의미하듯이 어떤 역할을 수행하는 코드 블럭이다. 키보드로 데이터를 입력하는 prompt(0함수와 컴퓨터 화면에 경고창을 띄우는 alert() 함수 등이 있다. 그리고 입력받은 문자열을 숫자 데이터로 변환하는 Number() 함수도 있다.
사용자 정의(User-defined) 함수란?
document 객체의 write() 함수는 브라우저 화면에 웹 페이지 메시지를 출력한다. pronpt(), alert(), write(), Number()등의함수는 자바스크립트 자체에서 그 기능을 제공하고 있기 때문에 내장함수라고 한다. 이런 내장함수들은 함수를 별도로 정의하지 않고 필요 할 때 함수를 호출해서 사용한다. 경우에 따라서는 사용자가 스스로 새로운 함수를 정의해서 사용한다.
function 함수_명 ( ) { // 함수정의. ( ) 사이에는 인자(argument)가 들어간다.
지시어1;
지시어2;
... }
...
함수_명( ); // 함수 호출. ( ) 사이에 인자(parameter)가 들어간다.
...
<..생략>
<script>
function hello() { // 함수 정의
name = "홍길동";
alert (name+"님 안녕하세요???"); // 함수 몸체
}
</script>
</head>
<body>
<button onclick="hello()">인사하기</button> <!--함수 호출-->
</body>
</html>
객체(Object)
자바스크립트 객체(Object)를 기반으로 하는 언어인데 Document 객체는 웹 페이지 자체를 의미한다. 웹 페이지에 HTML요소에 접근할 때에는 반드시 Document 객체를 사용해야 한다. document.write( ) 는 document 라는 객체에 속한 write( ) 라는 내장함수를 의미한다.
매개변수
함수에는 매개변수(Parameter)라는 것이 있는데 이를 이용하면 호출하는 함수에 특징 데이터(값)을 전달해서 그 값으로 함수가 실행되게 한다.
ex) 라면을 끓인다면 냄비(+물)이 함수이고, 라면(+스프)가 매개변수이며, 불이 함수의 기능이다.
<head>
<script>
function hello(name) { // hello() 함수 호출 시 name 인자를 주어야 한다.
document.write(name + "님 안녕하세요???");
}
</script>
</head>
<body>
<button onclick="hello('paul')">버튼1</button> <!--인자를 주어서 함수 호출-->
<button onclick="hello('marry')">버튼2</button> <!--인자를 주어서 함수 호출-->
</body>
</html>변수 2개 함수 정의하기
<script>
var num1 = Number(prompt("아무 숫자를 입력하세요"));
var num2 = Number(prompt("아무 숫자를 입력하세요"));
function multi(num1,num2) { // 함수 정의
var c = num1*num2;
document.write(num1 + "와" + num2 + "의 곱은" + c + "입니다." );
}
multi(num1,num2); // 함수호출
</script>
'일단 해보는 코딩 > Java Script' 카테고리의 다른 글
| [Java Script] 변수 스코프 (지역변수와 전역변수), 익명 함수, Lamda함수 (0) | 2022.07.01 |
|---|---|
| [Java Script] 함수 값 반환 (0) | 2022.07.01 |
| [Java Script] 반복문 ( WHILE /FOR /이중FOR문/BREAK/CONTINUE ) (0) | 2022.06.30 |
| [Java Script] Switch 문 (0) | 2022.06.29 |
| [Java Script] 형변환 제어문(조건문 / 반복문) (0) | 2022.06.29 |