SeouliteLab

jQuery의 callbacks.fireWith() 메서드: 컨텍스트 지정하여 콜백 함수 실행하기 본문

프로그래밍

jQuery의 callbacks.fireWith() 메서드: 컨텍스트 지정하여 콜백 함수 실행하기

Seoulite Lab 2024. 3. 27. 11:08

jQuery의 callbacks 객체는 콜백 함수들을 관리하고 실행하는 데 사용됩니다. callbacks.fireWith() 메서드는 지정된 컨텍스트에서 콜백 함수를 실행합니다. 이를 통해 콜백 함수를 특정 객체의 메서드로 실행하거나, 특정 컨텍스트에서 실행할 수 있습니다.

예제 1: 컨텍스트를 지정하여 콜백 함수 실행하기

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery callbacks.fireWith() 메서드 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
  var callbacks = $.Callbacks();
  var context = {
    message: '컨텍스트 메시지'
  };
  // 콜백 함수 정의
  function callback1() {
    console.log('컨텍스트:', this.message);
  }
  // 콜백 함수 등록
  callbacks.add(callback1);
  // 컨텍스트를 지정하여 콜백 실행
  callbacks.fireWith(context);
});
</script>
</head>
<body>

</body>
</html>
<!-- 출력 결과 -->
<!-- 컨텍스트: 컨텍스트 메시지 -->

예제 2: 다른 컨텍스트에서 콜백 실행하기

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery callbacks.fireWith() 메서드 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
  var callbacks = $.Callbacks();
  var context1 = {
    message: '컨텍스트 1 메시지'
  };
  var context2 = {
    message: '컨텍스트 2 메시지'
  };
  // 콜백 함수 정의
  function callback1() {
    console.log('컨텍스트:', this.message);
  }
  // 콜백 함수 등록
  callbacks.add(callback1);
  // 다른 컨텍스트에서 콜백 실행
  callbacks.fireWith(context1);
  callbacks.fireWith(context2);
});
</script>
</head>
<body>

</body>
</html>
<!-- 출력 결과 -->
<!-- 컨텍스트: 컨텍스트 1 메시지 -->
<!-- 컨텍스트: 컨텍스트 2 메시지 -->

예제 3: 컨텍스트가 없는 경우 기본 컨텍스트에서 실행하기

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>jQuery callbacks.fireWith() 메서드 예제</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function(){
  var callbacks = $.Callbacks();
  // 콜백 함수 정의
  function callback1() {
    console.log('컨텍스트:', this);
  }
  // 콜백 함수 등록
  callbacks.add(callback1);
  // 컨텍스트가 없는 경우 기본 컨텍스트에서 실행
  callbacks.fireWith();
});
</script>
</head>
<body>

</body>
</html>
<!-- 출력 결과 -->
<!-- 컨텍스트: Window {...} -->

해시태그:

저작자표시 비영리 변경금지

'프로그래밍' 카테고리의 다른 글

jQuery의 callbacks.lock() 메서드: 콜백 함수 실행 제어하기  (0) 2024.03.27
jQuery의 callbacks.has() 메서드: 등록된 콜백 함수 확인하기  (0) 2024.03.27
jQuery의 callbacks.fire() 메서드: 등록된 콜백 함수 실행하기  (0) 2024.03.27
jQuery의 callbacks.empty() 메서드: 콜백 함수 목록 비우기  (0) 2024.03.27
jQuery의 callbacks.disabled() 메서드: 콜백 함수 비활성화 여부 확인하기  (0) 2024.03.27
'프로그래밍' Related Articles more