Lodash源码分析-drop.js

前言

本系列使用 lodash 4.17.4版本

此方法对slice方法进行了引用

本文章不对slice方法进行详细描述，详细内容请参考咱们另外一位小组成员的文章（连接在文章末尾）。

正文

源代码

import slice from './slice.js'

/**
 * Creates a slice of `array` with `n` elements dropped from the beginning.
 *
 * @since 0.5.0
 * @category Array
 * @param {Array} array The array to query.
 * @param {number} [n=1] The number of elements to drop.
 * @returns {Array} Returns the slice of `array`.
 * @example
 *
 * drop([1, 2, 3])
 * // => [2, 3]
 *
 * drop([1, 2, 3], 2)
 * // => [3]
 *
 * drop([1, 2, 3], 5)
 * // => []
 *
 * drop([1, 2, 3], 0)
 * // => [1, 2, 3]
 */
function drop(array, n=1) {
  const length = array == null ? 0 : array.length
  return length
    ? slice(array, n < 0 ? 0 : n, length)
    : []
}

export default drop
复制代码

解析

参数

该方法接受两个参数：

第一个参数是一个将被截取的数组；

第二个参数是截取的起始位置的索引。

返回值

该方法返回一个被截取后的数组。

方法解析

该方法首先会声明一个局部变量length来存放第一个数组参数的长度，若为空数组则长度为0。

以后判断变量length是否为真true（在这里变量length会被转换为布尔Boolean类型，数字类型的值在为0时会转换为false，其余值会转换为true），若第一个数组参数不是空数组，则会为真，不然为假。若length为真，会引用slice方法从索引值为第二个参数的值的位置开始截取数组（在这里若没有传入第二个参数则会默认其为1，若传入了第二个参数也会对其进行一下判断，若第二个参数小于0则开始截取的索引值为0，不然为传入的第二个参数的值），并将该截取后的新数组放回给调用该方法的地方；若length为假，则会返回一个空数组给调用该方法的地方。

注： 该方法没有对传入的第一个参数的参数类型进行判断，因此第一个参数为其余类型的值时也不会抛出错误。

但在除数组和字符串类型之外，其余的类型由于没有length这个属性，因此其余类型长度判断的值会为undefined，在slice方法内部，若传入的第一个参数为假（undefined转换为布尔值为假false），直接会返回一个空数组。因此除数组和字符串之外，其余类型的值做为第一个参数传入该方法会直接获得一个空数组。

若传入的第一个参数为字符串时，字符串是有length属性的，即字符串的长度。由于字符串可看做是由一个个字符所组成的数组，因此字符串会先被转换成一个个字符组成的数组，而后被当作数组进行数组的截取操做。

示例

drop([1, 2, 3, 4, 5])
--> [2, 3, 4, 5]
drop([1, 2, 3, 4, 5], 3)
--> [4, 5]
drop([1, 2, 3, 4, 5], 7)
--> []
drop([1, 2, 3, 4, 5], -2)
--> [1, 2, 3, 4, 5]
drop("I love Javascript!")
--> [" ", "l", "o", "v", "e", " ", "J", "a", "v", "a", "s", "c", "r", "i", "p", "t", "!"]
drop(3)
--> []
drop({a: 1, b: 2, c: 3})
--> []
drop(true)
--> []
drop(null)
--> []
drop(undefined)
--> []
复制代码

总结

该方法传入一个数组和截取起始的索引值（索引值非必须，默认为1），返回一个被截取后的新数组。

相关连接：

每日源码分析 - lodash(slice.js)

每日源码分析 - lodash(debounce.js和throttle.js)

本文章来源于午安煎饼计划Web组 - 残阳