-
웹 페이지에서 자바스크립트(JavaScript)를
사용하여 할 수 있는
-
또 다른 재미있는 방법은 시간을 조정하는 것입니다
-
하지만 먼저
-
여러분이 알아야 할 것이 있어요
-
모든 웹페이지에서 사용할 수 있는
-
window 변수입니다
-
여기에
-
console.log(window)를 입력하고 잠깐 기다릴게요
-
dev tools 확인해보세요
-
그 안에 무엇이 들어있는지 보세요
-
보이시나요? 거대해요 많은 것을 포함하고 있습니다
-
굉장하네요
-
다른 굉장한 방법을 말해줄게요
-
제가 가장 좋아하는 방법들 중 몇 가지들입니다.
-
여러분이 해볼 수 있습니다
-
window.location은 페이지의 URL에 대한
-
많은 정보를 담고 있어요
-
한번 해봅시다
-
써보도록 하겠습니다
-
멈출 필요가 없어요
-
textContent += "The URL of this page
-
is " + window.location
-
이것은 객체이니까 접근할 수 있어야 하니
-
.href를 써주면 됩니다
-
실제로 iFramed 웹페이지의
-
URL입니다
-
또 다른 방법으로 window.navigator.userAgent를 써줄게요
-
사용자를 탐색에 관련된 것입니다
-
"The user agent is" +
-
window.navigator.userAgent:
자 됐어요
-
userAgent 는 다소 이상하게 여기실 수 있어요
-
사람이 읽을 수 있다는 걸
-
의미하는 것이 아닙니다
-
여러 이유들과 맞지도 않고요
-
그래서 많은 웹 개발자들이
-
코드들이 무엇을 의미하는지, 무엇을 작업하고 있는지를
-
이해하기 위해 libraries를 사용합니다
-
운영체제도 마찬가지입니다
-
어렵죠 그래서 어렵지 않은 방법으로
-
window.outerWidth 와
window.outerHeight가 있어요
-
해보도록 하죠
"This web page is" +
-
window.outerWidth + " by " +
window.outerHeight
-
사실은 1280 x 715 사이즈이지만
-
여러분에게 화면에 보이는 것은
-
제가 말한 사이즈와는
-
다를 겁니다
-
이제 여러분에게 조금 놀라온 것을 보여줄게요
-
코드의 windonw 부분을
-
삭제해 보겠습니다
-
여전히 동작하는 것을 보실 수 있어요
-
이것은 웹 페이지 상에 있는
-
디폴트 전역 변수 때문입니다
-
여러분이 사용하고자하는 변수를 브라우저가 탐색할 때
-
window 객체에서 찾게 됩니다
-
그리고 여러분이 전역변수를 만들 때
-
window 객체는 전역변수를 값으로
-
저장하고 있습니다
-
이것은 여러분이 별도로
-
outerWidth와 outerHeight같은 변수들을
선언하지 않아도 된다는 뜻이 됩니다
-
window에 이미
window.outerWidth와 window.outHeight가
-
저장되어 있어요
-
일반적으로 전역변수들을 함께 모아놓는 것은 피해야 합니다
-
전역번수들과 기존의 window에 있는 변수들이
-
서로 충돌할 수 있기 때문입니다
-
좀 더 안전하게 하려면
-
전역변수 앞에 접두어를 붙일 수 있어요
-
칸 아카데미의 경우, 우리가 만들고자 하는 어떠한 전역변수 앞에
-
KA_를 씁니다
-
좋아요 이것이 window 객체입니다
-
이제 동작시키기 위해 두 개의 기능을 어떻게
-
사용하는지 살펴보도록 합시다