array.splice(start,deleteCount,item1,item2....)
数组
splice
方法从array
移除n
个元素(大于或等于0
),而且能够用新的item
替换被移除的元素。参数start
是从数组array
中移除元素的最开始位置(数组的索引,正负数表示方向,负数表示从数组末尾开始往前数,可是不论正负,移除的方向始终是索引递增的方向)。参数deleteCounts
是要移除的元素个数(若是设置为 0,则不会删除)。后面的items用来替换被移除的位置上(可多可少)。splice
最终返回一个包含被移除元素的数组,而且原数组也被改变。 this
splice
主要做用是从一个数组中删除元素(改变原数组),slice
主要做用是从数组中复制一段元素(不改变原数组),二者有本质区别spa
用法:prototype
var a = [1,2,3,4,5],b=a.splice(0,2,6,7,8); //a ==> [6, 7, 8, 3, 4, 5] //b ==> [1,2]
原生方法实现分析:code
确认开始索引位置 start
,最小为0。索引
确认须要移除的长度 deleConuts
,最小为0,ip
确认原数组变化后的新长度it
按照索引位置,获取deleConuts
长度的新数组,用于返回io
对原数组进行替换items新元素。function
最终代码实现
//按照步骤,数组会被分红3个部分,左边,arr_left,中间被删除arr_delete,右边arr_right Array.prototype.splice = function(start,deletCounts){ var max = Math.max, min = Math.min, len = this.length,//数组长度 insertCounts = max(arguments.length - 2 ,0),//用来替换的数组的个数,不包括参数值中的前2个 result = [],//存储用来返回的数组 ; //肯定索引开始位置 start = start >= 0 ? start || len + start ;//负数表示从数组末尾开始往前数 //最多能删除从索引开始到数组结束位置 deletCounts = max(min(typeof 'deletCounts' === 'number' ? deletCounts : len ,len - start),0); var changeCounts = insertCounts - deletCounts ,//新增-删除 new_len = len + changeCounts ;//原数组变化后的新长度 //生成返回的数组 for (var i = 0; i < deletCounts; i++) { var item = this[start + i];//从索引开始后的元素(包括start) if(item !== undefined){ //超过原数组最大索引值会不存在 result[i] = item } if(start + i > len - 1){ //超过原数组最大索引,后续不须要再处理 break } } //替换被删除项 var arr_right_length = len - start - deletCounts;//右边arr_right长度 if(changeCounts > 0 ){ //新增大于删除,则将数组右边部分arr_right 向右挪动差值个单位,至关于右边的索引都增长 changeCounts(防止有重叠部分,从右往左复制) var i = 1; while(arr_right_length){ this[new_len - i] = this[len - i]; k ++; arr_right_length -- ; } }else if(changeCounts < 0){ //新增小于删除,则将右边arr_right 向左挪动差值个单位 var i = start + insertCounts ;//右边新的索引 for(var k = 0 ;k < arr_right_length ;k++){ this[i] = this[i - changeCounts] ;//由于是负数,因此 i -changeCounts表示更大 i ++ ; } this.length = new_len;//须要手动修改数组长度 } for(var i = 0;i < insertCounts ; i++){ //对新增的部分进行赋值处理 this[start + i] = arguments[2+i] } //返回被删除的元素 return result }
附上一图,但愿可以更明了(画工太拙劣):
不对的地方还望指导,谢谢!