前端常见手写函数及算法

2023-10-13 04:31:00

前言

作为前端开发人员，在日常工作中我们会经常遇到各种各样的问题，有些问题可以使用现成的库或框架来解决，而有些问题则需要我们自己动手写代码来解决。手写代码可以帮助我们更好地理解底层的原理，提高我们的编程能力。

手写函数

发布订阅模式

发布订阅模式是一种一对一模式，通过固定的事件名通知到对应的该事件名订阅者。

// 定义发布者类
class Publisher {
  constructor() {
    this.subscribers = [];
  }

  // 添加订阅者
  subscribe(subscriber) {
    this.subscribers.push(subscriber);
  }

  // 移除订阅者
  unsubscribe(subscriber) {
    const index = this.subscribers.indexOf(subscriber);
    if (index !== -1) {
      this.subscribers.splice(index, 1);
    }
  }

  // 发布事件
  publish(event) {
    this.subscribers.forEach((subscriber) => {
      subscriber.update(event);
    });
  }
}

// 定义订阅者类
class Subscriber {
  constructor(name) {
    this.name = name;
  }

  // 更新订阅者
  update(event) {
    console.log(`${this.name} received event: ${event}`);
  }
}

// 创建发布者对象
const publisher = new Publisher();

// 创建订阅者对象
const subscriber1 = new Subscriber('Subscriber 1');
const subscriber2 = new Subscriber('Subscriber 2');

// 将订阅者对象添加到发布者对象
publisher.subscribe(subscriber1);
publisher.subscribe(subscriber2);

// 发布事件
publisher.publish('Hello world!');

算法

排序算法

排序算法是计算机科学中的一种算法，它可以将一个无序的列表重新排列成一个有序的列表。排序算法有很多种，每种算法都有其自身的优缺点。

冒泡排序

冒泡排序是一种最简单的排序算法，它的思想是不断地比较相邻的两个元素，如果前一个元素大于后一个元素，则交换这两个元素的位置。这样反复比较和交换，直到整个列表有序。

function bubbleSort(array) {
  for (let i = 0; i < array.length - 1; i++) {
    for (let j = 0; j < array.length - 1 - i; j++) {
      if (array[j] > array[j + 1]) {
        const temp = array[j];
        array[j] = array[j + 1];
        array[j + 1] = temp;
      }
    }
  }

  return array;
}