JavaScript - 문제 미리보기
문제 707
hard
다음 두 코드의 실행 결과가 동일한지 판단하세요.
코드 A (Callback 방식):
```javascript
setTimeout(function() {
document.getElementById("demo").innerHTML = "I love You !!!";
}, 3000);
```
코드 B (Promise 방식):
```javascript
let myPromise = new Promise(function(myResolve, myReject) {
setTimeout(function() { myResolve("I love You !!!"); }, 3000);
});
myPromise.then(function(value) {
document.getElementById("demo").innerHTML = value;
});
```
코드 A (Callback 방식):
```javascript
setTimeout(function() {
document.getElementById("demo").innerHTML = "I love You !!!";
}, 3000);
```
코드 B (Promise 방식):
```javascript
let myPromise = new Promise(function(myResolve, myReject) {
setTimeout(function() { myResolve("I love You !!!"); }, 3000);
});
myPromise.then(function(value) {
document.getElementById("demo").innerHTML = value;
});
```
정답: A
두 코드는 동일한 결과를 만들어냅니다. 둘 다 3초 후에 "I love You !!!"라는 텍스트를 화면에 표시합니다.
차이점은 구현 방식에 있습니다:
1. 코드 A (Callback 방식):
1) `setTimeout`에 직접 콜백 함수를 전달
2) 간단하지만 복잡한 비동기 작업에서는 "콜백 지옥" 문제 발생 가능
2. 코드 B (Promise 방식):
1) Promise 객체를 통해 비동기 작업을 감싸고 `then()`으로 결과 처리
2) 더 깔끔한 코드 구조, 에러 처리가 용이함
3) 복잡한 비동기 작업에서 코드 가독성이 향상됨
Promise 방식이 콜백 방식의 현대적인 대안으로 널리 사용되고 있습니다.
차이점은 구현 방식에 있습니다:
1. 코드 A (Callback 방식):
1) `setTimeout`에 직접 콜백 함수를 전달
2) 간단하지만 복잡한 비동기 작업에서는 "콜백 지옥" 문제 발생 가능
2. 코드 B (Promise 방식):
1) Promise 객체를 통해 비동기 작업을 감싸고 `then()`으로 결과 처리
2) 더 깔끔한 코드 구조, 에러 처리가 용이함
3) 복잡한 비동기 작업에서 코드 가독성이 향상됨
Promise 방식이 콜백 방식의 현대적인 대안으로 널리 사용되고 있습니다.
💡 학습 팁
이 문제를 포함한 JavaScript 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.