์ผ | ์ | ํ | ์ | ๋ชฉ | ๊ธ | ํ |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 | 31 |
- json
- database
- ๋น๋๊ธฐ
- await
- https://m.blog.naver.com/tt2t2am1118/221010125300
- ํผํ
- https://youtube.com/playlist?list=PLuHgQVnccGMA5836CvWfieEQy0T0ov6Jh&si=FTaYv8m21EhO-A2K
- mysql
- ๋๊ธฐ
- addEventListener
- ajax
- sql
- setTimeout()
- promise
- object
- webpack
- async
- db
- js
- eport
- execCommand
- Porject
- callback
- slow and steady
- ๊ฒ์
- JS #ํ๋ก์ ํธ
- ์ฐธ๊ณ ๋ธ๋ก๊ทธ
- Project
- Import
- prj
- Today
- Total
C-log
์ฝ๋ฐฑ ํจ์ ๋ณธ๋ฌธ
๊ธฐ์ ๋ฉด์ ๋ ๋ฐ์ ์ง๋ฌธ์ ํ ๋๋ก ์์ฑํด ๋ณด์๋ค. ๊ต์ฅํ ๊ธฐ์ด์ ์ธ ๊ธฐ์ ์ ๋ฌผ์ด๋ณด๋๋ฐ ์ต๊ด์ ์ผ๋ก ์ฌ์ฉํ๋ค๋ณด๋ ๋ฉด์ ๋ ๋์น๊ฑฐ๋ ๋ช ํํ ๊ธฐ์ตํ์ง ๋ชปํ๋ ๊ฒฝ์ฐ๊ฐ ์์๋ค.
#์ฝ๋ฐฑ ํจ์๋ ๋ฌด์์ธ๊ฐ?
์ฝ๋ฐฑ ํจ์๋ ํจ์๋ฅผ ๋ค๋ฅธ ํจ์์๊ฒ ์ธ์๋ก ์ ๋ฌ ๋์ด ํน์ ์ํฉ์ด๋ ์กฐ๊ฑด์ ๋๋ฌ ํ๋ฉด ํธ์ถ, ์คํ๋๋ ํจ์์ด๋ค. ์ฆ, ์ฝ๋ฐฑ ํจ์๋ ๋ค๋ฅธ ํจ์์๊ฒ ์์ ์ ์์กดํ๊ณ , ๊ทธ ์์ ์ด ์๋ฃ๋์์ ๋ ํด๋น ํจ์์๊ฒ ๊ฒฐ๊ณผ๋ฅผ ์๋ ค์ค๋๋ค.
## ์ฝ๋ฐฑ ํจ์๋ ๋น๋๊ธฐ์ ์ธ ์์ ์ ์ฒ๋ฆฌํ๋ค.
## ๋น๋๊ธฐ
์ฝ๋ฐฑํจ์๋ ๋น๋๊ธฐ์ ์ธ ์์
์ ์ฒ๋ฆฌํ๊ฑฐ๋ ์ด๋ฒคํธ ์ฒ๋ฆฌ, ํ์ด๋จธ ์ค์ , http ์์ฒญ ๋ฑ๊ณผ ๊ฐ์ด ํน์ ํ ์ํฉ์์ ์คํ๋์ด์ผ ํ๋ ์์
์ ๊ตฌํํ ๋ ์ฃผ๋ก ์ฌ์ฉ๋๋ค.
์ฝ๋ฐฑ ํจ์๋ ๋น๋๊ธฐ์ ์ธ ํน์ง์ ์ ์ดํ๊ธฐ ์ํจ์ด๋ค. ์ฆ, ์ฝ๋ฐฑ ํจ์๋ ๋น๋๊ธฐ ์์
์ด ์๋ฃ๋๋ฉด ํธ์ถ๋๋ ํจ์์ด๋ค. ์ด๋ฅผ ํตํด ๋น๋๊ธฐ ์์
์ด ์๋ฃ๋ ํ์ ์ฒ๋ฆฌํ ์์
์ ์ง์ ํ ์ ์๋ค. ๋น๋๊ธฐ ์์
์ด ์๋ฃ ๋๋ฉด ์ฆ์ ๋ค์ ์์
์ ์งํํ ์ ์๋ค.
## ์ฝ๋ฐฑ ํจ์ ์์
// setTimeout์ ์ฌ์ฉํ ์ฝ๋ฐฑ ํจ์
function delayedFunction(callback) {
console.log("์์");
setTimeout(function() {
console.log("3์ด ํ์ ์คํ๋จ");
callback(); // ์ฝ๋ฐฑ ํจ์ ํธ์ถ
}, 3000);
}
// ์ฝ๋ฐฑ ํจ์
function callbackFunction() {
console.log("์ฝ๋ฐฑ ํจ์๊ฐ ์คํ๋จ");
}
// delayedFunction ํธ์ถ
delayedFunction(callbackFunction);
callbackFucntion์ delayedFunction์ ํธ์ถํ๋ ์ฝ๋ฐฑ ํจ์ ์ด๋ค. ๊ทธ๋ฆฌ๊ณ ๋ค์ delayedFunction์์๋ setTimeout์ด๋ผ๋ ๋น๋๊ธฐ ํจ์๋ฅผ ๋ดํฌํ๊ณ ์๋ค.setTimeout์ ๋ ๋ค์ ์ธ์๋ก ํจ์๋ฅผ ํธ์ถํ๊ณ ์๋ค. ์ข ๋ ์ง๊ด์ ์ผ๋ก ์ฝ๋๋ฅผ ์์ ํ๋ฉด ์๋์ ๊ฐ๋ค.
// setTimeout์ ์ฌ์ฉํ ์ฝ๋ฐฑ ํจ์
function delayedFunction() {
console.log("์์");
setTimeout(function() {
console.log("3์ด ํ์ ์คํ๋จ");
function callbackFunction() { // ํจ์ ํธ์ถ
console.log("์ฝ๋ฐฑ ํจ์๊ฐ ์คํ๋จ");
}
callbackFucntion();
}, 3000);
}
// delayedFunction ํธ์ถ
delayedFunction();
ํ์ฌ ์ฝ๋๋ฅผ ์ดํด๋ณด๋ฉด setTimeout์ ์ต๋ช ํจ์๋ฅผ ์ธ์๋ก ๊ฐ์ง๊ณ ์๊ณ ํด๋น ํจ์ ๋ด๋ถ์ callbackFunction์ด ์์ผ๋ฉฐ ํด๋น setTimeout ๋ด๋ถ์์ ํธ์ถ๋๊ณ ์๋ค. ์ฆ, ๋ด๋ถ์ ์๋ callbackFunction์ setTimeout์ ์ธ์๋ก ์ ์๋ ์ต๋ช ํจ์ ์์ ์กฐ๊ฑด์ด ์ถฉ์กฑ ๋ ๋ ํธ์ถ,์คํ ๋๊ธฐ ๋๋ฌธ์ ์ฝ๋ฐฑํจ์๋ก ๊ฐ์ฃผ๊ฐ ๋๋ ๊ฒ์ด๋ค. ์๋์ฝ๋๋ ์ฝ๋ฐฑ ํจ์๋ก ๊ฐ์ฃผํ๊ธฐ ์ด๋ ต๋ค.
function test(){
function call(){
console.log('Call!');
}
call();
}
ํ์ง๋ง ์๋์ ๊ฐ์ด ์ธ์๋ก ์ ๋ฌ์ ํ๊ฒ ๋๋ค๋ฉด ์ฝ๋ฐฑ ํจ์๋ก ๊ฐ์ฃผํ๋ค.
function test(fn){
console.log('true');
call();
}
function call(){
console.log('Call!');
}
test(call);
'๐ ๏ธ๊ธฐ์ ๋๋น' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
DOM, ๋๊ธฐ์ ๋น๋๊ธฐ, Hook, Promise(callback) (0) | 2024.03.15 |
---|---|
API๋ ๋ฌด์์ธ๊ฐ (0) | 2024.03.13 |
setTimeout์ ์ ๋น๋๊ธฐ์ธ๊ฐ? (0) | 2024.03.13 |
ํ๋ ์์ํฌ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ (0) | 2024.01.12 |