자바스크립트(함수)

수민·2022년 9월 29일
0

프론트엔드

목록 보기
26/48

매개변수 vs 인자
이 강의에서 "매개변수"와 "인수"라는 단어를 같은 의미로 사용하는 것을 듣게 될 겁니다.

엄밀히 말하자면 이 둘은 차이가 있습니다.

매개변수는 함수를 정의할 때 괄호 안에 지정하는 변수입니다.

function sayHi(name) { ... }
이 예시에서 name은 매개변수입니다.

인수는 함수를 호출할 때 함수에 전달하는 구체적인 값입니다.

sayHi('Max');
매개변수 name 에 대해 'Max' 는 함수의 인수 입니다.

두 개념은 매우 밀접하게 연결되어 있으므로 저는 종종 "함수가 받는 인수를 정의하자" 라는 식으로 말할 겁니다. 왜냐하면 결국 함수의 인수를 정의한다는 것은, 해당 매개변수를 설정한다는 뜻이기 때문입니다 (그 반대의 경우도 마찬가지입니다).

함수가 객체라는것을 알고있어야 한다.

화살표 함수의 경우 사용할 수 있는 몇 가지 다른 구문이 있습니다 - 다음은 이에 대한 요약입니다.

중요한 참고 사항. 이 글의 끝 부분에 있는 "함수는 객체만 반환"하는 특수 사례를 놓치지 마세요!

1) 기본 구문:

const add = (a, b) => {
const result = a + b;
return result; // like in "normal" functions, parameters and return statement are OPTIONAL!
};
주목하실 만한 사항. 마지막의 세미콜론, 함수 키워드 없음, 매개변수/인수의 괄호.

2) 정확히 하나의 매개변수를 받는 경우 더 짧은 매개변수 구문.

const log = message => {
console.log(message); // could also return something of course - this example just doesn't
};
주목하실 만한 사항. 매개변수 목록의 괄호는 생략할 수 있습니다(정확히 하나의 인수에 대해).

3) 인수를 받지 않은 경우 빈 매개변수 괄호.

const greet = () => {
console.log('Hi there!');
};
주목하실 만한 사항. 괄호를 추가해야 합니다(생략할 수 없음)

4) 정확히 하나의 표현식이 사용되는 경우 더 짧은 함수 본문.

const add = (a, b) => a + b;
주목하실 만한 사항. 중괄호 및 return 문 생략 가능, 표현식 결과는 항상 자동 반환

5) 함수가 객체를 반환합니다(4)의 예시와 같이 구문이 단축됨).

const loadPerson = pName => ({name: pName });
주목하실 만한 사항. 객체에 대한 추가 괄호가 필요합니다. 그렇지 않으면 중괄호는 함수 본문을 구분하는 기호로 해석되므로 구문 오류가 발생하게 됩니다.

마지막 예시는 헷갈릴 수 있습니다. 보통 JavaScript에서 중괄호는 항상 정확히 하나의 의미를 가질 수 있습니다.

const person = { name: 'Max' }; // 이 중괄호는 객체 생성에 쓰임
if (something) { ... } // 중괄호로 if 문 블록을 표기함
그러나 화살표 함수를 사용할 경우, 중괄호는 두 가지 의미를 가질 수 있습니다.

1) 함수 본문 표시(기본 형식에서)

2) 반환하려는 객체 생성(짧은 함수 본문 형식으로)

JavaScript에 수행하려는 작업을 "알리려면" 위에 표시된 것처럼 표현식(예: 객체 생성)을 괄호로 묶으세요.

REST연산자

더하기
뺴기

함수안에 함수를 생성할수있다.
숫자를 검사하는 함수를 생성해
조금더 효율적으로 함수를 구성할수있다.

profile
헬창목표

0개의 댓글