[JS] 콜백함수 정리

콜백함수

- 정의 : 함수에 파라미터로 들어가는 함수

- 용도 : 순차적으로 실행하고 싶을 때 사용

 

 

document.querySelector('.button').addEventListener('click',function(){
	"버튼 누르면 이 코드 실행해주세요~"
})

 

이벤트를 넣고 싶을 때 .addEventListener() 사용. 

addEventListener() 소괄호가 있으니까 함수임. 

addEventLstener('click', function() {} ) 파라미터로 함수를 사용함 -> 이것을 콜백함수라고 부름 

 

 

+ 다른데서 만든 함수도 콜백함수로 넣을 수 있음

document.querySelector('.button').addEventListener('click',function 함수명)

function 함수명(){}

 

+ 콜백함수에 함수명 쓸데없이 작명할 순 있음

document.querySelector('.button').addEventListener('click', function 함수명(){} )

----

setTimeout 함수에도 사용함

setTimeout(function(){
	"1초 후에 이런 코드 실행해주세요~"
}, 1000 )

 

** 콜백함수는 콜백함수가 필요한 함수들에만 사용가능함

 

대표적으로 

addEventListener

 

 

콜백함수의 원리

 

function first(파라미터){
	파라미터()
}

function second(){

}

first(second)

 

>>마지막 first(second) 잘보기 

     해석 : first 함수안의 코드 실행해주세요~ 근데 파라미터에 second 집어넣어서요 

 

first 파라미터 자리에 second 가 들어감 

그럼 first 함수 -> second 함수 실행됨