Array、grep、merge、makeArray での静的メソッドの使用、および jQuery でのソース コード分析

inArray メソッド

は、配列内の最初のパラメーターの位置を 0 から数えて決定します (見つからない場合は -1 を返します)。

例:

var arr = [ 4, "Pete", 8, "John" ];

jQuery.inArray("John", arr);  //3

jQuery.inArray(4, arr);  //0

jQuery.inArray("David", arr);  //-1

jQuery.inArray("Pete", arr, 2);  //-1

ソースコード分析:

inArray: function( elem, array, i ) {
        var len;

        if ( array ) {
            if ( indexOf ) {
                return indexOf.call( array, elem, i );
            }

            len = array.length;
            i = i ? i < 0 ? Math.max( 0, len + i ) : i : 0;

            for ( ; i < len; i++ ) {
                // Skip accessing in sparse arrays
                if ( i in array && array[ i ] === elem ) {
                    return i;
                }
            }
        }

        return -1;
    },

は3つのパラメータを受け入れます。elemパラメータは検索対象の要素、arrayは検索対象の配列、iは指定された開始位置を表します。検索、デフォルトは 0、つまり検索です。配列全体は、trim メソッドと同様です。コードを実行するブラウザーがこのメソッドをサポートしている場合は、それを直接呼び出します。

var arr=[1,2,3];
     
  alert(arr.indexOf(2));  //1     
  alert(arr.indexOf(2,2));  //-1

は、低バージョンのブラウジングを考慮する必要がない開発者によって直接使用できます。ループ フィルタリングでの使用をサポートしていないブラウザでは、まず配列の長さを保存し、次に従って i を処理します。長さ、i が存在しない場合は 0 とし、0 未満の場合は len を追加して判断し、それでも 0 未満の場合は再度 0 にします

ここでのループは通常使用する形式とは異なります。コメントで述べたように、スパース配列とは次のとおりです。長さは 3 で、パフォーマンス値は同じですが、in 操作によって返される結果は異なります。2 番目のタイプは、要素が不連続なスパース配列です。for...in ループは 2 つの定義されていないものを自動的に追加しますが、結果は次のようになります。 false。このタイプの配列の場合、js のバックグラウンドで追加される unfine は必要ないため、jQuery はこのメソッドを採用しており、これも学ぶ価値があります。見つかった後は対応する i 値が返され、それ以外の場合は -1 が返されるので、戻り結果 > -1 が存在するかどうかを判断できます。

grepメソッド

配列要素をフィルターするにはfilter関数を使用します。

この関数は、フィルタリングされる配列とフィルタ関数という少なくとも 2 つのパラメータを渡します。フィルター関数は、要素を保持する場合は true を返すか、要素を削除する場合は false を返す必要があります。

例:

var arr=[undefined,undefined];
 arr[2]=4;
 console.log(arr);//[undefined,undefined,4]
 var i=0;len=arr.length;
 for ( i in arr ) {
      alert(i in arr);  //true x 3
 }

 var arr=[];
 arr[2]=4;
 console.log(arr);//[2:4]
 var i=0;len=arr.length;
 for ( i in arr ) {
       alert(i in arr);  //false x 3 true
  }

ソースコード分析:

$.grep( [0,1,2], function(n,i){  return n > 0;
});//结果:[1, 2]//排除数组中大于 0 的元素，使用第三个参数进行排除。$.grep( [0,1,2], function(n,i){  return n > 0;
}, true);//结果:[0]

このメソッドは3つのパラメータを受け入れます。elemsはフィルタリングされる配列、callbackはコールバック関数です。投資逆にするかどうかを示します。フィルタリングのデフォルト値は false です。

まず、inv が強制的にブール値に変換され、次に for ループを使用して配列内の要素がコールバックに渡されます。関数を 1 つずつ呼び出して演算し、返された結果を retVal に代入します。retVal が inv と等しい場合、その要素を新しい配列 ret に入れ、最後に戻り値が ret になることに注意してください。コールバック関数の値はブール値である必要があります。

mergeメソッド

2つの配列を結合します

返された結果は最初の配列の内容を変更します - 最初の配列の要素の後に2番目の配列の要素が続きます。

例:

<span style="font-size: 18px;">grep: <span style="color: #0000ff;">function</span><span style="color: #000000;">( elems, callback, inv ) {    </span><span style="color: #0000ff;">var</span> ret =<span style="color: #000000;"> [], retVal;
    inv </span>= !!<span style="color: #000000;">inv;    </span><span style="color: #008000;">//</span><span style="color: #008000;"> Go through the array, only saving the items</span>
    <span style="color: #008000;">//</span><span style="color: #008000;"> that pass the validator function</span>
    <span style="color: #0000ff;">for</span> ( <span style="color: #0000ff;">var</span> i = 0, length = elems.length; i < length; i++<span style="color: #000000;"> ) {
         retVal </span>= !!<span style="color: #000000;">callback( elems[ i ], i );         </span><span style="color: #0000ff;">if</span> ( inv !==<span style="color: #000000;"> retVal ) {
             ret.push( elems[ i ] );
         }
   }   </span><span style="color: #0000ff;">return</span><span style="color: #000000;"> ret;<br/>}</span></span>

ソースコード分析:

//合并两个数组到第一个数组上。$.merge( [0,1,2], [2,3,4] )//结果:[0,1,2,2,3,4]

このメソッドは 2 つの配列パラメータを受け入れます。2 番目のパラメータはマージされた配列として使用され、最初のパラメータはマージされる配列。実際、ここでの配列は必ずしも「純粋な配列」である必要はなく、配列のようなオブジェクトまたは数値添字を持つオブジェクトである可能性があります。

まず、2 番目の配列の長さ属性に基づいて区別します。数値型であり、配列とみなされます。for ループを使用して最初の配列に 1 つずつ追加します。数値でない場合、または存在しない場合は、while ループを使用して、2 番目の配列内のすべての未定義の値を、最初の配列の対応する添字値に追加または上書きします。

最後に、長さの値を手動で修正します。これは、「純粋な配列」以外のデータの場合、長さの値は自動的に変更されないためです。

makeArray メソッド

配列状のオブジェクトを配列オブジェクトに変換します。

配列のようなオブジェクトには、メンバーのインデックスが 0 から length - 1 までの length プロパティがあります。実際には、この関数は特別な変換を行わずに jQuery で自動的に使用されます。

例:

merge: function( first, second ) {    var i = first.length,
        j = 0;    if ( typeof second.length === "number" ) {         for ( var l = second.length; j < l; j++ ) {
             first[ i++ ] = second[ j ];
         }

    } else {          while ( second[j] !== undefined ) {
             first[ i++ ] = second[ j++ ];
          }
    }

    first.length = i;    return first;
},

ソースコード分析:

<span style="font-size: 18px;"><span style="color: #008000;">//</span><span style="color: #008000;"> results is for internal usage only</span>makeArray: <span style="color: #0000ff;">function</span><span style="color: #000000;">( array, results ) {   <br/><br/></span><span style="color: #0000ff;">var</span> ret = results ||<span style="color: #000000;"> [];   </span><span style="color: #0000ff;">if</span> ( array != <span style="color: #0000ff;">null</span><span style="color: #000000;"> ) {        <br/> <br/></span><span style="color: #008000;">//</span><span style="color: #008000;"> The window, strings (and functions) also have &#39;length&#39;</span>
        <span style="color: #008000;">//</span><span style="color: #008000;"> Tweaked logic slightly to handle Blackberry 4.7 RegExp issues #6930</span>
        <span style="color: #0000ff;">var</span> type =<span style="color: #000000;"> jQuery.type( array );        <br/> <br/></span><span style="color: #0000ff;">if</span> ( array.length == <span style="color: #0000ff;">null</span> || type === "string" || type === "function" || type === "regexp" ||<span style="color: #000000;"> jQuery.isWindow( array ) ) {
            push.call( ret, array );
        } </span><span style="color: #0000ff;">else</span><span style="color: #000000;"> {
            jQuery.merge( ret, array );
        }
   }   </span><span style="color: #0000ff;">return</span><span style="color: #000000;"> ret;<br/>},</span></span>

 

这里接受两个参数，其中第二个参数是内部使用的，在源码内部经常被调用作为其他方法的支持方法。

创建一个新数组ret，如果只有一个参数则为空，如果存在第二个参数就把第二个参数赋值给ret，在array参数存在的前提下获取其数据类型，如果数据类型为字符串、函数或者正则时或者不存在length属性时，则假定array不是数组或者类数组，因为字符串、函数和正则（黑莓系统下）都是有length属性的，所以只判断length不准确，如果不是数组或者类数组就直接将第一个参数放入ret的末尾。如果通过了则认为是数组或者是类数组，此时调用merge方法将两个数组合并，最后返回ret。

 

 

以上がArray、grep、merge、makeArray での静的メソッドの使用、および jQuery でのソース コード分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。