모던 자바스크립트 2.15 함수

모던 자바스크립트 2.15 함수

함수

함수는 프로그램을 구성하는 주요 '구성 요소(building block)'

내장함수의 예>

alert(message), prompt(message, default), confirm(question)

함수 선언

function 키워드, 함수 이름, 괄호로 둘러싼 매개변수를 차례로 써주면 함수를 선언할 수 있음

function name(parameters) { ...함수 본문... } name(); //함수 호출

지역변수

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

function showMessage() { let message = "안녕하세요!"; // 지역 변수 alert( message ); } showMessage(); // 안녕하세요! alert( message ); // ReferenceError: message is not defined (message는 함수 내 지역 변수이기 때문에 에러가 발생합니다.)

외부변수

함수 내부에서 함수 외부의 변수인 외부 변수(outer variable)에 접근

함수 바깥에서 함수 내부의 지역변수에 접근하는 건 불가능

let userName = 'John'; function showMessage() { let message = 'Hello, ' + userName; alert(message); } showMessage(); // Hello, John

외부 변수에 접근하는 것뿐만 아니라, 수정도 가능

외부 변수는 지역 변수가 없는 경우에만 사용할 수 있음

let userName = 'John'; function showMessage() { let userName = "Bob"; // 같은 이름을 가진 지역 변수를 선언합니다. let message = 'Hello, ' + userName; // Bob alert(message); } // 함수는 내부 변수인 userName만 사용합니다, showMessage(); alert( userName ); // 함수는 외부 변수에 접근하지 않습니다. 따라서 값이 변경되지 않고, John이 출력됩니다.

매개변수 == 인수(argument)

매개변수(parameter)를 이용하면 임의의 데이터를 함수 안에 전달할 수 있음

함수에 전달된 매개변수는 복사된 후 함수의 지역변수가 됨.

function showMessage(from, text) { alert( from + ': ' + text ); } let from = "Ann"; showMessage(from, "Hello"); // Ann: Hello

기본값

매개변수에 값을 전달하지 않으면 그 값은 undefined

또는

function showMessage(from, text = anotherFunction()) { // anotherFunction()은 text값이 없을 때만 호출됨 // anotherFunction()의 반환 값이 text의 값이 됨 }

이런식으로 기본값 설정가능

또는

function showMessage(text) { if (text === undefined) { text = '빈 문자열'; } alert(text); } showMessage(); // 빈 문자열

if문을 이용해서 빈 문자열이라면 넣어주는 방법도 있음

또는

// 매개변수가 생략되었거나 빈 문자열("")이 넘어오면 변수에 '빈 문자열'이 할당됩니다. function showMessage(text) { text = text || '빈 문자열'; ... }

undefined는 false이므로 ||(OR)연산자를 통해 '빈 문자열'

을 text에 넣어주는 방법도 있음

반환값

함수를 호출했을 때 함수를 호출한 그곳에 특정 값을 반환하게 할 수 있음

function sum(a, b) { return a + b; } let result = sum(1, 2); alert( result ); // 3

지시자 return

함수 내 어디서든 사용 가능. 실행 흐름이 지시자 return을 만나면 함수 실행은 즉시 중단되고 함수를 호출한 곳에 값을 반환

- return 여러개 가능

- return;만 명시도 가능 => return 문이 없는 함수와 동일하게 undefined 반환

from http://jjuunnjuning.tistory.com/80 by ccl(A) rewrite - 2021-11-09 02:27:57