IT工程師數位筆記本

typeOf

typeOf: function (obj) {
    return toString.call(obj).slice(8, -1)
}

每個對象都有一個 toString() 方法，當對象被表示為文本值時或者當以期望字符串的方式引用對象時，該方法被自動調用。默認情況下，toString() 方法被每個繼承自Object的對象繼承。如果此方法在自定義對象中未被覆蓋，toString() 返回 "[object type]",其中type是對象類型。

Object.prototype.toString()

也就是說當調用toString方法去轉換某個對象時，如果那個對象轉換不成字符串就會返回"[object type]"這個，但是由于所有對象都繼承自Object，所以默認情況下輸出的是"[object object]"，除非你改變toString的指向，也就是我們平時用的call、apply、bind。

我們會發現如果通過數組的toString是可以轉換成字符串的，而借用Object的toString就會返回"[object Array]"，我覺得主要還是因為Object里面的toString方法和其他類型的toString方法內部做的是不同的處理，這也就是為什么一定要借用Object里面的toString方法才行。

toText

toText: function (value) {
    return (typeof value === 'string' ||
        typeof value === 'boolean' ||
        (typeof value === 'number' && value == value))
        ? value
        : ''
}

排除NaN value == value，因為NaN不等于NaN，但我覺得作者這段代碼寫的并不好，一會用===一會又用==并且這里也不涉及隱式轉換。

也可以用switch來實現

toText: function (value) {
    switch(typeof value){
      case "string":
      case "boolean":
      case "number":
        return value == value ? value : "";
      default:
        return "";
    }
}

過濾數組重復項

unique: function (arr) {
    var hash = utils.hash(),
        i = arr.length,
        key, res = []
    while (i--) {
        key = arr[i]
        if (hash[key]) continue
        hash[key] = 1
        res.push(key)
    }
    return res
}

他這里是通過對象來實現過濾數組重復項的，因為對象不能有相同的key，作者在代碼中經常使用utils.hash()這么一句話，這句話的意思是創建一個空對象，使用的是Object.create(null)，使用這種方法創建對象的好處就是它不會繼承任何對象的屬性和方法。

除了用作者的這種方式，還可以用Map對象實現

unique: function (arr) {
    var map = new Map(),
        res = [];
    arr.forEach(function(item){
      map.set(item);
    });
    map.forEach(function(item,index){
      res.push(index);
    });
    return res;
}

將字符串轉成DOM元素

function toFragment (template) {
    if (typeof template !== 'string') {
        return template
    }
    // 如果是ID選擇器則獲取元素里面的內容
    if (template.charAt(0) === '#') {
        var templateNode = document.getElementById(template.slice(1))
        // 如果獲取不到元素則返回空
        if (!templateNode) return
        template = templateNode.innerHTML
    }
    // 這里創建一個div主要是想借用DOM的innerHTML方法
    var node = document.createElement('div'),
      // 創建一個文檔片段，如果這里用createElement來創建元素那么就會多出一個無用的外層標簽來。
        frag = document.createDocumentFragment(),
        child
        // 去除空格
    node.innerHTML = template.trim()
    while (child = node.firstChild) {
        frag.appendChild(child)
    }
    return frag
}

相關閱讀：

createElement與createDocumentFragment的點點區別
Document.createDocumentFragment()