每日前端手写题--day8

以下题目来自掘金等其它博客,但是问题的答案都是根据笔者自己的理解做出的。如果你最近想要换工作或者巩固一下自己的前端知识基础,不妨和我一起参与到每日刷题的过程中来,如何?

第八天要刷的手写题如下:

  1. 实现Array.prototype.concat
  2. 实现Array.prototype.reverse
  3. 实现Array.prototype.sort

下面是我自己写的答案:

1. 实现Array.prototype.concat

  • 作用:Array.prototype.concat 方法用于合并两个或多个数组,返回一个新的数组。它不会修改原始数组,而是创建并返回一个新的数组,其中包含所有被合并的数组的元素。
  • 拆包:如果传入concat的是一个数组,则默认情况下会对其拆包([[[1]]]会被当作[[1]]添加进去
javascript 复制代码
Array.prototype.myConcat = function myConcat (...args) {
  const newArray = [...this]; // 创建新数组并复制原始数组的元素

  for (let i = 0; i < args.length; i++) {
    if (Array.isArray(args[i])) {
      newArray.push(...args[i]); // 将数组参数展开并追加到新数组中
    } else {
      newArray.push(args[i]); // 将非数组参数直接追加到新数组中
    }
  }

  return newArray;
};

2. 实现Array.prototype.reverse

  • 作用:将数组的元素逆序
javascript 复制代码
Array.prototype.myReverse = function myReverse () {
    if(!Array.isArray(this)) throw new Error('must be called by array');
     const _len = this.length;
    if(_len < 2) return this;

    const middle = _len >> 2;
    for (let i = 0; i < middle; i++) {
        [this[i], this[_len - i - 1]] = [this[_len -i - 1], this[i]];
    }
    return this;
}

3. 实现Array.prototype.sort

  • 原理:根据指定的排序方向对数组进行排序。
  • 实现:首先确定排序的方向;然后使用快速排序实现
  • 返回值:原数组
javascript 复制代码
Array.prototype.mySort = function (compareFn) {
  const array = [...this]; // 创建新数组并复制原始数组的元素
  if(array.length < 2) return this;
  // 定义比较函数
  const defaultCompare = (a, b) => {
    if (a === undefined || b === undefined) {
      return 0;
    }
    if (a < b) {
      return -1;
    }
    if (a > b) {
      return 1;
    }
    return 0;
  };

  // 使用传入的比较函数或默认比较函数
  const comparator = compareFn || defaultCompare;

  // 快速排序算法
  const quickSort = (arr) => {
    if (arr.length <= 1) {
      return arr;
    }

    const pivotIndex = arr.length >> 1;
    const pivot = arr.splice(pivotIndex, 1)[0];
    const left = [];
    const right = [];

    for (let i = 0; i < arr.length; i++) {
      const result = comparator(arr[i], pivot);
      if (result === -1) {
        left.push(arr[i]);
      } else {
        right.push(arr[i]);
      }
    }

    return [...quickSort(left), pivot, ...quickSort(right)];
  };

  const sortedArray = quickSort(array);

  // 更新原始数组的元素
  for (let i = 0; i < this.length; i++) {
    this[i] = sortedArray[i];
  }

  return this;
};
相关推荐
浏览器爱好者29 分钟前
如何在AWS上部署一个Web应用?
前端·云计算·aws
xiao-xiang1 小时前
jenkins-通过api获取所有job及最新build信息
前端·servlet·jenkins
C语言魔术师1 小时前
【小游戏篇】三子棋游戏
前端·算法·游戏
小周不摆烂1 小时前
探索JavaScript前端开发:开启交互之门的神奇钥匙(二)
javascript
匹马夕阳2 小时前
Vue 3中导航守卫(Navigation Guard)结合Axios实现token认证机制
前端·javascript·vue.js
你熬夜了吗?2 小时前
日历热力图,月度数据可视化图表(日活跃图、格子图)vue组件
前端·vue.js·信息可视化
我想学LINUX3 小时前
【2024年华为OD机试】 (A卷,100分)- 微服务的集成测试(JavaScript&Java & Python&C/C++)
java·c语言·javascript·python·华为od·微服务·集成测试
screct_demo3 小时前
詳細講一下在RN(ReactNative)中,6個比較常用的組件以及詳細的用法
javascript·react native·react.js
DogDaoDao7 小时前
leetcode 面试经典 150 题:有效的括号
c++·算法·leetcode·面试··stack·有效的括号
桂月二二8 小时前
探索前端开发中的 Web Vitals —— 提升用户体验的关键技术
前端·ux