アンダースコアソースコード分析_JavaScriptスキル

数年前、JavaScript は最も過小評価されているプログラミング言語だと言う人もいましたが、nodejs の登場以来、オール スタック/フル スタックの概念がますます人気になってきました。 。 JavaScript は C に似た言語です。C 言語の基礎があれば、JavaScript コードをほぼ理解できます。ただし、スクリプト言語としての JavaScript の柔軟性は C に比べてはるかに低いため、いくつかの困難が生じます。学ぶ。

1. 集合

1. 1 つ目は、いくつかの反復メソッドです。

_.each = _.forEach = function(obj, iteratee, context) {
iteratee = optimizeCb(iteratee, context);
var i, length;
if (isArrayLike(obj)) {
 for (i = 0, length = obj.length; i < length; i++) {
  iteratee(obj[i], i, obj);
 }
} else {
 var keys = _.keys(obj);
 for (i = 0, length = keys.length; i < length; i++) {
  iteratee(obj[keys[i]], keys[i], obj);
 }
}
// 链式调用
return obj;
 }; 

ES は、配列にネイティブの forEach() メソッドも追加します。違いは、ここでの each(forEach) メソッドはすべてのコレクションに使用でき、関数は 3 つのパラメーター (コレクション、反復関数、実行環境) を受け入れることです。

optimizeCb 関数は、反復関数パラメーターの数に基づいて、対応する実行環境をさまざまな反復メソッドにバインドします。forEach 反復関数は 3 つのパラメーター (値、インデックス、セット) も受け入れます。

次のステップは、for ループで反復関数を呼び出すことです。

_.map での isArrayLike 判定のよりエレガントな実装: (for ループは 1 つだけ)

var keys = !isArrayLike(obj) && _.keys(obj),
    length = (keys || obj).length,
    results = Array(length);
  for (var index = 0; index < length; index++) {
   var currentKey = keys &#63; keys[index] : index;
   results[index] = iteratee(obj[currentKey], currentKey, obj);
  }
  return results;
  // 合理使用&&、||、&#63;:可以大大减少代码量 

さらに 2 つの特別な場所があります:

•コレクションを配列のようなコレクションとオブジェクトのコレクションに分割します。 isArrayLike 関数が使用されます:

// js的最大精确整数
 var MAX_ARRAY_INDEX = Math.pow(2, 53) - 1;
 var isArrayLike = function(collection) {
var length = collection != null && collection.length;
return typeof length == 'number' && length >= 0 && length <= MAX_ARRAY_INDEX;
 }; // 如果集合有Length属性且为数字并且大于0小于最大的精确整数，则判定是类数组

• _.keys 関数が使用されます。Object には、obj で列挙できる属性の配列を返すために使用されるネイティブのキー関数もあります。実装は、hasOwnProperty() メソッドに加えて比較的単純です。

----------------------------------------------- --- ----------------------------------

_.map、_.reduce メソッドには同様の原理があります。

_.find 関数は Array.some() と似ていますが、Array.some() のようにブール値を返すのではなく、反復結果を true にする最初の要素を返す点が異なります。

 _.find = _.detect = function(obj, predicate, context) {
  var key;
  if (isArrayLike(obj)) {
   key = _.findIndex(obj, predicate, context);
  } else {
   key = _.findKey(obj, predicate, context);
  }
  if (key !== void 0 && key !== -1) return obj[key];
 };
function createIndexFinder(dir) {
  return function(array, predicate, context) {
   predicate = cb(predicate, context);
   var length = array != null && array.length;
   // 如果dir为1,index为0，index+=1，index正序循环
   // 如果dir 为-1，index为length-1,index += -1反序循环
   // 判断循环条件则用了index >= 0 && index < length方法兼顾两种循环方式
   var index = dir > 0 &#63; 0 : length - 1;
   for (; index >= 0 && index < length; index += dir) {
    if (predicate(array[index], index, array)) return index;
   }
   return -1;
  };
 }
 _.findIndex = createIndexFinder(1)；
 _.findLastIndex = createIndexFinder(-1)； 

学ぶ価値があるのは、ここでの for ループは、渡されたさまざまなパラメーターに従ってさまざまなループ シーケンスを構成できることです。

1. コレクション内の他のメソッドは、基本的に反復メソッドに基づいて実装されます。

_.max = function(obj, iteratee, context) {
var result = -Infinity, lastComputed = -Infinity,
  value, computed;
if (iteratee == null && obj != null) {
 obj = isArrayLike(obj) ? obj : _.values(obj);
 for (var i = 0, length = obj.length; i < length; i++) {
  value = obj[i];
  if (value > result) {
   result = value;
  }
 }
} else {
 iteratee = cb(iteratee, context);
 _.each(obj, function(value, index, list) {
  computed = iteratee(value, index, list);
  if (computed > lastComputed || computed === -Infinity && result === -Infinity) {
   result = value;
   lastComputed = computed;
  }
 });
}
return result;
 }; 

max メソッドは、リスト内のすべての項目をループして、現在の項目と結果の項目を比較することにより、セット内の最大値を見つけるために使用されます。現在の項目が結果より大きい場合、その項目が割り当てられます。結果項目に追加され、最後に結果項目が返されます。

2. コレクションを配列に変換します

 _.toArray = function(obj) {
    if (!obj) return [];
    // 如果是数组，采用了Array.prototype.slice.call(this,obj)这种方法
    if (_.isArray(obj)) return slice.call(obj);
    // 类数组对象，这里没有采用Slice方法，而是利用.map对集合进行迭代，从而返回一个数组。 _.identity该方法传入的值和返回的值相等。（主要用于迭代）
    if (isArrayLike(obj)) return _.map(obj, _.identity);
    // 普通对象，则返回由属性值组成的数组。
    return _.values(obj);
   };

データ型

STL では、データ構造が異なれば実装方法も異なるため、ベクトルやリストなどを区別する必要がありますが、コレクションと配列をアンダースコアで区切る理由は何でしょうか?これも JavaScript のデータ型から始まります。下の図を参照してください。