【undersscore.jsソースの解読】常用タイプの判断といくつかの有用なツール方法

4128 ワード

Why under score
最近はundersscore.jsのソースコードを見始めました.undersscore.jsのソースコードの解読を2016年の計画に入れました.
いくつかの有名な枠组みのソースコードを読むと、まるでみんなと対话するように、多くのことを学ぶことができます.なぜアンダースコアですか?最も主要な原因はアンダースコアが短くて精悍(約1.5 k行)で、100以上の有用な方法を実装しています.結合度が低く、一つ一つの方法で読むのに適しています.ビルのようなJavaScript初心者に適しています.そこから、void 0をundefinedの代わりに使って、undefinedを書き換えるなどのテクニックを身につけるだけでなく、変数型の判断や関数の節流や関数の手ぶれなど、よく使われる方法を学ぶことができます.また、多くのブラウザに対応するhackを学ぶことができます.また、作者の全体的な設計構想やAPI設計の原理(後方互換性)を学ぶことができます.
その後、スレ主は一連の文章を書いて、皆さんとソースの読み取りで学んだ知識を共有します.
  • undersscore-1.8.3ソースの全文コメントhttps://github.com/hanzichi/underscore-analysis/blob/master/underscore-1.8.3.js/underscore-1.8.3-analysis.js
  • undersscore-1.8.3ソース解読プロジェクトの場所https://github.com/hanzichi/underscore-analysis
  • undersscore-1.8.3ソース解読シリーズ文https://github.com/hanzichi/underscore-analysis/issues
  • いらっしゃいませ.(興味があれば、star&watchを歓迎します.)あなたの注目はビルの続けて書く動力です.
    タイプ判定
    第一篇ではなぜアンダースコア.jsがundefinedの代わりにvoid 0を使っていたのか簡単に話をしましたが、意外にいい反応をもらいました.友達からの私信があります.以前は知らなかったという話もあります.次の文章を読むように促す人もいます.今日はundersscore.jsのJavaScript常用タイプの検査方法とツール類の判断方法についてお話しします.
    私たちはまず古くからのありふれた問題を話します.JavaScriptの中の配列のタイプの判断方法は、実際にはJavascriptの中で配列の正しい姿勢を判断します.文章の中では、各種の判断方式の長所と短所を詳しく分析し、正しい判断コードを与えました.
    function isArray(a) {
      Array.isArray ? Array.isArray(a) : Object.prototype.toString.call(a) === '[object Array]';
    }
    
    アンダースコアもそうです.
    // Is a given value an array?
    // Delegates to ECMA5's native Array.isArray
    //        
    _.isArray = nativeIsArray || function(obj) {
      return toString.call(obj) === '[object Array]';
    };
    
    native IsArayはES 5におけるAray.isAray方法であり、サポートすれば優先的に呼び出します.toString変数はObject.prototype.toStringを保存します.
    相手をどう判断しますか?undersscoreはタイプがfunctionとobjectの変数をすべて対象にして、当然nullを除去します.
    // Is a given variable an object?
    //        
    //         function   object
    _.isObject = function(obj) {
      var type = typeof obj;
      return type === 'function' || type === 'object' && !!obj;
    };
    
    「Agments」、「Function」、「String」、「Number」、「Date」、「RegExp」、「Error」といったタイプの判断は、実はすべてObject.prototype.toStering.callで判断できるので、一緒に書きました.
    // Add some isType methods: isArguments, isFunction, isString, isNumber, isDate, isRegExp, isError.
    //       
    _.each(['Arguments', 'Function', 'String', 'Number', 'Date', 'RegExp', 'Error'], function(name) {
      _['is' + name] = function(obj) {
        return toString.call(obj) === '[object ' + name + ']';
      };
    });
    
    しかし、isArgments方法を見ると、IE<9の下でAbject.prototype.toStering.callを起動し、結果は「Object Object」であり、私たちが期待している「Object Agments」ではない.どうしたらいいですか?この元素がcalee属性を含んでいるかどうかを使って判断できます.皆さんが週になったら、argments.caleeは現在のargmentsの関数に戻ります.
    // Define a fallback version of the method in browsers (ahem, IE < 9), where
    // there isn't any inspectable "Arguments" type.
    // _.isArguments     IE < 9     
    // IE < 9    arguments    Object.prototype.toString.call   
    //     [object Object]
    //          [object Arguments]。
    // so       callee      
    if (!_.isArguments(arguments)) {
      _.isArguments = function(obj) {
        return _.has(obj, 'callee');
      };
    }
    
    工具類の判断方法
    次によく使われるツール類の判断方法を見ます.
    一つの要素がDOM元素かどうかを判断するのは非常に簡単です.空ではなく、nodeType属性が1:
    // Is a given value a DOM element?
    //       DOM   
    _.isElement = function(obj) {
      //    obj    null 
      //    obj.nodeType === 1
      return !!(obj && obj.nodeType === 1);
    };
    
    どのように一つの元素がNaNであるかを判断しますか?NaNはNumberタイプで、Object.prototype.toString.call(NaN)が戻ってきたのは「[object Number]」であり、NaNは自分に等しくないという2点で判断できます.
    // Is the given value `NaN`? (NaN is the only number which does not equal itself).
    //       NaN
    // NaN        `       `   number   
    _.isNaN = function(obj) {
      return _.isNumber(obj) && obj !== +obj;
    };
    
    もちろん、underscoreは他にも多くの有用なツールの種類の判断方法があります.https://github.com/hanzichi/underscore-analysis/blob/master/underscore-1.8.3.js/src/underscore-1.8.3.js#L1192-L 1263この部分です
    私が共有しているものがあなたの役に立つと感じたら、私のRepoに注目してください.https://github.com/hanzichi/underscore-analysis