화살표 함수와 표현식 문

omnigi·2022년 2월 7일
0

Typescript Do it

목록 보기
8/23

TSC에서 화살표 함수의 몸통은 중괄호를 생략해도 괜찮습니다.

const arrow1 = (a: number, b:number):number =>{return a + b} // 실행문 방식
const arrow2 = (a: number, b:number):number =>a + b //표현식 문 방식

중괄호 사용 여부에 따라 실행문 방식과 표현식문 방식으로 달라집니다.

실행문과 표현식 문

프로그래밍 언어는 실행문 지향 언어와 표현식 지향 언어로 구분되어 왔습니다.
C가 대표적인 실행문 지향 언어이고, 스칼라가 대표적인 표현식 지향 언어입니다. 자바스크립트는 흥미롭게도 ES5는 실행문 지향 언어이지만 ESNext부터는 실행문과 표현식 문을 동시에 지원합니다. 이런 언어를 다중패러다임 언어 라고 합니다.

실행문이 실행된 결과를 알려면 반드시 return 키워드를 사용해야 합니다. 반면에 표현식 문은 return키워드를 사용하지 않아도 알려줍니다.

변수에 값을 대입하는 것은 대표적인 실행문입니다. 이런 코드는 변수x에 값1을 설정하는 작업만으로 충분합니다.

let x
x = 1

복합 실행문

프로그래밍 언어에서 if와 같은구문은 다음처럼 조건을 만족하면 단순히 한줄의 실행문만을 실행하는 형태로 설계합니다.

if(조건식)
   실행문

복합 실행문은 컴파일러로 하여금 여러 실행문을 한개처럼 인식하게 합니다.

if(조건식){
	실행문1
    실행문2
}

함수 몸통과 복합 실행문

function 키워드로 만드는 함수는 반드시 몸통을 중괄호{}로 감싸야 하는데, 여기서 중괄호는 앞에서 설명한 복합 실행문을 의미합니다. 따라서 함수 몸통은 여러 줄로 구현할 수 있습니다.

function f() {
	let x = 1, y = 2
    let result = x + y +10
    return( console.log(result) )
} //13

return키워드

실행문은 return키워드가 없으면 결과를 알려주지 않습니다.
return키워드는 함수 몸통에만 사용해야하는 제약이 있습니다.

표현식 문 스타일의 화살표 함수 구현

const isGreater = (a: number, b: number):boolean =>{
	return a > b; 
} // 실행문

const isGreater2 = (a2: number, b2: number):boolean => a2 > b2;
//표현식 문

표현식 문에는 세미콜론을 생략할 수 있고, 관습적으로 붙이지 않습니다.

0개의 댓글