Object Type 알아내기

typeof

보통 javascript에서 데이터 타입을 알아내기 위해서 typeof 연산자 를 사용합니다. typeof를 통해 javascript의 다음과 같은 데이터 타입을 알아낼 수 있습니다.

​x
 typeof undefined  // "undefined"
 typeof 1          // "number"
 typeof {}         // "object"
 typeof true       // "boolean"
 typeof "str"      // "string"
 function func() {}
 typeof func       // "function"
 typeof Symbol("sym"); // "symbol"

그렇다면 이 이외에 Array 나, Null, Date 와 같이 Object의 타입은 어떨까요.

xxxxxxxxxx
typeof []       // "object" 
typeof null     // "object" 
const date = new Date();
typeof date     // "object" 

예상하던 바와 달리 Array, Null, Date 모두 "object"라는 결과를 보여 줍니다.

그럼 typeof 를 사용하는 방법 이외에 Object 인지 Array 인지, Null 인지 어떻게 구분할 수 있을 까요. 바로 다음과 같이 Object.prototypr.toString을 이용하면 됩니다.

Object.prototype.toString

xxxxxxxxxx
function getType(data) {
    return Object.prototype.toString.call(data);
}

xxxxxxxxxx
 function getType(data) {
     return Object.prototype.toString.call(data);
 }
​
 getType({});           // "[object Object]"
 getType(6);            // "[object Number]"
 getType(true);         // "[object Boolean]"
 getType("string");     // "[object String]"
 getType([1, 2]);       // "[object Array]"
 getType(undefined);    // "[object undefined]"
 getType(null)          // "[object Null]"
 function func(){}
 getType(func);         // "[object function]"
 getType(new Date())    // "[object Date]"

!! 연산자

코드를 보던 중,

x
function somthing () {
    let a;
    /* ... */
    return !!a;
}

와 같은 코드를 보게 되었습니다.

여기서 return !!a; 의 !! 이 어떤 이유에서 쓰였는지 의문이 들어 알아보았습니다.

사실 !! 이라는 연산자가 존재하는 것은 아닙니다. ! 는 논리연산자 중 부정 연산자인데, !! 은 단순히 부정연산자가 두 번 쓰인 것이었습니다.

! 는 true인 값을 false 로, false인 값을 true로 바꾸는 것으로 알고있었는데, 왜 ! 를 두번 사용하여 원래대로 바꾼 것인지 의문이었습니다. MDN 문서를 보면 다음과 같이 나와있습니다.

!(피연산자)와 같이 사용하여, 피연산자가 true로 변환될수 있을경우 false,

불가능한경우 false 를 반환한다.

왜 문서에서 '피연산자가 true 로 변환될 수 있는 경우, 불가능한 경우' 라고 하였을까요.

문서에서 말하는 그 변환될 수 있는 경우란 Truthy 와 Falsy 값을 말하는 것 이었습니다.

간단하게 설명하면,

Truthy 는 조건문에서 true 로 간주되는 것, Falsy는 조건문에서 false 로 간주되는 것 입니다.

그래서 Truthy 인지 Falsy 인지 알수 있는 방법은 간단합니다. if 조건문에 넣어보면 됩니다.

xxxxxxxxxx
if ( value ) {
    // value 는 Truthy 이다
} else {
    // value 는 Falsy 이다.
}

Falsy 인 값 의 종류를 보면 그렇게 많지 않습니다.

• false
• 0 (zero)
• '' (빈 문자열)
• "" (빈 문자열)
• null
• undefined
• NaN

그리고 이를 제외한 나머지는 모두 Truthy 입니다. 가령 위에는 없지만 Falsy 하게 보이는

• '0' (string)
• "0" (string)
• "false" (string)
• [] (empty array)
• {} (object)

이것들 모두 Truthy 입니다.

그럼 다시 본론으로 들어가서 ! 연산자의 경우,

Truthy 를 false 로, Falsy 를 true 로 바꾸는 연산자 라고 할 수 있습니다. 그래서 !! 이렇게 부정 연산자를 두 번 사용하는 것은,

Falsy -> false, Truthy -> true 로 형변환 하는 용도로 사용된다는 것을 알게 되었습니다.

xxxxxxxxxx
var a;
a;      // undefined (falsy)
!a;     // true
!!a;    // false

Singleton Pattern

Singleton Pattern(싱글톤 패턴)은 인스턴스화할 때, 단 하나의 인스턴스(오브젝트)만을 유지하도록 강제하는 패턴입니다.

싱글톤 패턴은 새로운 인스턴스를 생성할 때 이미 인스턴스가 존재한다면, 존재하는 인스턴스를 반환하고 존재하지 않으면

새로운 인스턴스를 만들어서 반환하는 방식으로 동작합니다.

싱글톤은 언제 유용할까요?

예를 들어 로그를 남기는 기능을 가진 클래스의 경우,

여러 클래스의 인터페이스에서 접근할 필요가 있지만 실제 로그를 남기는 인스턴스는 하나만 있으면 되는 경우가 있습니다.

이렇듯이 하나의 인스턴스만 유지해야 할 때 싱글톤을 사용할 수 있습니다.

코드로 보겠습니다.

var singletonPattern = (function () {
   var instance;
   
    function init() {
        var privateVariable = "private";
        function privateMethod() {
            /*...*/
        }
        return {
            publicVariable: 5,
            publicMethod: function () {
                /* ... */
            }
        }
    }
    return {
        getInstance: function () {
            if ( !instance ) {
                instance = init();
            }
            return instance;
        }
    } 
}());

init() 은 인스턴스를 생성하는 기능을 합니다.

그리고 getInstace() 에서 현재 instance를 확인하여 인스턴스가 생성되어있지 않을 경우에,

새로운 인스턴스를 생성하고 반환합니다. 인스턴스가 이미 생성되어있다면 기존의 인스턴스를 반환합니다.

xxxxxxxxxx
var singletonA = singletonPattern.getInstance();
var singletonB = singletonPattern.getInstance();
console.log( singletonA === singletonB );   // true

사용하면 편리한 싱글톤이지만 장점만 있는 것은 아닙니다.

싱글톤의 대표적인 단점으로는

• 여러 클래스에서 접근하기 때문에, 결합도가 올라간다.
• 한번 생성되면 애플리케이션 종료까지 메모리에 남게 된다

는 점이 있습니다.

싱글톤을 사용하면 전역변수에 접근하듯이 쉽게 쓸수있지만, 전역변수의 사용을 항상 피하듯이

꼭 필요한 경우에만 사용하여야 할 것 같습니다.