본문 바로가기

개발/javascript&jquery

불필요한 return 사용을 줄이자. void vs return

반응형

불필요하게 return을 쓰는 행위를 줄이자.

void 연산자는 undefined를 반환한다.

 

function click() {
	return setState(false)
} 
function click(message) {
	return alert(mesasge)
}

리액트에 있는 setState, 윈도우 alert 은 void함수이다.
함수의 반환이 존재하지 않는다.
굳이 return을 넣어줄 필요가 없다.
//개선전 코드
function click(message) {

	if(...) {
    	return alert(meeage)
    }
    
    ...some code... 
}

함수를 조작하기 위해서 위와 같이 사용하는 경우가 있음 
이럴 경우에도 반환이 없는 함수에 return을 붙이지 말고 각자 명확하게 구분하는게 좋다.

//개선 후 코드
function click(message) {
	if(...) {
    	alert(meeage)	
    	return 
    }
    
    ...some code... 
}


void 함수에 return을 붙이면 undefined를 리턴한다.
void함수에 return을 붙이면 undefined를 return한다.

function test(num, num2) {
	const result = num + num2
}
test(1,2) //결과 undefined  - 리턴이 없기 때문에


function testtest() {
	return test(1,2)
}
//test가 리턴값이 없기 때문에 return undefined를 할 필요가 없음.

 

 

함수를 사용할때 이 함수의 반환값을 정확히 확인하고 사용하는 것이 좋다.

자바스크립트 내장 객체도 반환값을 확인하고 사용할 수 있다.

예를 들어 배열 push는 반환값이 있음 -  반환 값 = 호출한 배열의 새로운 length 속성

function arrayFunction() {
	const arr = [1,2]
    return arr.push(10)
}

arrayFunction() //결과 반환값 3

 

 

리턴이 항상 있는 경우 활용법 

반환이 항상 있는 경우는 네이밍 부터 추론 가능하게 개발하는게 좋다.

function isAdult(age) {
	return age> 19
}
function getUserName(name) {
	return '유저'+name
}

const isFlag = isAdult(10) //false 
typeof isFlag // boolean

리턴값이 필수로 있는 함수는 변수 값 그 자체로 활용 가능
반응형