splice（）を使用する前後の結果配列の取得

Question

インデックスから特定の要素を配列から削除するデモを作成しました。

var splice_a = function (array, index) { 
 
    array.splice(index, 1); 
 
    return array 
 
}; 
 

 
var splice_b = function (array, index) { 
 
    return array.splice(index, 1) 
 
}; 
 

 
var test = function() { 
 
    var array = [1, 2, 3]; 
 
    
 
    alert(splice_a(array, 1)); 
 
    alert(splice_b(array, 1)); 
 
};

<button onclick="test()">Click me</button>

Array.prototype.splice()return valueについてこう述べています。

削除された要素を含む配列。 1つの要素が の場合、1つの要素の配列が返されます。 の要素が削除されていない場合は、空の配列が返されます。

結果の配列を取得したい場合は、キーワードreturnと組み合わせる必要がありますか？私は2差の結果を取得していますので、

それはケースのようになります。

1,3

私の質問：のは、このケースでreturn array.splice(index, 1)で起こる何？

Answer 1

はここで何が起こっているかの抽象例です。すべてのArray.prototypeメソッドは配列を返しません。たとえば、は元の配列を返しません。これは、あなたがやろうとしているものに似ている：

function foo_a(arr) { 
    // call foo, removes element from arr. 
    arr.foo() // We do not return here so the fact that foo returns 1 is not used. 
    return arr 
} 

function foo_b(arr) { 
    // call foo, removes element from arr. 
    return arr.foo() // We return the return value of foo here, which is 1 
} 

var arr = [1, 2, 3, 4]; 

foo_a(arr) // [1, 2, 3] 
foo_b(arr) // 1 

TL; DR return arr.foo()は基本的に関係なく、それが配列にし、これまで他に何の常に1である「FOOの戻り値を返す」と言っています。

Answer 2

結果の配列は独自の配列です。それを元に戻す必要はありません。 だから、それだけで次のようになります。

var splice_a = function (array, index) { 
    array.splice(index, 1); 
    return array 
}; 
var array = [1, 2, 3, 4]; 

splice_a(array, 1); 
alert(array) //will show 1,3,4; 

splice_a(array, 1); 
alert(array) //will show 1,4; 

Answer 3

Array.prototype.splice配列として配列を返す取り除か値のmインデックスからnデータを削除します：あなたの状況にあるので、

var m = 2, 
 
    n = 3; 
 
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 
 
var removedValues = arr.splice(m, n); 
 

 
console.log(arr, removedValues);

それarray（indexの値）から1つの要素を削除し、それを新しい配列に返します。

// a function that removes the last element from an array, and returns 1 
Array.prototype.foo = function() { 
    this.pop() 
    return 1 
} 

// a function that removes the last element from an array, and returns the array 
Array.prototype.bar = function() { 
    this.pop() 
    return this 
} 

あなたは同じことがarrに起こるarr.foo()またはarr.bar()を呼ぶとしたら、あなたが求めている機能のしかし戻り値は異なります。

Answer 4

戻り値の違いを表示するように関数を変更しました。 両方同じ方法で渡された配列を変更します。変更されるのは戻り値だけです。これはあなたが混乱している場所かもしれません。array変数がsplice_aによって変更されてから、splice_bまで実行されていることに注意してください。それはとにかく変化している場合は、値を返すようにしたいと思う理由については

var splice_a = function (array, index) { 
 
    var removed = array.splice(index, 1); 
 
    console.log(` Removed = ${removed}`); 
 
    console.log(` Array = ${array}`); 
 
    
 
    return array; 
 
}; 
 

 
var splice_b = function (array, index) { 
 
    var removed = array.splice(index, 1) 
 
    console.log(` Removed = ${removed}`); 
 
    console.log(` Array = ${array}`); 
 
    
 
    return removed; 
 
}; 
 

 
var array = [1, 2, 3]; 
 

 
console.log(`Array before splice_a: ${array}`); 
 
splice_a(array, 1); 
 

 
console.log(`Array before splice_b: ${array}`); 
 
splice_b(array, 1); 
 

 
console.log(`Final value of array: ${array}`);

。これは主に連鎖コマンドの便宜のためです。ちょうど最初の関数を考えてみましょう：

var splice_a1 = function (array, index) { 
 
    var removed = array.splice(index, 1); 
 
    return array; 
 
}; 
 
var splice_a2 = function (array, index) { 
 
    var removed = array.splice(index, 1); 
 
}; 
 

 

 
var array = [1, 2, 3]; 
 
// This will run, because splice_a1 returns an array 
 
splice_a1(array, 1).forEach(_ => console.log(_)) 
 

 
// This will throw an error, because <undefined> does not have a forEach() 
 
splice_a2(array, 1).forEach(_ => console.log(_))