[Javascript] undefined..에 관해 나만 몰랐던 이야기

감기가 심하게 걸려 하루 종일 집에 있는 와중에 조금씩 정신을 차리고 심심해져서  평소에 궁금했던 axios 관련해서 소스를 분석해보았다.

그런데 소스의 util 부분에 다음과 같이 소스가 있는 것을 알게 되었다.

function isUndefined(val) {
  return typeof val === 'undefined';
}

 

그래서인지 소스를 보다보면 undefined을 체크하는 부분은 아래와 같이 위의 소스를 사용해 체크를 하고 있었다.

function setContentTypeIfUnset(headers, value) {
  if (!utils.isUndefined(headers) && utils.isUndefined(headers['Content-Type'])) {
    headers['Content-Type'] = value;
  }
}

 

그렇지만 어떠한 소스는 undefined를 체크할 때 다음과 같이 typeof val === 'undefined'; 를 직접 작성하여 사용하고 있어 이상하다고 생각했다.

function getDefaultAdapter() {
  var adapter;
  if (typeof XMLHttpRequest !== 'undefined') {
    // For browsers use XHR adapter
    adapter = require('./adapters/xhr');
  } else if (typeof process !== 'undefined' && Object.prototype.toString.call(process) === '[object process]') {
    // For node use HTTP adapter
    adapter = require('./adapters/http');
  }
  return adapter;
}

사실 오..실수인가? PR을 한 번 올려볼까 생각도 했다. 그래서 바꾸고 나서 테스트를 돌려봤는데 결과는 XMLHttpRequest is not defined 에러로 인해 해당 부분이 필요한 테스트가 줄줄이 실패하고 말았다.

 

솔직히 좀 이해가 가질 않았다. 분명 똑같은 로직이라고만 생각했기 때문이다.

 

그렇지만 해당 함수가 들어가 있는 소스파일을 처음부터 끝까지 다시 천천히 살펴보니 XMLHttpRequest 자체가 선언이 되지 않았다. 말 그대로 정말 not defined였던 것 ㅋㅋㅋㅋ

 

나는 그동안 파일내에 선언되지 않은 변수들을 사용해 본 적이 없었다 또한. 아래와 같이 변수는 선언이 되었지만 값이 할당되지 않은 변수에 대해서만 undefined가 나타는 줄.... 알고 있었다 지금 생각해보면 왜 그랬지...?  

var a;
typeof a = 'undefined';

하지만 아래와 같이 아예 선언되지 않는 변수도 아래와 같이 체크 된다는 걸 오늘 알았다. 

typeof b = 'undefined';

 

사실 그동안 코드를 작성하면서 해당 파일에 선언도 되지 않은 변수를 typeof 로 사용해볼 생각을 못해서였던 것 같다.(사실 해당 파일 내에서 선언하지 않은 변수를 사용해본 적이 없었다..😅) 여기서 나의 코드 작성 경험의 부족이 드러나는 것 같다. 그런 점에서 조금은 황당하지만 좋은 경험을 했던 것 같다.

 

그리고 역시 작성된 코드에는 이유가 있다. 좀더 꼼꼼하게 보는 습관을 길러야지 ✌️