개발공부일지
Javascript - 고차함수, 즉시실행함수, 익명함수, 재귀함수, setTimeout / setInterval 본문
목차
1. 고차함수
2. 즉시실행함수, 익명함수
3. 재귀함수
4. setTimeout / setInterval
1. 고차함수
- 함수를 전달받거나 함수를 반환하는 함수 ( 콜백함수를 받는 함수 )
- forEach, array, findIndex, filter, sort
▼ 콜백함수를 받는 경우
function pleaseCallback(tempLog) {
tempLog("고차함수");
}
pleaseCallback(console.log);
pleaseCallback((temp) => {
console.log(temp);
});
▼ 함수 자체를 반환하는(리턴하는) 경우
- higherFunc()을 호출하면 그 리턴값이 console.log 라는 메서드라는것이다.
→ 그래서 higherFunc()("고차함수") 라고 입력한것! (console.log입력하는것처럼)
function higherFunc() {
return console.log;
}
console.log(higherFunc());
higherFunc()("고차함수");
console.log(`higherFunc() == console.log : ${higherFunc() == console.log}`);
▼ sort의 경우
console.log(
[5, 79, 46, 36, 1, 3, 9, 78].sort((a, b) => {
return a - b;
})
);
- 매개변수로 콜백함수를 넣어주어서 고차함수
2. 즉시실행함수, 익명함수
(function () {
})();
- 함수에 이름이 없는 함수를 익명함수라고한다.
- 익명함수는 ()(); 에 넣어 즉시실행함수로 쓸수있다.
- 개념자체로 외우기!
3. 재귀함수
function func2() {
func2();
}
func2();
- 자기 자신을 호출해서 다시 실행하는 함수 (무한반복이 된다)
- 계속 호출해서 스택이 쌓여서 stack overflow가 발생한다. (그래서 끊어주지않으면 계속 호출한다)
▼ 재귀함수 활용해보기
function Func2(num) {
console.log(num);
if (!num) return 0;
Func2(num - 1);
}
Func2(10);
- if문을 사용해서 num울 부정하고 10을 넣었을때 0이 아니니까 자기자신에 -1 을 해서 0이 되었을때 리턴한것(끝난것)
- 제대로 이해하고 재귀함수를 사용하여 피보나치수열 도전해보기 (로직이라도 생각해보기)
** 피보나치수열...
function fibonacci(idx) {}
// [1,1,2,3,5,8,13,21,34]
// fibonacci(7) => 21이 나와야하는거
4. setTimeout / setInterval
- setTimeout
const timeout = setTimeout(() => {
console.log("기다렸다가 1초 뒤에 실행된다");
clearInterval(interval);
}, 1000);
- setInterval
const interval = setInterval(() => {
console.log("1초 동안 반복해서 실행한다");
}, 1000);
- clearTimeout / clearInterval
clearTimeout(timeout);
clearInterval(interval);
- setTimeout 과 setInterval을 멈추게한다.
▽ 교수님께서 보여주신 setTimeout / setInterval test
1번
for (let i = 0; i < 10; ++i) {
setTimeout(() => {
console.log(`test1-${i}`);
//1초를 기다렸다가 한번에 다나온거야
// for문은 그냥 실행되는거야 (for문은 콜스택에 쌓이지않아)
// 콜백함수로 10개가 쌓여있다가 1초뒤에 콜백큐에서 나온거야 -> 비동기
}, 1000 * (i + 1));
// 이렇게 적으면 1초에 하나씩 하나씩
}
2번
setTimeout(() => {
for (let i = 0; i < 10; ++i) {
console.log(`test2-${i}`);
}
}, 1000);
3번
let tempIdx = 0;
const tempInterval = setInterval(() => {
console.log(`test3-${tempIdx++}`);
if (tempIdx > 9) clearInterval(tempInterval);
}, 1000);
★ 오늘의 포인트와 남겨두기 ★
※ 콜백함수 이해하고 넘어가기!!!
→ 매개변수에 함수를 넣을때 콜백함수라고한다.
※ 재귀함수로 피보나치수열 , 하노이의 탑
※ { } 중괄호 없어도 한줄에 적혀있다면 실행이 된다.
for (let i = 0; i < 10; ++i) console.log(i);
*** 앞으로 백엔드, 서버를 배우고 블록체인까지 배워 개발자가 되는 그날까지 화이팅!!!!!!!!!!
** 목표에 대해 생각하자!!!!!
* 만들고 싶은것의 흐름을 생각해보기
'Javascript' 카테고리의 다른 글
Javascript - this, bind, static, closure (0) | 2023.07.13 |
---|---|
Javascript - class, prototype / 객체지향 (0) | 2023.07.12 |
Javascript - event/ addEventListener/ forms/ 템플릿 리터널(template-literal) (0) | 2023.07.10 |
Javascript - 문자열, 숫자 관련 메서드 / new Date/ 구조분해할당/ spread 연산자(...) (0) | 2023.07.07 |
Javascript - 활용해보기 (0) | 2023.07.05 |