每日打卡(三):lodash.js => _.drop + _.dropright + _.fill

95 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第三天,点击查看活动详情

_.drop(array, [n=1])

概念

创建一个切片数组,去除`array`前面的`n`个元素。(`n`默认值为1。)  

参数

  1. array  (Array) : 要查询的数组。
  2. [n=1]  (number) : 要去除的元素个数。

返回值

(Array) : 返回array剩余切片。

例子

_.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 myDrop(arr,n) {
    let len = arr.length
    if (Array.isArray(arr) === true && len === 0) return // 数组不为空
        if(n === undefined){ // 如果未传入参数n  头部删除
            arr.shift() 
            return arr
        }
        while (n >= 0) {
            if(n === 0 ) return arr // 如果个数为0 返回原数组
            else if (n > len) {  // 如果个数大于数组长度 返回空数组
                return []
            }else {
                arr.splice(0,n) // 从右向左删除n个数据
                return arr 
            }
        }
    }

核心为条件判断以及数组shift()和splice()方法的使用

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

概念

创建一个切片数组,去除`array`尾部的`n`个元素。(`n`默认值为1。)

参数

  1. array  (Array) : 要查询的数组。
  2. [n=1]  (number) : 要去除的元素个数。

返回值

(Array) : 返回array剩余切片。

例子

_.dropRight([1, 2, 3]);
// => [1, 2]
 
_.dropRight([1, 2, 3], 2);
// => [1]
 
_.dropRight([1, 2, 3], 5);
// => []
 
_.dropRight([1, 2, 3], 0);
// => [1, 2, 3]

手写实现

function myDropright(arr,n) { 
    let len = arr.length
    if (Array.isArray(arr) === true && len === 0) return // 不为空数组
        if(n === undefined){ // 如果未传入参数n  尾部删除
            arr.pop()
            return arr
        }
        while (n >= 0) {
            if(n === 0 ) return arr  // 如果个数为0 返回原数组
            else if (n > len) {  // 如果个数大于数组长度 返回空数组
                return []
            }else {
                arr.splice(-n)  // 从左向右删除n个数据
                return arr
            }
        }
}

核心为条件判断及数组pop()和splice()方法的使用

_.fill(array, value, [start=0], [end=array.length])

概念

使用 value 值来填充(替换) array,从start位置开始, 到end位置结束(但不包含end位置)。
Note:  这个方法会改变 array(注:不是创建新数组)。

参数

  1. array  (Array) : 要填充改变的数组。
  2. value  ()* : 填充给 array 的值。
  3. [start=0]  (number) : 开始位置(默认0)。
  4. [end=array.length]  (number) :结束位置(默认array.length)。

返回值

(Array) : 返回 array

例子

var array = [1, 2, 3];
 
_.fill(array, 'a');
console.log(array);
// => ['a', 'a', 'a']
 
_.fill(Array(3), 2);
// => [2, 2, 2]
 
_.fill([4, 6, 8, 10], '*', 1, 3);
// => [4, '*', '*', 10]

手写实现

function myFill(arr, tar, start, end) {
    if (Array.isArray(arr) === true && arr.length === 0) return
        arr.fill(tar, start, end) // tar: 修改值  start:开始修改位置  end: 结束修改位置(取不到)
        return arr
}

核心为数组fill()方法的使用