[JavaScript] 함수 Basic / 매개변수와 인자 / 리턴

안녕하세요, 코린이의 코딩 학습기 채니 입니다.

 

오늘은 함수에 대하여 개념 정리를 해보려고 합니다.

챕터는 총 3개로 나뉘어 있습니다.

---

* Basic (함수의 원리)

 

함수를 사용하는 이유 

 

1. 코드에 대한 함수 이름을 지정하여 동일한 코드가 반복되지 않고 최소한으로 간단하게 만들어주기 위함
2. 코드가 변경되었을 때 (ex. color:red; -> color:blue;) 함수 내에서만 변경해주면 일일이 수정 필요 없이 변경 가능
3. 반복문 사용이 불가할 때 (비연속적으로 반복될 때, 반복되는 중복이 굉장히 많을 때) 함수를 이용하여 해결 가능

function

function 함수 이름() { ~ }을 이용하여 함수 설정

{ ~ }에 기입되어있는 코드를 함수로 설정하여 비연속적 반복문 해결 가능

실행결과

 

---

* 매개변수와 인자 (Parameter & Argument)

 

1+1+'<br>'을 onePlusOne 함수로 설정하여 2의 값을 출력하게 해 주었습니다.

매개변수를 활용하여,

함수를 실행할 때 입력값을 주면 함수가 입력값에 따라서 다른 결과를 출력하게 만들어보았습니다.

 

function sum(매개변수, 매개변수)

function sum(left, right) --> left 값은 2, right 값은 3

※ document.write(left+right+'<br>'); --> 2+3+'<br>'로 처리됨.

실행결과

---

* 리턴 (Return)

 

Return을 사용하는 이유

1. 변경하고자 하는 함수의 값이 많을 경우, 수많은 함수의 값을 만들어서 적용시켜야 하는 번거로움을 줄여주기 위함
   (ex. 색상을 추가하거나, 글씨 크기를 변경시키거나, 색을 변경시킬 때 등마다 함수를 만들어줘야 함.)
2. ex) function(){} 밖에서 sum(left, right) 값을 활용하기 위한 것

 

실행결과

이와 같이, return을 이용하여 다양한 용도로 함수를 활용할 수 있게 되었습니다.