자바스크립트 에서 함수를 만드는 방법 입니다.
우선, 함수는 여러번의 실행 코드를 하나의 단위로 만들어서 필요할때 마다 편리하게 여러번 사용할 수 있는 장점이 있습니다. 예제를 살펴보겠습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>자바스크립트 함수 만들기</h1>
<script>
var num1 = 2;
var num2 = 3;
var sum = num1 + num2;
alert("결과 = " + sum);
</script>
</body>
</html>위 코드는 두수의 합을 구하는 소스 입니다.
결과는 하기처럼 팝업창에 합을 보여 줍니다.
그런데 이런 동작을 여러 파일 혹은 여러 곳에서 사용하려고 한다면,
같은 코드를 여러번 적어야 할까요? 그 답이 바로 함수 입니다. 함수를 만들어 놓으면 언제든 함수를 호출하여 편리하게 사용할 수 있습니다. 함수로 변경한 예제는 하기와 같습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>자바스크립트 함수 만들기</h1>
<script>
/*
var num1 = 2;
var num2 = 3;
var sum = num1 + num2;
alert("결과 = " + sum);
*/
//함수 정의
function sumNumber(){
var num1 = 2;
var num2 = 3;
var sum = num1 + num2;
alert("결과 = " + sum);
}
//함수 호출
sumNumber();
</script>
</body>
</html>더하기 코드 부분을 함수로 만들었습니다.
자바스크립트에서 함수를 만드는 방법은
첫째, 함수를 정의 합니다.
function 이라는 예약어를 사용해서 함수 라고 적어주고 뒤에는 함수 이름을 기재합니다.
function sumNumber() // 함수 이름은 이름만 보더라도 무엇을 하는 함수인지 알기 쉽게 적으면 좋겠습니다.
괄호 사이에 안에 함수의 동작에 관련된 코드를 넣어 주면 됩니다.
함수는 이런 모습을 가지고 있어 라고 정의가 끝났습니다.
둘째, 해당 함수를 호출 합니다
함수가 불려지길 원하는 곳에서 함수를 호출 합니다.
함수 호출은 '함수이름()' 이렇게 코딩 하면 됩니다.
자바스크립트에서 함수를 만드는 방법을 알아보았습니다
감사합니다
반응형
'앱 만들기 > JavaScript study' 카테고리의 다른 글
| var 과 let 예약어 차이점 (5) | 2023.01.13 |
|---|---|
| 윈도우 창 닫기 함수 (1) | 2023.01.12 |
| 새로운 윈도우 창 열기 함수 (2) | 2023.01.10 |
| 자바스크립트 콘솔창 단축키 (6) | 2023.01.02 |
| 자바스크립트 로그 함수 (2) | 2023.01.01 |
댓글