private前端常见算法

1.数组

合并两个有序数组(简单-5)

https://leetcode.cn/problems/merge-sorted-array/description/?envType=study-plan-v2&envId=top-interview-150

移除元素(简单-4)

https://leetcode.cn/problems/remove-element/description/?envType=study-plan-v2&envId=top-interview-150

删除有序数组重复项(简单-5)

https://leetcode.cn/problems/remove-duplicates-from-sorted-array/description/?envType=study-plan-v2&envId=top-interview-150

删除有序数组重复项2(中等-3)

https://leetcode.cn/problems/remove-duplicates-from-sorted-array-ii/description/?envType=study-plan-v2&envId=top-interview-150

买股票最佳时机(简单-4)

https://leetcode.cn/problems/best-time-to-buy-and-sell-stock/description/?envType=study-plan-v2&envId=top-interview-150

买股票最佳时机2(中等-3)

https://leetcode.cn/problems/best-time-to-buy-and-sell-stock-ii/description/?envType=study-plan-v2&envId=top-interview-150

罗马数字转整数(中等-4)

https://leetcode.cn/problems/roman-to-integer/description/?envType=study-plan-v2&envId=top-interview-150

最后一个单词的长度(简单-5)

https://leetcode.cn/problems/length-of-last-word/description/?envType=study-plan-v2&envId=top-interview-150

最长公共前缀(简单-5)

https://leetcode.cn/problems/longest-common-prefix/description/?envType=study-plan-v2&envId=top-interview-150

找出字符串中第一个匹配项的下标

https://leetcode.cn/problems/find-the-index-of-the-first-occurrence-in-a-string/description/?envType=study-plan-v2&envId=top-interview-150

2.双指针

验证回文串 (中等-5)

https://leetcode.cn/problems/valid-palindrome/description/?envType=study-plan-v2&envId=top-interview-150
private前端常见算法_第1张图片

//方法1
var isPalindrome = function(s) {
    let exp=[' ',',',':',]
    let str=''
    for (const e of s) {
        if(!exp.includes(e)){
            str+=e
        }
    }
    str=str.toLowerCase()
    let revers=str.split('').reverse().join('')
    console.log(str,revers);
    
   if(str===revers){
       return true
   }else{
       return false
   }
};
console.log(isPalindrome("A man, a plan, a canal: Panama"));

/双指针
//方法2
var isPalindrome = function(s) {
    s = s.replace(/([^a-zA-Z0-9])/g, '');
    for (let i = 0, j = s.length - 1; i < j; i++,j--) {
        if (s[i].toLocaleLowerCase() !== s[j].toLocaleLowerCase()) {
            return false;
        }
    }
    return true;
}

//方法3
var isPalindrome = function (s) {
    s = s.replace(/[\W|_]/g, "").toLowerCase();
    if (s.length < 2) {
        return true;
    }
    let left = 0;
    let right = s.length - 1;
    while (left < right) {
        if (s[left] !== s[right]) {//对撞指针判断左右两边是否是相同的字符
            return false;
        }
        left++;
        right--;
    }
    return true;
}

三数之和(中等-5)

https://leetcode.cn/problems/3sum/description/?envType=study-plan-v2&envId=top-interview-150
private前端常见算法_第2张图片

var threeSum = function(nums) {
    if(!nums) return []
    let arr=[]
    let sort=nums.sort((a,b)=>a-b)

	for(var i=0;i<sort.length;i++){
	     var L=i+1
	     var R=sort.length-1
	     while(L<R){
	         var sum=sort[i]+sort[L]+sort[R]
	         if(sum==0){
	             //去重判断
	             if(!arr.includes([sort[i],sort[L],sort[R]])){
	             arr.push([sort[i],sort[L],sort[R]]) 
	          }
	             L++
	             R--
	             }
	             
	             if(sum<0){
	                 L++
	             }
	              if(sum>0){
	                 R--
	         }
	     }
    }
    return arr
};

console.log(threeSum([1,2,3,4,-2,-3,0]));

盛水最多的容器(中等-5)

https://leetcode.cn/problems/container-with-most-water/description/?envType=study-plan-v2&envId=top-interview-150

3.滑动窗口

长度最小的子数组(中等-4)

https://leetcode.cn/problems/minimum-size-subarray-sum/description/?envType=study-plan-v2&envId=top-interview-150

无重复字符的最长子串(中等-4)

https://leetcode.cn/problems/longest-substring-without-repeating-characters/description/?envType=study-plan-v2&envId=top-interview-150

4.矩阵

旋转图像 (中等-3)

https://leetcode.cn/problems/rotate-image/description/?envType=study-plan-v2&envId=top-interview-150

5.哈希表

两数之和(简单-5)

https://leetcode.cn/problems/two-sum/description/?envType=study-plan-v2&envId=top-interview-150

最长连续序列(中等-5)

https://leetcode.cn/problems/longest-consecutive-sequence/description/?envType=study-plan-v2&envId=top-interview-150

6. 栈

有效括号(简单-5)

https://leetcode.cn/problems/valid-parentheses/description/?envType=study-plan-v2&envId=top-interview-150

简化路径(中等-4)

https://leetcode.cn/problems/simplify-path/description/?envType=study-plan-v2&envId=top-interview-150

7. 链表

环形链表(简单-5)

https://leetcode.cn/problems/linked-list-cycle/description/?envType=study-plan-v2&envId=top-interview-150

旋转链表(中等-4)

https://leetcode.cn/problems/rotate-list/description/?envType=study-plan-v2&envId=top-interview-150

K 个一组翻转链表(中等-4)

https://leetcode.cn/problems/reverse-nodes-in-k-group/description/?envType=study-plan-v2&envId=top-interview-150

8.二叉树

二叉树最大深度(中等-3)

https://leetcode.cn/problems/maximum-depth-of-binary-tree/description/?envType=study-plan-v2&envId=top-interview-150

翻转二叉树(中等-4)

https://leetcode.cn/problems/invert-binary-tree/description/?envType=study-plan-v2&envId=top-interview-150

二叉树层序遍历(中等-4)

https://leetcode.cn/problems/binary-tree-level-order-traversal/description/?envType=study-plan-v2&envId=top-interview-150

9.回溯

电话号码的字母组合(中等-3)

https://leetcode.cn/problems/letter-combinations-of-a-phone-number/description/?envType=study-plan-v2&envId=top-interview-150

10.二分查找

搜索插入位置(中等-3)

https://leetcode.cn/problems/search-insert-position/description/?envType=study-plan-v2&envId=top-interview-150

11.堆

数组中的第 K 个最大元素(中等-3)

https://leetcode.cn/problems/xx4gT2/description/

12.位运算

二进制求和(简单-4)

https://leetcode.cn/problems/add-binary/description/?envType=study-plan-v2&envId=top-interview-150

只出现一次的数字(简单-3)

https://leetcode.cn/problems/single-number/description/?envType=study-plan-v2&envId=top-interview-150

13. 数学

回文数(简单-5)

https://leetcode.cn/problems/palindrome-number/description/?envType=study-plan-v2&envId=top-interview-150

x的平方根(简单-3)

https://leetcode.cn/problems/sqrtx/description/?envType=study-plan-v2&envId=top-interview-150

14.动态规划

爬楼梯 (简单-5)

https://leetcode.cn/problems/climbing-stairs/description/?envType=study-plan-v2&envId=top-interview-150

零钱兑换 (中等-4)

https://leetcode.cn/problems/coin-change/description/?envType=study-plan-v2&envId=top-interview-150

最长回文串(中等-4)

https://leetcode.cn/problems/longest-palindromic-substring/description/?envType=study-plan-v2&envId=top-interview-150

15.其他

扁平化转树形结构

const data = [
    // 每项主要由id和name组成,而pid指向其父节点的id
    // 如果是树节点则对应的pid为空
    { id: '01', name: '中国', pid: ''},
    { id: '02', name: '北京市', pid: '01'},
    { id: '03', name: '海淀区', pid: '02'},
    { id: '04', name: '丰台区', pid: '02'},
    { id: '05', name: '朝阳区', pid: '02'},
    { id: '06', name: '重庆市', pid: '01'},
    { id: '07', name: '渝中区', pid: '06'},
    { id: '08', name: '江北区', pid: '06'},
    { id: '09', name: '四川省', pid: '01'},
    { id: '10', name: '成都市', pid: '09'},
    { id: '11', name: '成华区', pid: '10'},
    { id: '12', name: '武侯区', pid: '10'}
];

function transNormalToTree(array) {
    let  result = [] //最终存储的结果

    // 对数组中的每个对象进行遍历
    array.forEach( item => {
        // 判断当前节点是否为根节点,如果是则push
        if (!item.pid) {
            result.push(item)
        }

        // 将所有pid等于当前id的对象储存在children数组中
        let childArray = array.filter(data => data.pid === item.id)

        // 判断当前节点是否为叶节点,如果是则退出
        if (!childArray.length) {
            return  
        }

        // 将符合条件的子数组赋值给当前项的child属性
        item.child = childArray
    })
    return result
}

console.log(transNormalToTree(data))

实现事件订阅机制

/** 
说明:简单实现一个事件订阅机制,具有监听on和触发emit方法
示例:
const event = new EventEmitter();
event.on('someEvent', (...args) => {
console.log('some_event triggered', ...args);
});
event.emit('someEvent', 'abc', '123');
// class EventEmitter { /* 功能实现 */

实现

class EventEmitter {
    constructor() {
        this.events = {}; // 存储事件及其对应的回调函数
    }
    // 监听事件
    on(eventName, callback) {
        if (!this.events[eventName]) {
            this.events[eventName] = []; // 如果事件不存在,创建一个空数组
        }
        this.events[eventName].push(callback); // 将回调函数添加到事件的回调数组中
    }
    // 触发事件
    emit(eventName, ...args) {
        if (this.events[eventName]) {
            this.events[eventName].forEach(callback => {
                callback(...args); // 调用每个回调函数,并传递参数
            });
        }
    }
}

// 示例使用
const event = new EventEmitter();

event.on('someEvent', (...args) => {
    console.log('some_event triggered', ...args);
});

event.emit('someEvent', 'abc', '123');

实现一个休眠函数

/** :实现一个函数 使当前运行的异步操作(promise 或者 async)停止等待若干秒 */
const sleep = (ms) => {
	// 请补充
}

(async () => { 
  console.log('hello');
  // 等待两秒 
  await sleep(20000);
  console.log('world'); 
})()
const sleep = (ms: number) => {
  return new Promise(resolve => setTimeout(resolve, ms));
};

(async () => {
  console.log('hello');
  await sleep(2000); // 等待两秒
  console.log('world');
})();

解析url

/** 
 * 编辑试题描述 // 实现一个方法,拆解URL参数中queryString 
 * // 入参格式参考: const url = 'http://sample.com/?a=1&b=2&c=xx&d#hash'; 
 * const params = { a: '5', e: '6'};
// 出参格式参考: const result = { a: '5', b: '2', c: 'xx', d: '', e: '6' };
// 拆解URL参数中queryString,返回一个 key - value 形式的 object function querySearch(url, params) { // 在这里写代码}
 */
 function querySearch(url, params) {
    let result={}
    const queryString = url.split('?')[1]?.split('#')[0] || '';
    console.log(queryString);
    const queryParams = new URLSearchParams(queryString);
    // console.log(queryParams);//{ 'a' => '1', 'b' => '2', 'c' => 'xx', 'd' => '' }
    
    queryParams.forEach((value,index)=>{
        result[index]=value
    })
    
    return {...result,...params}
 }

// 示例
const url = 'http://sample.com/?a=1&b=2&c=xx&d#hash';
const params = { a: '5', e: '6' };
const result = querySearch(url, params);
console.log(result); // { a: '5', b: '2', c: 'xx', d: '', e: '6' }

金额处理

/**
实现金额千位分隔符,用法如下
parseToMoney(1234.56); // return '1,234.56'
parseToMoney(123456789); // return '123,456,789'
parseToMoney(1087654.321); // return '1,087,654.321'
*/
//正则
function parseToMoney(num: number): string {
  const [integerPart, decimalPart] = num.toString().split('.');
  const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
  return decimalPart ? `${formattedInteger}.${decimalPart}` : formattedInteger;
}

//不用正则
function parseToMoney(num: number): string {
  const [integerPart, decimalPart] = num.toString().split('.');
  const reverseInteger = integerPart.split('').reverse().join('');
  let formattedInteger = '';

  for (let i = 0; i < reverseInteger.length; i++) {
    if (i > 0 && i % 3 === 0) {
      formattedInteger += ',';
    }
    formattedInteger += reverseInteger[i];
  }

  formattedInteger = formattedInteger.split('').reverse().join('');
  return decimalPart ? `${formattedInteger}.${decimalPart}` : formattedInteger;
}

// 示例
console.log(parseToMoney(1234.56)); // '1,234.56'
console.log(parseToMoney(123456789)); // '123,456,789'
console.log(parseToMoney(1087654.321)); // '1,087,654.321'

扁平化数组

/** 数组扁平化处理,并排序
    var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10]; // newArr = [1, 2, 3, 4, 5, 6, 7 ,8, 9, 10, 11, 12, 13, 14];
    const newArr = myFlatten(arr) 
    console.log(newArr)
 */
function myFlatten (req) { 
    // 请补充
}
function myFlatten(arr: any[]): number[] {
  return arr.reduce((acc, val) => acc.concat(Array.isArray(val) ? myFlatten(val) : val), []).sort((a, b) => a - b);
}

// 示例
const arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];
const newArr = myFlatten(arr);
console.log(newArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14]

版本号排序

// let arr=['1.5','1.45','5.1','1.2.3','2.6']请对版本号排序
//结果 ["1.2.3", "1.5", "1.45", "2.6", "5.1"]

let arr = ['1.5', '1.45', '5.1', '1.2.3', '2.6'];

function compareVersions(a, b) {
    let arrA = a.split('.').map(Number);
    let arrB = b.split('.').map(Number);

    let maxLength = Math.max(arrA.length, arrB.length);

    for (let i = 0; i < maxLength; i++) {
        let numA = arrA[i] || 0;
        let numB = arrB[i] || 0;

        if (numA !== numB) {
            return numA - numB;
        }
    }

    return 0;
}

arr.sort(compareVersions);

console.log(arr);
function jugdge(a,b){
   let arrA=  a.split('.')
   let arrB=  b.split('.')
   for (let index = 0; index < arrA.length; index++) {
     if(Number(arrA[index])>Number(arrB[index])) return 1
     if(Number(arrA[index])<Number(arrB[index])) return -1
   }
   return 0
 }
 console.log(arr.sort(jugdge));

深拷贝

function deepCopy(obj) {
  if (obj === null || typeof obj !== 'object') {
    return obj; // Return primitives and null as-is
  }

  if (Array.isArray(obj)) {
    const arrCopy = [];
    for (let i = 0; i < obj.length; i++) {
      arrCopy[i] = deepCopy(obj[i]); // Recursively copy array elements
    }
    return arrCopy;
  }

  const objCopy = {};
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
      objCopy[key] = deepCopy(obj[key]); // Recursively copy object properties
    }
  }
  return objCopy;
}

// Example usage:
const original = {
  a: 1,
  b: { c: 2 },
  d: [3, { e: 4 }],
};

const copied = deepCopy(original);

console.log(copied); // { a: 1, b: { c: 2 }, d: [ 3, { e: 4 } ] }
console.log(copied === original); // false
console.log(copied.b === original.b); // false
console.log(copied.d === original.d); // false

贴一些优秀的文章

https://blog.csdn.net/chaoPerson/article/details/135651532

你可能感兴趣的:(2025_react_run,react.js)