[ JavaScript ] JS Navigator 객체

 

 

 

 

이미지 출처 :    https://www.inflearn.com/course/javascript-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EA%B0%95%EC%A2%8C#

 

생활코딩의 이고잉 님의 강의를 기반으로 개인 공부용으로 정리한 포스팅입니다.

 

 

 

---

 

 

 

- Navigator 객체

 

 

 

Navigator 객체는 브라우저의 정보를 제공해주는 객체입니다.

 

브라우저끼리 호환성이 안맞을때 주로 사용한다고합니다.

 

 

 

 

- console.dir 

 

 

 

console.dir 는 console.log 와 마찬가지로 프로퍼티를 열람할 수 있습니다.

디렉토리 형식으로 출력됩니다.

 

 

 

 

 

 

 

 

아래는 Navigator 객체에서 중요하게 쓰이는 프로퍼티입니다.

 

 

 

 

- appName

 

 

웹 브라우저의 이름을 알려주는 프로퍼티 입니다.

 

 

 

console.log(navigator.appName)

 

 

 

저는 네이버 웨일 브라우저를 사용하는데 Netscape가 출력되었습니다.

 

IE는 Microsoft Internet Explorer, 파이어폭스, 크롬등은 Netscape로 표시한다고합니다.

 

네이버웨일은 크로미움기반이라 Netscape가 나온게아닌가 추측됩니다.

 

 

 

 

- appVersion 

 

브라우저의 버전을 의미합니다.

 

 

console.log(navigator.appVersion)

 

 

 

 

 

 

- userAgent 

 

브라우저가 서버측으로 전송하는 USER-AGENT HTTP 헤더의 내용입니다.

 

 

 

console.log(navigator.userAgent)

 

 

 

 

- platform 

 

 

브라우저가 동작하고 있는 운영체제에 대한 정보입니다.

 

 

 

console.log(navigator.platform)

 

 

 

 

 

 

 

 

- 기능테스트

 

Navigator 객체는 브라우저의 호환성을 위해 사용되기도 하지만 모든 브라우저에 대응하는 것은 쉬운일이 아닙니다.

 

그러하여 기능테스트를 사용하는 것이 더 선호됩니다.

 

 

 

ex) Object.keys라는 메소드는 객체의 key 값을 배열로 리턴하는 Object의 메소드입니다.

 

하지만 이 메소드는 ECMAScript5에 추가되었는데, 이는 오래된 자바스크립트와 호환이 안됩니다.

 

 

이러한 크로스 브라우저 이슈는 아래와 같은 코드를 통해서 호환성을 맞출 수 있습니다. 

 

 

// 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;
    };
  }());
}

 

 

 

 

SUA 정보보안 멘토링에 참여하고 있습니다.