javascript 4. 함수

 

1. 함수

parameter : 매개변수

function name (parameter1, parameter2, ...) {
	//함수 본문
}

- 함수 내에서 선언한 변수 인 지역 변수(local variable)은 함수 안에서만 접근 가능

function showMessage() {
	let message = "안녕하세요!"; //지역 변수
    
    alert( message );
}

showMessage(); //안녕하세요!

alert ( message ); //ReferenceError: message is not defined
//message는 함수 내 지역 변수이기 때문에 에러 발생!!

함수 내부에서 외부 변수에 접근 가능, 수정 가능

let userName = 'John'

function showMessage() {
	userName = "Bob" //외부 변수를 수정함
    
    let message = 'Hello, ' + userName
    alert(message)
}

alert( userName ) //함수 호출 전이므로 John이 출력됨

showMessage()

alert( userName ) //함수에 의해 Bob으로 값이 바뀜

 

기본값(default value) 설정

매개 변수에 값을 전달하지 않아도 그 값이 undefined 가 되지 않는다.

function showMessage(from, text = "no text given"){
    alert(from + ":" +text)
}

showMessage("Ann")

 

반환 값 (return value)

function sum(a, b){
	return a + b
}

let result = sum(1, 2)
alert(result) // 3

 

return 지시자만 있는 경우 undefined를 반환한다.

return 과 값 사이에 절대 줄을 삽임 금지. (자바스크립트에서는 줄 바꿈에 세미콜론의 기능을 부여하기 때문)

 

함수 이름 짓기

get... 값을 반환

calc... 무언가를 계산

create... 무언가를 생성

show... 무언가를 보여줌

check... 무언가를 확인하고 boolean 값을 반환

 

모든 구문의 끝에는 세미콜론 (;)을 붙여 주는 게 좋다. 

2. 함수 표현식

함수 선언문: 코드 블록이 실행되기 전에 처리 > 블록 내 어디서든 활용 가능

function sayHi() {
    alert ("Hello");
}

 

함수 표현식: 실행 흐름이 표현식에 다다랐을 때 만들어짐

let sayHi = function() {
    alert ("Hello");
};

 

 

3.  화살표 함수 =>

let func = (arg1, arg2, ...) => {expression}

여러 줄일 경우 { } 사용, 생략 가능.

 

4.  나머지 매개변수와 스프레드 문법

 

나머지 매개변수 

...나머지가모인배열이름

: 남아있는 매개변수들을 한데 모아 배열에 집어 넣어라.

: 나머지 매개변수는 항상 마지막에 있어야 한다. 

- 인수의 개수에 제한이 없는 함수를 만들 때  사용

 

Math.max

인수로 받은 숫자 중 가장 큰 숫자를 반환

 

스프레드 문법 (spread syntax)

... 이 함수 호출 시 사용 또는 기타 경우 

배열을 목록으로 확장해 줌

다수의 인수를 받는 함수에 배열을 전달할 때

 

 

소감

어려운 부분을 끝까지 잡고 있지 않아서 그런지 쉽게 쉽게 챕터를 넘기는 중이다. 

설명이 미비하게 적어 둔 부분은 나중에 이해 가능할 때 다시 읽고 보충하자. 파이팅.

 

 

 

 

 

 

스파르타 코딩클럽 내일배움캠프 사전캠프 자료

javascript handbook 에서 발췌