[preview] Javascript 함수의 기본형태

Jinsol Kim·2022년 11월 12일
0

항해99_TIL

목록 보기
5/10

1. 학습 진행 상황

  • 프로그래밍에서 함수를 사용하는 이유를 안다.
  • 익명 함수와 선언적 함수의 차이를 안다.
  • 매개변수와 리턴값을 활용하여 기본적인 함수 예제를 해결할 수 있다 (p.203)
  • 매개변수 자료형에 따라 다르게 작동하는 min()함수 예제의 코드 실행 논리를 이해할 수 있다 (p.209)

2. 학습 중 발생한 이슈∙고민 또는 이를 해결한 내용

  • 매개변수의 자료형을 종합해서 최솟값을 구하는 예제 코드 노이해 (p.209)
ⓐ   function min(first, ...rests) {
	    let output
    	let items
    
ⓑ   if (Array.isArray(fist)) {
ⓒ     output = first[0]
ⓓ     items = first
ⓔ   else if (typeof(first) === 'number') {
ⓕ     output = first
ⓖ     items = rests
   }


   // 최솟값을 구하는 공식
   
   for (const item if items) {
   	if (output > item) {
    output = item
    }
   }
   return output
  }
  
 console.log(`min(배열): ${min([52,273,32,103,275,24,57])}`)
 console.log(`min(숫자, ...) : ${min(52,273,32,103,275,24,57)}`)

ⓐ function min의 매개변수는 외부로부터 받아오는 값
ⓑ 매개변수로 들어온 자료형이 배열인지 숫자인지 확인
ⓒ 매개변수의 자료형이 배열이라면, output = first[0] 배열의 첫번째 값이 됨 (52)
ⓓ 함수에 매개변수와 나머지 매개변수가 함께 사용되었기 때문에, first배열 전체가 items에 들어감
ⓔ 매개변수의 자료형이 숫자라면,
ⓕ output = first → first는 매개변수의 첫번째 숫자를 의미함 (52)
ⓖ 52를 제외한 나머지 숫자들은 rests에 들어감


3. 오늘 새로 배운 내용

  • 함수가 '코드의 집합'인 이유는 중괄호 {...} 내부에 코드를 넣기 때문이다.

  • 함수를 사용하는 이유는
    ① 반복되는 코드를 한 번만 정의해놓고 필요할 때마다 호출 가능하고
    ② 함수를 기능별로 작성하면 '모듈화'로 전체 코드의 가독성 좋아지고
    ③ 기능별(함수별)로 수정이 가능하므로 유지보수가 쉽기 때문이다.

  • 매개변수와 리턴값 : input이 매개변수, output이 리턴값

 function 함수 (매개변수) {
   let output = 초깃값
   처리한다               (ex. for 반복문, if 구문 등)
   
   return output
 }
  • 최솟값을 구하는 함수 (p.205)
①  function min(array){
②    let output = array[0]
③	 for (const item of array) {
④	  	 if (output > item) {
⑤        output = item
       }
     }
⑥   return output
   }

  const testArray = [52,273,32,103,275,24,57]
  console.log(`${testArray} 중에서`)
  console.log(`최솟값= ${min(testArray)}`)

① 매개변수 자리에 배열로 들어간다.
② output을 배열의 첫번째 요소로 설정한다. (array의 [0]번째 인덱스 = 52)
③ const item of array 에서 배열값이 하나씩 나열됨 (52,273,32, ... ,57)
④ 만약 output 이 item 보다 크다면
⑤ 최솟값을 구해야 하므로 output의 값이 보다 작은 값의 item값으로 변경됨
⑥ 나머지 숫자들을 모두 비교 후에, 24 > 57 이므로 최솟값은 24로 리턴된다.


4. 참고

  • 혼자 공부하는 자바스크립트 : 챕터 5-1 함수의 기본형태
  • 10조 D반 스터디원

5. Takeaway

  • 이해되지 않으면 먼저 외우고 나중에 이해하자!
  • a부터 b까지 더하는 함수
  • 최솟값을 구하는 함수
  • 매개변수 자료형에 따라 다르게 작동하는 min() 함수

0개의 댓글