splice

splice lets you remove elements from and insert elements into a List.

This example demonstrates how to do surgery on a list of numbers:

 var list = new List([0, 1, 2, 3]);

 // starting at index 2, remove one element and insert 'Alice' and 'Bob':
 list.splice(2, 1, 'Alice', 'Bob');
 list.attr(); // [0, 1, 'Alice', 'Bob', 3]

Events

splice causes the List it's called on to emit change events, add events, remove events, and length events. If there are any elements to remove, a change event, a remove event, and a length event will be fired. If there are any elements to insert, a separate change event, an add event, and a separate length event will be fired.

This slightly-modified version of the above example should help make it clear how splice causes events to be emitted:

 var list = new List(['a', 'b', 'c', 'd']);
 list.bind('change', function(ev, attr, how, newVals, oldVals) {
     console.log('change: ' + attr + ', ' + how + ', ' + newVals + ', ' + oldVals);
 });
 list.bind('add', function(ev, newVals, where) {
     console.log('add: ' + newVals + ', ' + where);
 });
 list.bind('remove', function(ev, oldVals, where) {
     console.log('remove: ' + oldVals + ', ' + where);
 });
 list.bind('length', function(ev, length) {
     console.log('length: ' + length + ', ' + this.attr());
 });

 // starting at index 2, remove one element and insert 'Alice' and 'Bob':
 list.splice(2, 1, 'Alice', 'Bob'); // change: 2, 'remove', undefined, ['c']
                                    // remove: ['c'], 2
                                    // length: 5, ['a', 'b', 'Alice', 'Bob', 'd']
                                    // change: 2, 'add', ['Alice', 'Bob'], ['c']
                                    // add: ['Alice', 'Bob'], 2
                                    // length: 5, ['a', 'b', 'Alice', 'Bob', 'd']

More information about binding to these events can be found under [can.List.attr attr].