리턴값이 있는 함수
결과 값이 있는 함수입니다.
리턴값이 있는 함수
결과 값이 있는 함수입니다. ruture이라는 키워드를 이용하여 함수의 결과값을 출력하는 방법입니다. 리턴값은 실행문을 강제로 종료하는 역할도 합니다.
function 함수이름(){
//실행내용
return 리턴값;
}
var 변수 = 함수명(); //함수호출
Sample1 
함수를 사용하는 기본 예제입니다.
결과
1. 함수가 실행되었습니다.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
//리턴문
function func4(){
var str = "1. 함수가 실행되었습니다.
";
return str;
}
var value = func4();
document.write(value);
</script>
</head>
<body>
</body>
</html>
종료역할 하는 리턴 값
function 함수이름(){
//실행내용
return 리턴값;
//실행내용
}
var 변수 = 함수명(); //함수호출
Sample2
함수를 사용하는 기본 예제입니다.
결과
2. 함수가 실행되었습니다.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
//종료 역할하는 리턴문
function func41(){
document.write("2. 함수가 실행되었습니다.");
return;
document.write("3. 함수가 실행되었습니다."); //실행안됨
}
func41();
</script>
</head>
<body>
</body>
</html>
Sample3
함수를 사용하는 기본 예제입니다.
결과
300
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
//매개변수 + 리턴문
function func5(num1, num2){
return num1 + num2;
}
let result = func5(100, 200);
document.write(result);
</script>
</head>
<body>
</body>
</html>
Sample4
함수를 사용하는 기본 예제입니다.
html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript</title>
</head>
<body>
<div id="galleryZone">
<p><img id="photo" src="img/pic_1.jpg" alt="이미지1" style="width:500px"></p>
<div>
<button onclick="gallery(0)">이전</button>
<button onclick="gallery(1)">다음</button>
</div>
</div>
<script>
let num = 1;
function gallery(direct){
if(direct){
if(num == 8) return;
num++;
} else {
if(num == 1) return;
num--;
}
console.log(num);
let imgTag = document.getElementById("photo");
imgTag.setAttribute("src","img/pic_"+num+".jpg");
}
</script>
</body>
</html>
