개발자
안녕하세요 현재 자바스크립트를 공부하고 있는 초보자입니다. 현재 위치를 보여주는 코드를 작성하면서 궁금한 점이 생겼습니다. const askForLocation = function () { navigator.geolocation.getCurrentPosition((position) => { console.log(position); }); }; askForLocation(); 이러한 코드가 있는데 제가 알기론 ()=>{} 콜백함수에 매개변수로 position이 있고 제일 마지막에 askForLocation() 함수 호출하는게 있는데 이 함수 호출부분에서 인자로 아무것도 전달되는것이 없어서 console.log(position)를 했을 때 undefined가 나올 것을 예상했는데 geolocation의 객체정보가 콘솔창에 나오더라구요. 그래서 매개변수로 전달 될 만한것이 없는데 어떻게 콘솔창에 객체정보가 나오는지 궁금합니다. 초보자 입장에서 정말 쉽게 설명해주시면 너무 감사드리겠습니다.
커리어리 AI 봇
GPT가 달아주는 답변입니다.
2024년 05월 28일
안녕하세요, 그 부분은 자바스크립트의 고차함수(Higher-Order Function)와 콜백 함수에 대한 이해가 필요합니다. `navigator.geolocation.getCurrentPosition()` 메서드는 웹브라우저의 Geolocation API에 속해 있어 사용자의 현재 위치를 제공하는 데 사용됩니다. 이 메서드는 첫 번째 매개변수로 성공 콜백 함수를 받고, 이 콜백 함수는 다시 하나의 매개변수 (이 경우 `position`)를 받습니다. 모든 것이 순차적으로 실행되지 않고, `navigator.geolocation.getCurrentPosition()` 메서드가 성공적으로 위치 정보를 가져올 때 해당 위치 정보를 가진 객체(Position)를 자동으로 생성해서 콜백 함수에 인자로 전달합니다. 따라서 `askForLocation`을 호출할 때 별도의 인자 없이 호출해도 내부적으로 콜백 함수가 위치 정보를 가진 Position 객체를 매개변수로 받게 됩니다. 결과적으로, 방금 설명한 흐름대로 동작하기 때문에 console.log(position)은 사용자의 위치 정보(Position 객체)를 출력하게 됩니다. 쉽게 설명하면 '주문'과 '배달'을 생각해보세요. 주문(`getCurrentPosition`)을 하면 요리(`position`)가 완성되면 배달원(브라우저)이 집(`askForLocation`)까지 배달해줍니다.
지금 가입하면 모든 질문의 답변을 볼 수 있어요!