* void & return
- void : 함수의 반환이 없다.
- return : 함수가 무언가를 반환한다.
* 예시로 보는 void와 return
function handleClick() {
return setState(false);
}
function showAlert(message) {
return alert(message);
}
- setState함수와 alert함수를 void함수이다. 따라서 함수의 반환이 존재하지않는다.
- 따라서 return을 넣어주지 않아도 된다.
- 굳이 반환이 없는데 return을 사용할 필요가 없다.
- undefined가 return된다.
* JavaScript는 기본적으로 아무런 return이 없을때는 undefined를 return한다.
function test(sum1, sum2) {
const result = sum1 + sum2
return
}
test(1, 2); // undefined
// return이 없으므로 undefined가 출력된다.
- 반환값이 없는 경우엔 굳이 return을 붙일 이유가없다.
* return이 없는 함수를 호출해서 return해보기
function testVoidFunc() {
return test(1, 2);
}
testVoidFunc(); // undefined
[참고] 항상 내가 사용하고있는 api들이 return이 있는지 없는지 확인할 것
* JavaScript에는 void연산자가 존재한다.
다만 우리가 함수에 따로 붙이지 않을 뿐이다.
[참고] https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/void
MDN 사이트안에 가서 찾아보면 반환값이 있는가 없는가에 대한 내용이 다 명시되어 있다.
ex) push메서드는 반환 값으로 호출한 배열의 새로운 length를 반환한다.
[결과적으로]
* 반환이 항상 있어야 되는것들은 함수naming부터 추론이 가능하고 해당 함수를 누군가 만들었을때
사용하는 사람들도 값으로써 잘 활용할 수 있다.
* 함수를 사용할 때 부터 인자를 잘 다루고 인자를 어떻게 명시적으로 사용하는가 그리고 함수가 반환하는게 있는지 없는지도 참고하여 함수를 사용한다.
* 전혀 반환이 없는 함수를 무의미하게 반환하는 행위도 줄인다.
* return값을 활용 예시
function isAdult(age) {
return age > 19;
}
function getUserName(name) {
return '유저 ' + name;
}
const isFlag = isAdult(10)
console.log(isFlag); // false
typeof isFlag // boolean
* return을 early return으로 사용하는 예시
function handleClick() {
if ( // some code) {
setState(false);
return; // early return
}
'Study > JavaScript(Clean code)' 카테고리의 다른 글
[JavaScript][clean-code] Callback Function (0) | 2022.06.15 |
---|---|
[JavaScript][clean-code] 화살표 함수 (Arrow function) (0) | 2022.06.13 |
[JavaScript][clean-code] Rest Parameters (0) | 2022.06.13 |
[JavaScript][clean-code] default Value / default parameter (0) | 2022.06.12 |
[JavaScript][clean-code] 복잡한 인자 관리하기 (0) | 2022.06.12 |