每日前端手写题--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;
};
相关推荐
QQ1__8115175158 小时前
Spring boot名城小区物业管理系统信息管理系统源码-SpringBoot后端+Vue前端+MySQL【可直接运行】
前端·vue.js·spring boot
钛态8 小时前
前端微前端架构:大项目的救命稻草还是自找麻烦?
前端·vue·react·web
一粒黑子8 小时前
【实战解析】阿里开源 PageAgent:纯前端 GUI Agent,一行JS让网页支持自然语言操控
前端·javascript·开源
独角鲸网络安全实验室8 小时前
2026微信小程序抓包全解析:从实操落地到合规风控,解锁前端调试新范式
前端·微信小程序·小程序·抓包·系统代理绕过·https证书严格校验·进程隔离
紫微AI8 小时前
前端文本测量成了卡死一切创新的最后瓶颈,pretext实现突破了
前端·人工智能·typescript
GISer_Jing8 小时前
AI前端(From豆包)
前端·aigc·ai编程
IT枫斗者8 小时前
前端部署后如何判断“页面是不是最新”?一套可落地的版本检测方案(适配 Vite/Vue/React/任意 SPA)
前端·javascript·vue.js·react.js·架构·bug
测试修炼手册8 小时前
[测试技术] 深入理解 JSON Web Token (JWT)
前端·json
AI老李8 小时前
2026 年 Web 前端开发的 8 个趋势!
前端
里欧跑得慢8 小时前
15. Web可访问性最佳实践:让每个用户都能平等访问
前端·css·flutter·web