브라우저의 정보를 제공하는 객체다. 주로 호환성 문제등을 위해서 사용한다.
아래 명령을 통해서 이 객체의 모든 프로퍼티를 열람할 수 있다.
1 | console.dir(navigator); |
주요한 프로퍼티를 알아보자.
appName
웹브라우저의 이름이다. IE는 Microsoft Internet Explorer, 파이어폭스, 크롬등은 Nescape로 표시한다.
appVersion
브라우저의 버전을 의미한다. 필자의 현재 브라우저 정보는 아래와 같다.
1 | "5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.116 Safari/537.36" |
userAgent
브라우저가 서버측으로 전송하는 USER-AGENT HTTP 헤더의 내용이다. appVersion과 비슷하다.
1 | "5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.116 Safari/537.36" |
platform
브라우저가 동작하고 있는 운영체제에 대한 정보다.
1 | "Win32" |
기능 테스트
Navigator 객체는 브라우저 호환성을 위해서 주로 사용하지만 모든 브라우저에 대응하는 것은 쉬운 일이 아니므로 아래와 같이 기능 테스트를 사용하는 것이 더 선호되는 방법이다.
예를 들어 Object.keys라는 메소드는 객체의 key 값을 배열로 리턴하는 Object의 메소드다. 이 메소드는 ECMAScript5에 추가되었기 때문에 오래된 자바스크립트와는 호환되지 않는다. 아래의 코드를 통해서 호환성을 맞출 수 있다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 | // From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys 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; }; }()); } |