send() 의 위치에 대해
본문
궁금한게 있습니다.
XMLHttpRequest 사용할 때 send() 메소드의 위치가 왜 onload = function() { } 아래에 있는건지 궁금합니다.
상식적으로 open() 으로 열고 바로 send() 로 보낸 뒤에 결과가 오면 onload = function() { } 로 처리해야 할것 같은데, 대부분의 교과서나 샘플코드를 보면 send() 메소드가 꼭 onload = function() { } 아래에 있더라구요..
궁금해서 아래 코드의 ① 위치로 옮겨 보았는데, 역시 잘 실행됩니다.
그런데 보통 코드를 보면 다 ② 번 위치에 send()를 썻는데 이유가 뭐죠??
궁금한게 있습니다.
XMLHttpRequest 사용할 때 send() 메소드의 위치가 왜 onload = function() { } 아래에 있는건지 궁금합니다.
상식적으로 open() 으로 열고 바로 send() 로 보낸 뒤에 결과가 오면 onload = function() { } 로 처리해야 할것 같은데, 대부분의 교과서나 샘플코드를 보면 send() 메소드가 꼭 onload = function() { } 아래에 있더라구요..
궁금해서 아래 코드의 ① 위치로 옮겨 보았는데, 역시 잘 실행됩니다.
그런데 보통 코드를 보면 다 ② 번 위치에 send()를 썻는데 이유가 뭐죠??
function getSales() {
var url = "http://localhost/sales.json";
var request = new XMLHttpRequest();
request.open("GET", url);
// request.send(); //---> (1) 이자리에 와야 정상일것 같은데,
request.onload = function() {
if (request.status == 200) {
//-- 받은 내용 처리하는 코드
}
};
request.send(); //--> (2) 여기에 두는 이유는???
}
답변 3
똑같습니다.
이를테면 아래는 aaa 의 문자를 bbb 로 바꾸는 이벤트인데 원리적으로는 자바 스크립트가 아래에 있어야 맞는 것 같지만...
<div id=my>aaa</div>
<script>
document.addEventListener("DOMContentLoaded", function() { my.innerHTML = "bbb"; });
</script>
-----
아래코드처럼 위로 붙여도 상관없어요.
좀 이상한 것이 my가 정의되기 이전에 my를 부르는 함수를 쓰는데도 잘 돌아가는 것이 비상식적으로 느껴지기 쉽지만 페이지를 로드시킨 이후의 이벤트라는 것이 원래 그렇거든요.
이를테면 자식창이랄 수 있는 아이프레임을 온로드시켜 이벤트를 줄 때도 위치에 전혀 지장받지 않습니다.
<script>
document.addEventListener("DOMContentLoaded", function() { my.innerHTML = "bbb"; });
</script>
<div id=my>aaa</div>
예를들어
성경톅스트 문서를 로드할때 저도 send() 를 위에 주었어요.
물론 이건 아작스 실시간이 아니라 문서를 100퍼센트 로딩시키고 성경문자열을 파싱했습니다만...
보통 함수 앞에 on 이 있으면 ~~가 됬을때 실행한다는 이벤트의 의미입니다
onClick -> 클릭했을때
onChange -> 값이 바뀌었을때
onLoad 도 로드 됬을때 실행되는 함수겠죠,
그럼 로드 됬을때 어떻게 할지 미리 정의해두고,
그후에 send 로 호출 한다 이런개념인거 같네요
아래 적어도 실행되는 이유는 원래 프로그램 한번 쭉 읽어서 함수 정의 먼저 읽고,
그다음 소스코드 실행되는거때문에 되는거같네요
확실하겐 모르겠고 암튼 그런느낌이에요 ㅎㅎ
말씀하신 바 지속적인 코딩을 하다 보면...
사람이 생각하는 순서대로 로직을 짜는 것이 아니라
"사람이라면 이리 안할 거야" 하면서
코드가 생각(?)하는 순서대로 로직을 짜고 있는 자신을 어느날 문득 발견하게 됩니다.
그 문지방을 넘어야 능숙한 개발자가 되는 것 같아요..