Ajax에서 콜백을 사용하면서도 제대로 모르는 것 같아서 강의를 들어봤다.
1. 값으로서의 함수와 콜백
자바스크립트에서는 함수도 객체다. 다시 말해서 일종의 값이다. = 변수에 대입 될 수 있다. 다른 언어의 함수와 다른 점은 함수가 값이 될 수 있다는 점이다.
a = {
b : function() { } // 메소드(method) : 객체 안에 정의되어있는 함수
};
a(객체) b(변수, 속성(property))
함수는 값이기 때문에 다른 함수의 인자로도 전달 될 수 있다.
function cal(func, num) {
return func(num);
} // func에 함수 매개변수를 받아서 사용 가능.
2. 함수의 용도2
배열의 값으로도 저장 가능.
변수, 매개변수, 리턴값으로 사용 가능 : first-class citizen/object/value/entity 다양한 형태로 사용 할 수 있는 데이터를 부르는 말.
3. 콜백
어떠한 함수가 수신하는 인자가 함수인 경우
내장 객체, 내장 메소드 : 자바스크립트가 제공하는 객체 혹은 메소드.
사용자 정의 객체, 사용자 정의 함수 : 사용자가 정의하는 객체 혹은 함수.
4. 비동기 콜백
콜백은 비동기처리에서도 유용하게 사용된다. 시간이 오래걸리는 작업이 있을 때 이 작업이 완료된 후에 처리해야 할 일을 콜백으로 지정하면 해당 작업이 끝났을 때 미리 등록한 작업을 실행하도록 할 수 있다.
* 이메일 발송이 3시간 걸린다면?
중요한 개념
글작성 -> 이메일 발송 -> 작성완료 (3시간) // 동기화
글작성 -> 이메일 발송 예약 -> 작성완료 (1초) // 비동기화, 백그라운드에서 이메일 발송을 실행함.
Ajax 비동기 처리, asynchronous javascript and XML
$.get(url, function(result) {
console.log(result);
}, 'json');
1. url
2. 함수 : 서버와 통신한 결과로 호출 되도록 기대하는 함수 = 콜백 함수
- result > 서버에서 가져온 객체(url)에 대한 정보
- 비즈니스 로직
비동기 처리가 제대로 이해가 안된다.
얄팍한 코딩사전 ㅋㅋ 진짜 좋아하는 채널
정확하게는 아니지만 그래도 어느정도 감이 온다.
Ajax sucess <-> done 메소드 차이가 뭘까?
아임포트를 사용하면서
IMP.request_pay({
/* ...중략... */
}, function (rsp) { // callback
if (rsp.success) { // 결제 성공 시: 결제 승인 또는 가상계좌 발급에 성공한 경우
// jQuery로 HTTP 요청
jQuery.ajax({
url: "https://www.myservice.com/payments/complete", // 가맹점 서버
method: "POST",
headers: { "Content-Type": "application/json" },
data: {
imp_uid: rsp.imp_uid,
merchant_uid: rsp.merchant_uid
}
}).done(function (data) {
// 가맹점 서버 결제 API 성공시 로직
})
} else {
alert("결제에 실패하였습니다. 에러 내용: " + rsp.error_msg);
}
});done 메소드를 처음봤는데 똑같이 적용하려니까 이상하게 성공시 계속 값이 넘어가지 않았다.
IMP.request_pay({
pg : 'inicis',
pay_method : 'card',
merchant_uid : muid,
name : '',
amount : final_price,
buyer_email : '<%=memberVO.getMember_email()%>',
buyer_name : '<%=memberVO.getMember_name()%>',
buyer_tel : '<%=memberVO.getMember_phone()%>',
buyer_addr : '<%=memberVO.getMember_loc()%>',
buyer_postcode : '<%=memberVO.getMember_zipcode()%>'
}, function(rsp) {
if ( rsp.success ) {
//[1] 서버단에서 결제정보 조회를 위해 jQuery ajax로 imp_uid 전달하기
jQuery.ajax({
url: "/setak/insertOrder.do", //cross-domain error가 발생하지 않도록 주의해주세요. 결제 완료 이후
type: 'POST',
traditional : true,
dataType: 'json',
data: {
imp_uid : rsp.imp_uid,
'member_id' : member_id,
'order_price' : final_price,
'order_payment' : 'card',
'order_phone' : phone,
'order_cancel' : '0',
'order_status' : '결제완료',
'order_name' : human,
'order_address' : addr,
'order_request' : request,
'order_zipcode' : postcode,
'order_muid' : muid,
'usePoint' : usePoint,
'useCoupon' : useCoupon,
'defaultAddrChk' : defaultAddrChk
//기타 필요한 데이터가 있으면 추가 전달
},
success : function(data) {
var num = data.order_num;
location.href='<%=request.getContextPath()%>/orderSuccess.do?order_num='+num;
}
});
}근데 이런 식으로 변경해주니까 잘 넘어갔다. 이유를 정확하게 모르겠네.
일단 동작 순서는
success > complete > done > always : 성공시
error > complete > fail > always : 실패시
done을 사용하는게 더 깔끔하다는 거랑 그냥 사람 차이라는 거랑 길게 설명해준 글이랑 다 봐봐도..
댓글