본문 바로가기

유치원 활동∙̑◡∙̑

JavaScript 개념과 간단 문법 4 ( Location 객체 )

반응형

지식을 하나씩 알아간다는 것이 즐겁다.

이제는 지나가다 코드를 봐도 어 대충~무슨 코드인지 알겠네 정도?

오늘은 location객체에 대해 알아본다

프로그래밍 언어를 공부하다보면 하나의 단어를 알기 위해 그 안에서 또 다른 단어를 알아야 한다^_^하하

처음 프로그래밍을 접할 때 낯설었던 단어들을 풀이하며 Location객체에 대해 정리 해 본다.

 

Location객체는 

현재 브라우저의 창에 열려있는 문서의 URL을 알려주는 객체이다

객체란?

프로그래밍이나 설계에서, 데이터와 그 데이터에 관련되는 동작(절차, 방법, 기능)을 모두 포함한 개념이다. 

예를 들어 기차역에서 승차권을 발매하는 경우, 실체인 ‘손님’과 동작인 ‘승차권 주문’은 하나의 객체이다. 실체인 ‘역무원’과 동작인 ‘승차권 발매’도 하나의 객체이다. 

Location이라는 단어만 보아도 위치,지역 등등 대충 감이 오는 영어단어이니까 어렵지 않게 외워둘 수 있다.

쉽게 말해서 지금 보고 있는 페이지의 URL을 알아낼 수 있는 것이 Location객체.

URL이란?

uniform recourse locator의 약자로 웹문서의 각종 서비스를 제공하는 서버들에 있는 파일의 위치를 표시하는 표준,주소 같은 거.

 

Location객체는 문서의 주소와 관련된 객체로 window 객체의 프로퍼티다

프로퍼티란?

파일 또는 문자열,하드웨어 등이 가지고 있는 고유의 정보

 

이 객체를 통해서 윈도우의 문서 URL을 변경할 수 있고,문서의 위치와 관련해서 다양한 정보를 얻는다

 

현재 이 페이지의 URL 알아내기

console.log(location.toString(), location.href);

이 코드를 콘솔 창에 입력하기.

 

지금 이 페이지에서 마우스 오른쪽버튼 클릭

 

요소 점검 클릭하면 이런 창이 화면아래에 생긴다.

 

 

 

콘솔을 클릭

 

콘솔창에 console.log(location.href);

이렇게 복사 붙여넣기 해 보았더니 이 페이지의 URL이 보인다.

 

 

 

console.log(location.toString(), location.href);

location.toString()이 코드만 사용해도 되고 (location.href) 이 코드만 사용하던지

또는 코드 두개 다 사용해도 되는데  location.href가 통상적으로 많이 사용된다고 해서 나도 

 location.href 이 코드로 출력을 해 봤다.

 

 이고잉 선생님은 이부분을 다 이해하지 못해도 괜찮다고 한다

이 객체가 어떻게 사용될 지는 적용하는 법을 조금 더 공부 해 보아야 하겠다.