ホームページ > 記事 > ウェブフロントエンド > スライスを使用して配列メソッドを JS にカプセル化する

スライスを使用して配列メソッドを JS にカプセル化する

不言オリジナル: 2018-07-20 09:34:221863ブラウズ

この記事では、JS で配列メソッドをカプセル化するためのスライスの使用について紹介します。必要な友人はそれを参照できます。

sliceメソッドの機能
// 1) : 配列インターセプト
// 2) :slice(m,n): 配列インデックスmから開始してインデックスnまでインターセプトしますが、nは含まれません。最後の ]
// スライス(m): インデックス m から開始して最後までカットします
// スライス(): 配列のスライス(0) を複製します
// // 負のインデックス: 現在の長さを + にします。負の数;
// 3 ) : 戻り値はインターセプトされた配列です
// 4) : 元の配列は変更されません
/**
* まず第一に: まず、スライスのいくつかの状況とスライスの概念を区別します
* 有効な数値に変換できる限り、渡されるパラメータは他のタイプのデータでも構いません (そのため、パラメータのタイプの要件はより柔軟です) )
* 次に、最初と 2 番目のパラメーターのみが有効なパラメーターであることに注意する必要があります。 3 番目以降のパラメーターは、インターセプトされた結果に影響を与えません。

パラメーターの処理:
* 最初のパラメーターを一時的に入れてみましょう。変数startにパラメータを与え、変数endに第二パラメータを与える
* 1. パラメータ1とパラメータ2が両方とも未定義、またはどちらか一方が未定義の場合
* ケース1: パラメータ1が未定義の場合、直接取得start=0
* ケース2: パラメータ2が未定義の場合、end=this.lengthを直接取る

2. パラメータ1もパラメータ2も未定義の場合
* ケース1: 最初のパラメータが負の数の場合以下: start は this.length とパラメーターの最大値を受け取ります。最初のパラメーターが 0 以上の場合、start はそれ自体を直接受け取ります
* ケース 2: 2 番目のパラメーターが負の数の場合、end はこれを受け取ります。 length と end の値; パラメータが 0 より大きい場合、end は this.length と end の間の最小値を取る

区間の長さの処理: size=end-start
* を設定するケース 1: 区間の長さが短い場合0 以上この場合、空の配列が直接返されます
* ケース 2: 間隔の長さが 0 より大きい場合、文字列であっても配列であっても、size の長さの配列を作成し、値を割り当てます新しい配列の最初から最後までを代入し、 Array return
@type {Array}
*/
添付コード:

    Array.prototype.mySlice = function (start,end) {
        var newAry = [];//创建一个变量用来接收返回值
        var len = this.length;//变量接收当前数组的长度
        //先对参数为undefined的情况进行处理
        start = (start !== undefined)?start:0;
        end = (end !== undefined)?end:len;
        //对于参数的处理，采用三目运算符,由于在与0判断的时候自动转换为数字再进行判断，所以直接与0比较即可
        start = (start>=0)?start:Math.max(0,len+start);
        end = (end>=0)?Math.min(end,len):len+end;
        var size = end - start;//用一个变量接收截取区间的长度
        if(size>0){
            //当区间长度大于0时，实例化一个长度为size的数组，并赋值给newAry
            newAry = new Array(size);
            //遍历数组，将当前数组[start,end)区间上的值依次赋值给newAry
            for(var i = 0;i<size;i++){
                newAry[i] = this[i+start];
            }
        }else{
            //当区间长度小于等于0的情况下，直接返回空数组
            return newAry;
        }
        return newAry;
    };

スライスを使用して配列メソッドを JS にカプセル化する

関連記事