JavaScript算法练习：Slasher Flick

Posted 2020-07-20

简单点说就是对所给的数组做截取操作。看上去就是对数组做数组元素的删除，可能你会想到数组中的shift()方法，可是这个方法只能删除数组的第一个元素。而我们要实现的功能是：对所给数组，根据第二个参数进行截取操作，如果第二个参数大于数组的长度，则返回一个空数组，否则将返回第二个参数作为索引值之后的所有元素组成的数组。

在javascript中这样来实现。创建一个slasher()函数，并且给这个函数传递两个参数arr和howMany。然后返回截取后的数组：

function slasher(arr, howMany) {
    // 这里添加处理方法

    return arr;
}

实现思路

根据前面所说的，实现slasher()的思路：

• 如果howMany等于0，返回原数组arr
• 如果howMany大于等于arr.length，使用数组的方法将arr内的所有项目删除，将返回一个空数组[]
• 其他情况，从arr中删除从第一个元素算起到howMany指的元素，返回一个新数组

实现这些功能，可以使用数组中的shift()、slice()和splice()方法。简单回忆一下：

• Array.prototype.shift()：删除数组的第一个元素，并返回这个元素
• Array.prototype.slice(): 把数组中一部分元素提取出来存入到一个新的数组对象中，并且返回这个新的数组
• Array.prototype.splice():用新元素替找旧元素，以此修改数组的内容

比如：

var arr = [1,2,3,4,5,6,7,8,9];
console.log(arr.shift()); // 1
console.log(arr.slice(0,3)); // [1, 2, 3]
console.log(arr.splice(0,3)); // [1, 2, 3]

实现方案

文章开头也提到过了，实现slasher()函数功能，通过数组的shift()、slice()和splice()方法都可以实现。接下来，看看这几种方法是如何实现的。

方法1： shift()

数组shift()方法删除数组的第一个元素，其实这个离我们需要的删除数组howMany个元素，相距甚远。似乎无法实现一样，其实不然，配合for循环就能达到我们需要的功能：

function slasher(arr, howMany) {
    for (var i= 0; i < howMany; i++){
        arr.shift();
        // arr = [1,2,3,4,5,6,7,8,9] howMany=3
        // 遍历次数 i=? i<howMany  i++  arr.shift()  arr
        // 1st     0    yes        1    1          [2,3,4,5,6,7,8,9]
        // 2nd     1    yes        2    2          [3,4,5,6,7,8,9]
        // 3rd     2    yes        3    3          [4,5,6,7,8,9]
        // 4th     3    no
    }
    return arr;
}

slasher([1,2,3,4,5,6,7,8,9],3);  // [4, 5, 6, 7, 8, 9]
slasher([1,2,3,4,5,6,7,8,9],0);  // [1, 2, 3, 4, 5, 6, 7, 8, 9]
slasher([1,2,3,4,5,6,7,8,9],10); // []

方法2：slice()

slice()方法可以截取数组中的一部分元素，并且将这些元素存入到一个新的数组对象中。并且返回这个新数组。如此一来，在slasher()函数中，可以这样做：

• 如果howMany等于0，将返回原数组arr
• 如果howMany大于等于arr.length，arr.slice(arr.length)从arr中取不到元素，将返回一个空数组[]
• 其他情况，arr.slice()将arr内的元素第-arr.length + howMany算起到数组最后一个元素截取，并返回

那么slasher()函数就可以这样写：

function slasher(arr, howMany) {
    var len = arr.length;
    if (howMany === 0) {
        return arr;
    } else if (howMany >= len) {
        return arr.slice(len);
    } else {
        return arr.slice(-len + howMany);
    }
}

slasher([1,2,3,4,5,6,7,8,9],0);  //[1, 2, 3, 4, 5, 6, 7, 8, 9]
slasher([1,2,3,4,5,6,7,8,9],10); // []
slasher([1,2,3,4,5,6,7,8,9],4);  //[5, 6, 7, 8, 9]

方法3： splice()

splice()方法可以指定从数组中第几个元素开始删除多少个元素，然后返回这个修改后的数组。即：

• 如果howMany等于0，将返回原数组arr
• 如果howMany大于等于arr.length，使用Array.splice()将arr內的所有元素刪除，将返回一个空数组[]
• 其他情況，使用Array.splice()将arr內的元素从第一个元素算起到howMany指定的元素，并且返回修改后的数组

代码如下：

function slasher (arr, howMany) {
    var len =  arr.length;
    if (howMany === 0) {
        return arr;
    } else if (howMany >= len) {
        arr.splice(0, len);
        return arr;
    } else {
        arr.splice(0, howMany);
        return arr;
    }
}

slasher([1,2,3,4,5,6,7,8,9],0);  // [1, 2, 3, 4, 5, 6, 7, 8, 9]
slasher([1,2,3,4,5,6,7,8,9],10); // []
slasher([1,2,3,4,5,6,7,8,9],4);  // [5, 6, 7, 8, 9]

总结

文章分别使用数组的Array.shift()、Array.slice()和Array.splice()方法实现对所给数组，根据第二个参数进行截取操作，如果第二个参数大于数组的长度，则返回一个空数组，否则将返回第二个参数作为索引值之后的所有元素组成的数组。