前端算法收集库

1. 前言
前端算法代码收集库

旨在帮助大家提高javascript编码水平,代码规范,面对面试官问最难的算法问题也能从容应对

这是一个常见的js算法面试题收集库,包含测试,欢迎star,如果库中没有的算法,欢迎提issue或者PR,补全。
提到算法,这里就要说下时间复杂度。
时间复杂度:算法的时间复杂度是一个函数,描述了算法的运行时间。时间复杂度越低,效率越高。
2. 关于代码规范
俗话说,无规矩不成方圆,所以平时一定要养成良好的编码习惯

Code Guide
在js开发前需要的东西(规范)

3. 关于代码测试
学习测试和持续集成(Continuous Integration,简称CI,意思是,在一个项目中,任何人对代码库的任何改动,都会触发CI服务器自动对项目进行构建,自动运行测试,甚至自动部署到测试环境。这样做的好处就是,随时发现问题,随时修复。因为修复问题的成本随着时间的推移而增长,越早发现,修复成本越低)。

javascript CI篇
测试框架 Mocha 实例教程
karma 测试框架的前世今生

4. 常见算法
4.1 二分查找
算法介绍
二分法查找,也称折半查找,是一种在有序数组中查找特定元素的搜索算法。查找过程可以分为以下步骤:
(1)首先,从有序数组的中间的元素开始搜索,如果该元素正好是目标元素(即要查找的元素),则搜索过程结束,否则进行下一步。
(2)如果目标元素大于或者小于中间元素,则在数组大于或小于中间元素的那一半区域查找,然后重复第一步的操作。
(3)如果某一步数组为空,则表示找不到目标元素。
参考代码:
非递归算法
function binary_search(arr,key){
  var low=0,
  high=arr.length-1;
  while(low<=high){
     var mid=parseInt((high+low)/2);
     if(key==arr[mid]){
        return mid;
     }else if(key>arr[mid]){
        low=mid+1;
     }else if(key<arr[mid]){
        high=mid-1;
    }else{
      return -1;
    }
  }
};
var arr=[1,2,3,4,5,6,7,8,9,10,11,23,44,86];
var result=binary_search(arr,10);
alert(result); // 9 返回目标元素的索引值
复制代码递归算法
function binary_search(arr,low,high,key){
  if(low>high){
    return -1;
  }
  var mid=parseInt((high+low)/2);
  if(arr[mid]==key){
    return mid;
  }else if(arr[mid]>key){
    high=mid-1;
    return binary_search(arr,low,high,key);
  }else if(arr[mid]<key){
    low=mid+1;
    return binary_search(arr,low,high,key);
  }
};
var arr=[1,2,3,4,5,6,7,8,9,10,11,23,44,86];
var result=binary_search(arr,0,13,10);
alert(result); // 9 返回目标元素的索引值
复制代码4.2 排序
4.2.1 冒泡排序
算法介绍
解析:

比较相邻的两个元素,如果前一个比后一个大,则交换位置。
第一轮的时候最后一个元素应该是最大的一个。
按照步骤一的方法进行相邻两个元素的比较,这个时候由于最后一个元素已经是最大的了,所以最后一个元素不用比较。

js代码实现
function bubble_sort(arr){
  for(var i=0;i<arr.length-1;i++){
    for(var j=0;j<arr.length-i-1;j++){
      if(arr[j]>arr[j+1]){
        var swap=arr[j];
        arr[j]=arr[j+1];
        arr[j+1]=swap;
      }
    }
  }
}

var arr=[3,1,5,7,2,4,9,6,10,8];
bubble_sort(arr);
console.log(arr);
复制代码4.2.2快速排序
js代码实现
解析:快速排序是对冒泡排序的一种改进,第一趟排序时将数据分成两部分,一部分比另一部分的所有数据都要小。然后递归调用,在两边都实行快速排序。
function quick_sort(arr){
  if(arr.length<=1){
    return arr;
  }
  var pivotIndex=Math.floor(arr.length/2);
  var pivot=arr.splice(pivotIndex,1)[0];

  var left=[];
  var right=[];
  for(var i=0;i<arr.length;i++){
    if(arr[i]<pivot){
      left.push(arr[i]);
    }else{
      right.push(arr[i]);
    }
  }

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

var arr=[5,6,2,1,3,8,7,1,2,3,4,7];
console.log(quick_sort(arr));
复制代码4.2.3 插入排序
算法介绍
解析:

从第一个元素开始,该元素可以认为已经被排序
取出下一个元素,在已经排序的元素序列中从后向前扫描
如果该元素(已排序)大于新元素,将该元素移到下一位置
重复步骤3,直到找到已排序的元素小于或者等于新元素的位置
将新元素插入到下一位置中
重复步骤2

js代码实现
function insert_sort(arr){
  var i=1,
  j,key,len=arr.length;
  for(;i<len;i++){
    var j=i;
    var key=arr[j];
    while(--j>-1){
      if(arr[j]>key){
        arr[j+1]=arr[j];
      }else{
        break;
      }
    }

    arr[j+1]=key;
  }

  return arr;
}

insert_sort([2,34,54,2,5,1,7]);

作者:极客教程
链接:https://juejin.im/post/5aa4cd1051882577b45ea2c3
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

原文地址:https://www.cnblogs.com/hjptopshow/p/11428304.html

时间: 2024-10-08 10:41:55

前端算法收集库的相关文章

前端名词收集

收集于互联网 update at 2016年10月02日19:40:25 IIFE ("Immediately Invoked Function Expression") (function(param){ })(params); shim和polyfill shim的意思是在一个老(旧)环境中模拟出一个新API,有时也叫做shiv,例如著名的html5shiv库. polyfill的意思和shim差不多,2010年10月份Remy Sharp引进了这个概念,一个polyfill是一段

前端组件收集整理列表

https://www.luoxiao123.cn/1196.html 这里是收集的web前端开发常用前端开发组件库,搭建web app常用的样式/组件等收集列表(移动优先).主要包含前端框架,构建工具,自动化模块.jQuery插件.前端样式等,囊括最实用的前端开发组件库! 0. 前端自动化 前端构建工具 gulp – The streaming build system grunt – the JavaScript Task Runner webpack(模块管理兼打包):http://web

asp中的md5/sha1/sha256算法收集

对于asp这种古董级的技术,这年头想找一些有用的资料已经不容易了,下面是一些常用的加密算法: md5 (将以下代码另存为md5.inc) + ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62

一枚前端UI组件库 KUI for Vue

一枚前端UI组件库 KUI for Vue 基于VUE 2.x 开发,在追求完美视觉体验的同时也保证了其性能高效. 欢迎批评.指正.吐槽.Star 和 捐助 文档 Docs: http://k-ui.xyz Blog: http://chuchur.com 特性 漂亮的UI,可定制主题 兼容IE9+ 组件丰富,功能强大 更新日志: Logs: http://vue.k-ui.xyz/log 安装 使用npm npm install kui-vue --save 使用CDN <!-- import

一枚前端UI组件库 KUI for React

一枚前端UI 组件库 for React 在追求完美视觉体验的同时也保证了其性能高效. 欢迎使用 .批评.指正.吐槽.Star? 特性 漂亮的UI,可定制主题 兼容IE9+ 组件丰富,功能强大 更新日志 logs:https://react.k-ui.cn/#/log 文档 Docs : https://react.k-ui.cn Github: https://gitee.com/chuchur/kui-react 安装 npm install react-kui 使用 ```js impor

【深度】扒开V8引擎的源码,我找到了你们想要的前端算法(下次面试官再问算法,用它怼回去!)

算法对于前端工程师来说总有一层神秘色彩,这篇文章通过解读V8源码,带你探索`Array.prototype.sort`函数下的算法实现. 来,先把你用过的和听说过的排序算法都列出来: * 快速排序 * 冒泡排序 * 插入排序 * 归并排序 * 堆排序 * 希尔排序 * 选择排序 * 计数排序 * 桶排序 * 基数排序 * ... 答题环节到了, sort 函数使用的以上哪一种算法? 如果你在网上搜索过关于 sort 源码的文章,可能会告诉你数组长度小于10用插入排序,否则用快速排序. 开始我也是

前端常用的库和实用技术之JavaScript高级技巧

javascript高级技巧 变量作用域和闭包 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X

前端里的库和框架

库和框架是什么呢? 虽然有时候在一些语境中他们是可以互相替代的,但是我们还是要了解下他们的真正含义. 库:它是一系列对象,方法的代码,我们通过引入库,来实现代码的重用,代码的精简. 框架:它是一个系统中可以重用的一部分,它可能不仅仅包括一种代码和资源,它可能包括了子程序,库,胶水语言,图片等等一系列资源. 所以,相对来说,框架的内容更加丰富,在某些情景中,它可能包括了多个库,多种脚本语言,多个子程序,图片等等. 举个栗子~现在应用十份广泛的JQuery就是一个库.JQuery里面都是Javasc

手机前端框架UI库(Frozen UI、WeUI、SUI Mobile)

Frozen UI 自述:简单易用,轻量快捷,为移动端服务的前端框架. 主页:http://frozenui.github.io/ 开发团队:QQVIP FD Team Github:https://github.com/frozenui/frozenui Demo:http://frozenui.github.io/frozenui/demo/index.html WeUI 自述:WeUI是一套同微信原生视觉体验一致的基础样式库,为微信 Web 开发量身设计,可以令用户的使用感知更加统一. 开