某东大厂面试js手写题【手写代码附带注释，放心食用，博主亲测】

let Arr = [1, 2, 3];
Array.prototype.push = function (...items) {  // 通过Array.prototype.push的这个属性我们定义的方法顶替
    const len = this.length;  // 当前数组的长度
    const itemCount = items.length;  // 值的长度
    for (let i = 0; i < itemCount; i++) {  // 把每一个值都进行循环
        this[len + i] = items[i];  // 把当前数组长度+i,i是循环的我们要添加的itemCount的长度的循环，第一个是1到我们数组的最长的长度根据我们的数组的特性，根据没有的索引进行添加值来操作，然后从而实现push添加
    }
    this.length = len + itemCount;  // 更新数组长度
    return this.length;  // 返回数组更新长度
}
Arr.push(99)  // 调用方法
console.log(Arr)  // 查看数组调用后的后果

// 
// 定义一个主题类 Subject
class Subject {
    constructor() {
        this.observers = []; // 初始化观察者数组
    }
    // 添加观察者
    addObserver(observer){
        this.observers.push(observer); // 将新的观察者添加到观察者数组中
    }
    // 删除观察者
    removeObserver(observer){
        this.observers = this.observers.filter(obs => obs !== observer); // 通过过滤将特定的观察者从数组中移除
    }
    // 状态变化通知观察者
    notify(data){
        this.observers.forEach(observer => {
            observer.update(data); // 遍历观察者数组，调用每个观察者的 update 方法
        });
    }
}
// 定义一个观察者类 Observer
class Observer {
    update(data){
        console.log(`数据：${data}`); // 当接收到主题状态变化通知时，执行 update 方法来处理数据
    }
}
const subject = new Subject(); // 创建一个主题实例
const observerOne = new Observer(); // 创建第一个观察者实例
const observerTwo = new Observer(); // 创建第二个观察者实例
subject.addObserver(observerOne); // 将第一个观察者添加到主题的观察者数组中
subject.addObserver(observerTwo); // 将第二个观察者添加到主题的观察者数组中
subject.removeObserver(observerTwo); // 从主题的观察者数组中移除第二个观察者
subject.notify("hello word lpz"); // 主题状态发生变化，通知所有的观察者进行更新处理

// 节流函数
function throttle(fn, delay) {
  let timer = null; // 设置一个初始值为 null 的定时器变量
  let lastTime = 0; // 这里的 lastTime 变量用于记录上一次执行函数的时间戳
  return function(...args) { // 返回一个新的函数
    const now = performance.now(); // 获取当前时间戳
    const remainingTime = delay - (now - lastTime); // 计算距离上次执行函数剩余的时间
    if (remainingTime <= 0) { // 如果剩余时间小于等于 0，则立即执行函数
      if (timer) { // 如果存在已经设置的定时器，则清除它
        clearTimeout(timer);
        timer = null;
      }
      fn(...args); // 执行函数
      lastTime = now; // 更新上一次执行函数的时间戳
    } else if (!timer) { // 如果剩余时间大于 0，且不存在已经设置的定时器，则设置定时器
      timer = setTimeout(() => { // 延迟剩余时间后执行函数
        fn(...args);
        lastTime = performance.now(); // 更新上一次执行函数的时间戳
        timer = null; // 清空定时器变量
      }, remainingTime);
    }
  };
}
function handle() {
  console.log("触发");
}
let fn = throttle(handle, 2000); // 使用节流函数包装 handle 函数
fn(); // 第一次执行
// 监听滚动事件，在滚动过程中多次触发函数
window.addEventListener("scroll", fn);

Array.prototype.reduce = function(callback, initialValue) {
    // 首先判断数组是否为空，并且判断回调函数是否为函数类型
    if (this.length === 0 && typeof callback !== 'function') {
      throw new TypeError('Array is empty and callback is not a function');
    }
    let accumulator = initialValue === undefined ? this[0] : initialValue; // 初始化累加器的值
    for (let i = initialValue === undefined ? 1 : 0; i < this.length; i++) { // 从初始值开始迭代数组
      accumulator = callback(accumulator, this[i], i, this); // 调用回调函数进行累加器值的更新
    }
    return accumulator; // 返回最终累加器的值
  };
  // 测试
  const array = [1, 2, 3, 4, 5];
  const sum = array.reduce((acc, cur) => acc + cur, 0);
  console.log(sum); // 输出 15，即 1 + 2 + 3 + 4 + 5 的和

function deepClone(obj) { // 定义一个函数 deepClone，接受一个对象作为参数
    if (obj === null) return null; // 如果传入的对象为 null，直接返回 null
    const type = typeof obj; // 获取 obj 的数据类型
    if (type !== 'object' && type !== 'function') return obj; // 如果 obj 是基本数据类型或函数类型，直接返回 obj
    const clone = Array.isArray(obj) ? [] : {}; // 创建一个新的空对象或数组
    for (let key in obj) { // 遍历 obj 的属性
        if (Object.hasOwnProperty.call(obj, key)) { // 判断属性是否属于 obj 对象本身
            clone[key] = deepClone(obj[key]); // 递归调用 deepClone 函数，将 obj 对应属性的值赋值给 clone 对应的属性
        }
    }
    return clone; // 返回深拷贝后的对象
}
var a = [1,2,3];
var b = deepClone(a);
b.push(5,5)
console.log(a)
// let b =  deepClone(a);

// es5 数组去重
function arrfilter(arr:any[]){
    let res = arr.filter((item,index)=>{
        console.log(arr.indexOf(item) === index,item,index,arr.indexOf(item))
        return arr.indexOf(item) === index
    })
    return res;
}
console.log(arrfilter(["张三","张三","张三","找死","李斯特"]))

// 数组多维数组去重排序
function numberArrFilter(arr) {
  let newArr = new Set(arr); // 去重把数组转换为set对象
  let setArr = Array.from(newArr) // 再把set对象转换为数组对象
  return setArr.sort((a, b) => { // 然后返回排序的结果
    return a - b;
  })
}
// 数组扁平化 通过递归循环
function flattenArray(arr) {
  return arr.reduce((result, item) => { // 使用 reduce() 方法对数组进行迭代处理
    if (Array.isArray(item)) { // 如果当前元素是数组
      result.push(...flattenArray(item)); // 递归调用扁平化函数，将子数组扁平化后的结果展开并添加到结果数组中
    } else { // 如果当前元素不是数组
      result.push(item); // 直接将元素添加到结果数组中
    }
    return result; // 返回累积的结果数组
  }, []); // 初始值是一个空数组
}
console.log(numberArrFilter(flattenArray([[1, 2, 3], [4, 5, [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 6], [1, 2, 3], [1, 2, 3], [1, 2, 3]])))

// 递归遍历树形结构
function getTree(data) {
    console.log(data.value);
    if (data.children) {
        data.children.forEach(item => getTree(item));
    }
}
// 创建一个简单的树结构
const tree = {
    value: 1,
    children: [
        {
            value: 2,
            children: [
                { value: 4 },
                { value: 5 }
            ]
        },
        {
            value: 3,
            children: [
                { value: 6 },
                { value: 7 }
            ]
        }
    ]
};
getTree(tree);