前言

上节我们介绍了difference系列方法的源码，了解其实现原理及区别，本节我们来看下drop系列方法的源码。

drop

drop用于去除数组前面的n个元素，返回一个新数组，效果像slice，截取数组的方法。

js 复制代码

_.drop(array, [n=1])
//arrya 数组 n为去除元素个数 默认为1
_.drop([1,2]) //[2]

效果很简单，毕竟也学了两节，下面我们就自己实现一个drop。

实例化调用一下：

js 复制代码

const lodash = new Lodash()
const arr = [1, 2, 3, 4, 5]
console.log(lodash.drop(arr, 2)) //[3,4,5]

能够得到想要的结果，并且该方法的风格跟前面学习的lodash源码还是有点类似的，下面我们就来看下drop源码。

源码依旧很简单，先进行了数组长度判断，利用slice方法得到结果，并且通过toInteger处理n确保参数为正整数。很明显核心方法就是slice，下面我们看下slice方法源码。

slice有三个参数：array------数组；start------开始下标；end------结束下标，跟数组的slice方法基本一样。我们来解析下lodash的实现：

通过三目运算获取数组长度length，并且判断start与end参数。
兼容start、end为负整数的情况，当start小于0取正进行判断，大于数组长度为0，否则两者相加；end小于0就直接与length相加。接着就是截取长度的确认，注意这里用到了>>>=符号，该符号表示无符号右移赋值是二进制相关的运算符，同样>>>表示的就是无符号右移。
声明index，用while进行循赋值，注意array的下标一直是index+start 。
对比我写的跟lodash写的，只能说循环思路有点重合，其他地方还是lodash考虑得周全。

dropRight字面意思从右边开始，那就是从尾部进行截取，与drop刚好相反。

js 复制代码

_.dropRight(array, [n=1])
_.dropRight([1,2]) //[1]

该方法得源码与drop类似，区别在于增加了end参数，end为length-n。

dropWhile创建一个从起点到满意条件的切片数组，对比drop，第二个参数变成了predicate条件函数，注意这里截取的是不满足条件的部分，而非满足。

js 复制代码

_.dropWhile(array, predicate(value, index, array))
_.dropWhile([1, 2, 3], function (val) { return val < 2 }) //[2,3]

代码很简单，核心方法就是baseWhile，该方法接收四个参数:

array:数组；predicate:迭代方法；isDrop：布尔值是否为drop；formRight：布尔值是否从右边。
isDrop很明显是为了区分dropWhile跟其他方法的，baseWhile的逻辑就是处理参数，调用slice方法：

获取length，声明index，通过while的判定条件获取predicat为真值的下标，注意这里用了&&，当前者为true，会执行后者，所以当predicat返回true，循环就结束了，此时index就是我们想要的下标。
根据isDrop传递不同的参数，获取结果，对于dropWhile而言，isDrop一直为true。

dropRightWhile从尾部开始创建切片，跟dropWhile相反。

js 复制代码

_.dropRightWhile(array, predicate(value, index, array))
_.dropRightWhile([1, 2, 3], function (val) { return val > 2 }) //[1,2]

根据上面的分析我们能够得知，只需要将baseWhile的formRight设置为true就行。

drop系列方法是将数据进行截取，核心是slice函数，而slice主要是通过下标与数组长度进行循环处理的。使用该方法需要注意drop是去除，特别是用dropWhile、dropRightWhile方法。