JS기초_4.2(함수 고급)

자바스크립트 함수의 특성

콜백 함수

함수 안에 함수를 넣는다

• forEach() : 배열 내부의 요소를 사용해 콜백 함수 요청
• map() : 콜백 함수에서 리턴한 값들을 기반으로 새로운 배열을 만든다
• filter() : 콜백 함수에서 리턴하는 값이 true인 것들만 모아서 새로운 배열을 만든다

화살표 함수

단순 콜백 함수를 쉽게 입력하기 위해 사용. function 키워드 대신 (=>)를 사용.

(매개변수) => {

}

(매개변수) => 리턴값

 

타이머 함수

함수 이름	설명
setTimeout(함수, 시간)	특정 시간 후에 함수를 한 번 호출
setInterval(함수, 시간)	특정 시간마다 함수를 호출
clearTimeout(타이머_ID)	setTimeout() 함수로 설정한 타이머 제거
clearInterval(타이머_ID)	setInterval() 함수로 설정한 타이머 제거

*타이머ID는 setTimeout / setInterval 함수를 호출했을 때 리턴값으로 나오는 숫자

 

더 알아보기

1. 즉시 호출 함수
2. 즉시 호출 함수 문제 해결하기
3. 엄격모드
   자바스크립트는 오류를 무시하는 경우가 있는데 실수로 이어질 수 있기 때문에
   엄격모드를 사용한다. 엄격 모드를 적용하고 싶은 블록 위쪽에 다음을 입력. 'use strict' 
4. 익명함수와 선언적 함수의 차이
   익명 함수는 우리가 코드를 읽을 때와 같은 순서로 함수가 선언.
   선언적 함수는 우리가 코드를 읽는 순서와 다르게 함수 선언.
   함수가 같은 이름으로 덮어씌워지면 위험하기 때문에 익명 함수를 선호.

 

키워드 정리

• 콜백 함수한 매개 변수로 전달하는 함수를 의미
• 화살표 함수란 익명 함수를 간단하게 사용하기 위한 목적으로 만들어진 함수 생성 문법.
  () => {} 형태로 함수를 만들고, 리턴값만을 가지는 함수라면 () => 값 형태로 사용할 수 있다.
• 즉시 호출 함수란 변수의 이름 충돌을 막기 위해 코드를 안전하게 사용하는 방법
• 자바스크립트의 문법 오류를 더 발생시키는 엄격 모드는 실수를 줄일 수 있는 방법.
  'use strict'라는 문자열을 블록 가장 위쪽에 배치해서 사용할 수 있다.

Q1. filter 함수의 콜백 함수 부분을 채워서 홀수만 추출, 100 이하의 수만 추출, 5로 나눈 나머지가 0인 수만 추출

let numbers = [273, 25, 75, 52, 103, 32, 57, 24, 76]

numbers = numbers.filter((x) => x % 2 !== 0)

numbers = numbers.filter((x) => x <=100)

numbers = numbers.filter((x) => x % 5 === 0)

console.log(numbers)

//출력
[ 25, 75 ]

 

Q2. 다음 코드를 forEach 메소드를 사용하는 형태로 변경

const array = ['사과', '배', '귤', '바나나']

console.log('#for in 반복문')
array.forEach((item, index, array) => {
    console.log(`${index}`)
})

console.log('#for of 반복문')
array.forEach((item, index, array) => {
    console.log(`${item}`)
})

//출력
#for in 반복문
0
1
2
3
#for of 반복문
사과
배
귤
바나나