목차
- return 예제 - 함수 결과값 반환
- return 정의
- return 구문
- return 예제 - 문자열 반환
- return 예제 - 숫자 연산 결과 반환
- return 예제 - 반환값이 함수인 경우
- return false 의미 (onclick 경우) ★
return 예제 - 함수 결과값 반환
<p id="demo"></p>
<script>
function homzzang() {
return Math.PI;
}
document.getElementById("demo").innerHTML = homzzang();
</script>
결과보기 (결과값: 3.141592653589793)
return 정의
함수 실행 종료 후, 함수 결과값을 함수 호출 지점으로 반환.
1.
함수 배우기 : 함수정의, 매개변수, 함수호출, 클로저 등.
2.
- 함수 안에서 return 명령어로 값을 반환하면 변수에 할당 가능.
- 함수 안에서 출력 명령어로 값을 출력시키면 변수에 할당 불가.
- return 뒤 반환값은 줄바꿈 X (※ 줄바꿈하려면, 값을 중괄호로 감싸야 함.) (∵ return 명령어는 자동 세미콜론(;) 삽입 영향 받기 때문.)
- 함수는 return 지점에서 즉시 실행 멈추고, 함수 호출 지점으로 이동함.
- 반환값으로 함수도 가능.
3.
- JS 버전 : ECMAScript 1
- 모든 브라우저 지원.
4. MDN return 예제 보기
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return
return 구문
return value;
[매개변수]
value
선택. 함수 호출자에게 반환될 값 지정. (생략 시, undefined 반환)
return 예제 - 문자열 반환
<p id="demo"></p>
<script>
function homzzang(name) {
return "홈짱닷컴 " + name;
}
document.getElementById("demo").innerHTML = homzzang("Homzzang.com");
</script>
결과보기
return 예제 - 숫자 연산 결과 반환
<p id="demo"></p>
<script>
var x = homzzang(3, 4);
function homzzang(a, b) {
return a * b;
}
document.getElementById("demo").innerHTML = x;
</script>
결과보기 (결과값: 12)
return 예제 - 반환값이 함수인 경우
function homzzang(x,y) {
return function plus(x,y) { return x + y };
}
var hz = homzzang();
document.write(hz(3,4)); // 7
결과보기 (결과값: 7)
return false 의미 (onclick 경우) ★
1.
<a href="https://homzzang.com">클릭1</a>
href 속성값으로 바로 이동.
2.
<a href="https://homzzang.com" onclick="alert('홈짱닷컴');">클릭2</a>
onclick 속성값 코드 먼저 수행 후, href 속성값으로 이동.
3. ★
<a href="https://homzzang.com" onclick="alert('홈짱닷컴'); return false;">클릭3</a>
onclick 속성값 코드 먼저 수행 후 실행 종료. (※ href 속성값으로 이동 안 함.)
4.
<a href="#" onclick="alert("홈짱닷컴");">클릭4</a>
onclick 속성값 코드 먼저 수행 후, href 속성값으로 이동하는데,
목적지에 해당하는 ID가 없어, 브라우저는 갈 곳을 잃어 페이지 맨상단으로 이동.
5
<a href="#" onclick="alert("홈짱닷컴"); return false;">클릭5</a>
onclick 속성값 코드 먼저 수행 후 실행 종료. (※ href 속성값으로 이동 안 함.)
href 속성값으로 이동을 안 하므로, 페이지 맨 상단으로 이동도 안 하게 됨.
결과보기
참고: 손꽁쥐 님 (190414) https://ggmouse.tistory.com/418