Navigator 객체란
브라우저의 정보를 제공하는 객체다. 주로 호환성 문제등을 위해서 사용
크로쓰브라우징(cross browsing)
익스플로러, 파이어폭스, 크롬, 사파리 등 인터넷브라우저는 W3X(HTML, CSS) , ECMA(자바스크립) 국제표준화 기구에
웹표준 규제에 따라서 만들어짐 이는 다양한 컴퓨터 환경이나 브라우저 정보를 동일하게 표현하기 위해 필요함
기능 테스트
Navigator 객체는 브라우저 호환성을 위해서 주로 사용하지만 모든 브라우저에 대응하는 것은 쉬운 일이 아니므로 아래와 같이 기능 테스트를 사용하는 것이 더 선호
예를 들어 Object.keys라는 메소드는 객체의 key 값을 배열로 리턴하는 Object의 메소드다. 이 메소드는 ECMAScript5에 추가되었기 때문에 오래된 자바스크립트와는 호환되지 않는다. 아래의 코드를 통해서 호환성을 맞출 수 있음
<script>
if (!Object.keys) {
Object.keys = (function () {
'use strict';
var hasOwnProperty = Object.prototype.hasOwnProperty,
hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
dontEnums = [
'toString',
'toLocaleString',
'valueOf',
'hasOwnProperty',
'isPrototypeOf',
'propertyIsEnumerable',
'constructor'
],
dontEnumsLength = dontEnums.length;
return function (obj) {
if (typeof obj !== 'object' && (typeof obj !== 'function' || obj === null)) {
throw new TypeError('Object.keys called on non-object');
}
var result = [], prop, i;
for (prop in obj) {
if (hasOwnProperty.call(obj, prop)) {
result.push(prop);
}
}
if (hasDontEnumBug) {
for (i = 0; i < dontEnumsLength; i++) {
if (hasOwnProperty.call(obj, dontEnums[i])) {
result.push(dontEnums[i]);
}
}
}
return result;
};
}());
}
</script>
if (!Object.keys) 앞에 !은 부정
만약에 Object라는 객체가 keys는 메소드를 가지고 있지 않다면 해당 if조건문 실행 ( 해당 기능 실행 )
저 메소드를 가지고 있는 브라우저는 브라우저에 내장된 메소드 사용하게 둠
( 브라우저에 내장되어 있는거 사용하는게 정식이기 때문에 )
하지만 해당 코드로 브라우저마다 다르게 동작하는 부분들을 해당 코드가 보정해 줄 순 없음
만약에 브라우저 마다 다르게 동작하는 기능이 있다면 Navigator 객체를 통해서
그 브라우저 종류를 알게되고 이런 조건문으로 브라우저마다 다르게 동작 할수있도록 해야됨
'Javascript > BOM' 카테고리의 다른 글
창 제어(window.open, 새 창에 접근, 팝업 차단 ) (0) | 2023.01.25 |
---|---|
Location 객체 ( URL 관련 ) (0) | 2023.01.25 |
BOM ( 전역객체, 사용자와 커뮤니케이션 수단 ) (0) | 2023.01.24 |