TIL 3일차 자바스크립트 함수

오늘은 미니프로젝트 제목 부분만 조금 변경하고

개인 공부로 자바스크립트 5강을 공부했다.

 

1. 익명함수와 선언적 함수

자바 공부할 때는 선언 함수를 주로 썼었는데, 이 책에서는 익명 함수에 대해 자세히 나오고,

훗날을 위해 익명 함수로 코드를 작성할 것을 추천한다.

그래서 보고 따라할 때도 const ... = function(,,,) 이런 식으로 쓰려고 노력했다.

전에도 연습했던 isLeapYear()를 또다시 도전했는데, 한번에 풀 수는 없었다.

리턴 값이 &&나 || 같은 논리연산자로 묶여 있으면 굳이 괄호로 한 번 더 묶어줄 필요는 없다.

a부터 b까지 더하거나 곱하는 함수, 그리고 최소, 최댓값 구하는 함수는 쉬웠다.

 

2. 매개변수

 1) 가변 매개변수는 매개 변수 개수가 고정적이지 않을 때 쓰고,

자바스크립트에서 이 함수를 구현할 때 나머지 매개변수 rest parameter를 쓴다.

형태: function sample (...items)

 

 2) 나머지 매개변수와 일반 매개변수 조합할 때 형태:

function sample (first, second, ...rests)

 

 3) 매개변수로 들어온 자료형이 배열인지, 숫자인지 모를 때 확인 먼저 하기: Array.isArray()

function sample (first, ...rests) {

 let output

let items

 

if(Array.isArray (first)) {

 output = first[0]

 items = first

} else if (typeof (first) === "number") {

 output = first

 items = rests

}

이 다음으로 최솟값 구하는 공식을 쓰면 된다.

}

 

4) 전개연산자 spread parameter: 배열을 전개해서 함수의 매개변수로 전달해준다.

형태: function sample (...items)

 

5) 기본 매개변수

형태: function earnings (name, wage = 9120, hours = 35)

earning("kevin")

 

 

3. 콜백 함수

배경지식: 자바스크립트의 익명함수 (=람다)

콜백 함수란, 매개변수로 전달하는 함수를 지칭한다. 간단히 말해 함수 속 함수이다.

콜백 함수를 활용하는 함수의 예시로, forEach(), map(), filter() 를 배웠다.

forEach()는 배열 내부의 요소를 사용해서 콜백 함수를 호출해준다.

map()은 콜백 함수에서 리턴한 값들ㅇ르 기반으로 새로운 배열을 만들어 준다.

filter()는 콜백 함수에서 리턴하는 값이 true 인 것들만 모아서 새로운 배열을 만든다.

이들처럼 배열이 갖고 있는 함수(메소드) 중에서 콜백 함수를 활용하는 메소드의 형태는,

function (value, index, array) 이고, 이는 순서에 따라서 작성하면 되는 거라 생략할 수도 있다.

 

단순한 형태의 콜백함수인 경우, 화살표 함수로 생성할 수도 있다.

형태 예시: array.map((value) => value*value)

 

또한 어떤 메소드가 리턴하는 값을 기반으로 함수를 줄줄이 사용하는 것을 메소드 체이닝 method chaining이라고 한다.

형태 예시:

numbers

 .filter((value) => value % 2 !== 0)

 .map(())

 .forEach(())

 

덧붙여, 타이머 함수도 배웠다.

특정 시간마다 콜백 함수를 호출하는 setInterval(function,time), 제거하는 clearInterval(...)

특정 시간 후에 콜백 함수 호출하는 setTimeout(function, time), 제거하는 clearTimeout(...)

솔직히 이 부분까지 머리에 넣을 필요는 없을 것 같아서, 이런 게 있구나 하고 넘겼다.

 

마지막에는 같은 블록 안에 같은 이름의 태그를 사용했을 때 (= 같은 단계에 스코프 scope가 있을 때)

생기는 충돌을 줄이고자 즉시 호출 함수를 생성한다는 것에 대해 배웠다.

이를 내부 변수가 외부 변수를 가리는 현상, 즉 섀도잉 shadowing한다고 하고,

블록{}을 사용하거나 함수 블록으로 사용하는 방법이 있다.

 

오늘 5강을 전부 끝내고 자지 못하는 게 아쉽지만

내일 아침에 엄격 모드, 익명 함수에 대해 조금 더 공부하고 예제도 풀어봐야겠다.

 

내일은 미니프로젝트 제출물을 완성해야 해서 조금 바쁠 것 같다.