Notice
Recent Posts
Recent Comments
Link
투케이2K
236. (RxJs) [CDN 5.5.12] [Observable] toArray 사용해 방출되는 값들을 모은 후 배열 (array) 형태로 데이터 내보내기 실시 본문
JavaScript
236. (RxJs) [CDN 5.5.12] [Observable] toArray 사용해 방출되는 값들을 모은 후 배열 (array) 형태로 데이터 내보내기 실시
투케이2K 2023. 1. 17. 20:40[개발 환경 설정]
개발 툴 : Edit++
개발 언어 : RxJavascript
[소스 코드]
<!-- [CDN 설정 실시] -->
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.12/Rx.js"></script>
<!-- [내부 자바스크립트 J쿼리 이벤트 지정] -->
<script>
/*
-----------------------------------------
[요약 설명]
-----------------------------------------
1. window.onload : 웹페이지 로드 완료 상태를 확인합니다
-----------------------------------------
2. CDN 설치 참고 사이트 :
https://rxjs.dev/guide/installation
https://cdnjs.com/libraries/rxjs
-----------------------------------------
3. 문법 참고 사이트 : https://junwoo45.gitbook.io/learn-rxjs-korean/
-----------------------------------------
4. take : 제공된 수 만큼의 값만 데이터를 발생 합니다
-----------------------------------------
5. toArray : 방출되는 값들을 모은 후 배열형태로 내보냅니다
-----------------------------------------
6. subscribe : 구독해 데이터를 소비 합니다
-----------------------------------------
*/
// [html 최초 로드 및 이벤트 상시 대기 실시]
window.onload = function() {
console.log("");
console.log("=========================================");
console.log("[window onload] : [start]");
console.log("=========================================");
console.log("");
// [테스트 함수 호출]
testMain();
};
// [자바스크립트 테스트 코드]
function testMain(){
console.log("");
console.log("=========================================");
console.log("[testMain] : [start]");
console.log("=========================================");
console.log("");
// [Observable 선언]
const obser = Rx.Observable.of(1, 2, 3, 4, 5);
// [subscribe 구독해 데이터 소비]
obser.take(3).toArray().subscribe(
function (value) {
console.log("");
console.log("=========================================");
console.log("[testMain] : [onNext]");
console.log("-----------------------------------------");
console.log("[value] : " + value);
console.log("=========================================");
console.log("");
},
function (error) {
console.log("");
console.log("=========================================");
console.log("[testMain] : [onError]");
console.log("-----------------------------------------");
console.log("[error] : " + error);
console.log("=========================================");
console.log("");
},
function () {
console.log("");
console.log("=========================================");
console.log("[testMain] : [onCompleted]");
console.log("=========================================");
console.log("");
}
);
};
</script>
[결과 출력]
=========================================
[window onload] : [start]
=========================================
=========================================
[testMain] : [start]
=========================================
=========================================
[testMain] : [onNext]
-----------------------------------------
[value] : 1,2,3
=========================================
=========================================
[testMain] : [onCompleted]
=========================================
반응형
'JavaScript' 카테고리의 다른 글
Comments