前端js中经常出现的算法总结

一:排序算法
   排序算法是比较开发的算法之一,方法种类较多,在此列举两种简单的排序算法:冒泡排序和快速排序。冒泡排序其实就是通过比较相邻位置的元素大小,如果左边比右边大,就交换位置,继续比较,实际上就是每轮比较都得出一个最大值(或者最小值)。然后通过n-1轮比较,就能得出一个排好序的序列(通过设置一个flag,当数组基本有序的时候其实不一定需要比较到n-1轮)。

 function bubbleSort(arr){
   for(var i=1;i     for(var j=0;j      var temp;
      if(arr[j]>arr[j+1]){
         temp=arr[j];
         arr[j]=arr[j+1];
         arr[j+1]=temp;
      }
     }
    }
    return arr;
  }

快速排序简单来讲就是我们选定一个数,然后比它小的都放在它左边,大于等于它的都放在它右边,那么这个时候对这个数来讲他的位置已经排到了正确的地方了,接下来要做的就是在它的左右两边分别再进行类似操作。
function quickSort(arr,l,r){
var i,j,x;
if(l< r){
i=l;
j=r;
x=arr[i];
while(i< j){
while(i< j&&arr[j]>=x){
j--;
}
if(i< j){
arr[i]=arr[j];
}
while(i< j&&arr[i]< x){
i++;
}
if(i< j){
arr[j]=arr[i];
}
}
arr[i]=x;
//递归调用
quickSort(arr,i+1,r);
quickSort(arr,l,i-1);
}
return arr;
}
二:阶乘算法

function factorialize(num) {
var result = num;
if (num < 0) {
return -1;
} else if (num === 0 || num === 1) {
return 1;
} else {
while (num > 1) {
num--;
result *= num;
}
}
return result;
}
三:回文字符串判断

如果一个字符串忽略标点符号、大小写和空格,正着读和反着读一模一样,那么这个字符串就是palindrome(回文)。

function palindrome(str) {
// 删除字符串中不必要的字符
var re = /[W_]/g;
// 将字符串变成小写字符
var lowRegStr = str.toLowerCase().replace(re, '');
// 如果字符串lowRegStr的length长度为0时,字符串即是palindrome
if (lowRegStr.length === 0) {
return true;
}
// 如果字符串的第一个和最后一个字符不相同,那么字符串就不是palindrome
if (lowRegStr[0] !== lowRegStr[lowRegStr.length - 1]) {
return false;
} else {
return palindrome(lowRegStr.slice(1, lowRegStr.length - 1));
}
}

四:翻转字符串算法

function reverseString(str) {
var tmp = "";
for (var i = str.length - 1; i >= 0; i--) {
tmp += str.charAt(i);
}
return tmp;
}

第二种翻转字符串算法:

function reverseString(s) {
var arr = s.split('');
var i = 0, j = arr.length - 1;
while (i < j) {
var t = arr[i];
arr[i] = arr[j];
arr[j] = t;
i++;
j--;
}
return arr.join('');
}

五:整型数组去重算法

主要考察程序员对Object的使用,利用key来进行筛选。

function unique(arr){
var hashTable = {};
var data = [];
for(var i = 0, l = arr.length; i < l; i++) {
if(!hashTable[arr[i]]) {
hashTable[arr[i]] = true;
data.push(arr[i]);
}
}
return data;
}
六:数组中最大差值

function getMaxProfit(arr) {
var minPrice = arr[0];
var maxProfit = 0;
for (var i = 0; i < arr.length; i++) {
var currentPrice = arr[i];
minPrice = Math.min(minPrice, currentPrice);
var potentialProfit = currentPrice - minPrice;
maxProfit = Math.max(maxProfit, potentialProfit);
}
return maxProfit;
}

七:随机指定长度字符串

function randomString(n) {
var str = 'abcdefghijklmnopqrstuvwxyz9876543210';
var tmp = '';
var l = str.length;
for(var i = 0; i < n; i++) {
tmp += str.charAt(Math.floor(Math.random() * l));
}
return tmp;
}

八:统计字符串中次数最多字母
function findMaxDuplicateChar(str) {
if(str.length == 1) {
return str;
}
var charObj = {};
for(var i = 0; i < str.length; i++) {
if(!charObj[str.charAt(i)]) {
charObj[str.charAt(i)] = 1;
} else {
charObj[str.charAt(i)] += 1;
}
}
var maxChar = '',
maxValue = 1;
for(var k in charObj) {
if(charObj[k] >= maxValue) {
maxChar = k;
maxValue = charObj[k];
}
}
return maxChar;
}
九:生成菲波那切数列数组

斐波那契数列,又称黄金分割数列,指的是这样一个数列:0、1、1、2、3、5、8、13、21、34、……在数学上,斐波纳契数列主要考察递归的调用。通过定义fibo[i] = fibo[i-1]+fibo[i-2];来生成斐波那契数组。

function getFibonacci(n) {
var fibarr = [];
var i = 0;
while(i < n) {
if(i <= 1) {
fibarr.push(i);
} else {
fibarr.push(fibarr[i - 1] + fibarr[i - 2])
}
i++;
}
return fibarr;
}
以上几个前端中经常会出现的小算法是学习中的练习和总结,整理此文如果有错误希望小伙伴们积极指正,有更好更简洁的算法知识也希望不吝分享,以求共同进步。


与本文有关的文章

express/ multer 上传图片文件 html图片延迟加载 一段奇葩Javascript代码引发的思考 JavaScript两个变量交换值(不使用临时变量) ES6中Math对象的部分扩展 JavaScript中为什么string可以拥有方法? 前端js中经常出现的算法总结 canvas粒子瀑布 canvas纺纱飘带 JavaScript求最长公共子串 JavaScript中的__proto__ JS判断访问设备或型号 js获取url?后的参数 js键盘keyCode对照表 页面鼠标滚动事件 对象克隆或拷贝不是赋值 URL参数含有中文出现乱码 es6常用的的语法大集合 js中的this关键字 js中实现 a*寻路算法 js中用 '==' 还是 '===' web性能优化 reflow(回流)与repaint(重绘) 7年前端大神总结出的js经验 scroll事件常用到的场景,以及判断 js中深度拷贝与浅拷贝 requirejs基础知识 判断参数是什么类型?array?object? 有趣的js基础选择题 js中哪些值能作为if的条件,if使用小技巧 js中键盘按下事件keydown js中的!function到底是什么意思? AMD与CMD的区别到底在哪? Array与Math属性 方法一览 js中的栈与堆 jquery为动态添加生成的元素添加绑定事件 delegate 自己常用的正则(regexp)整理 57秒读完《10 分钟学会 JavaScript 的 Async/Await》 最简单的数组去重 js中数字调用方法 jq或者原生js动态加载js文件方法 个人常用封装的js插件 select默认选中某个option 正则表达式提取cookie 原生ajax写法 js倒计时方法 js 时间戳相关操作方法 html关于页面跳转url带参数 indexOf,charAt,subString的简要区别 JS页面返回带参数或者保持原有位置 js中的钩子机制(hook) vue中的addClass removeClass &#x(unicode编码后的汉字)JS转译方法-nodejs爬虫转译乱码 es6/7 js数组深拷贝和数组合并方法 【html5】原生JS控制video的播放和暂停切换 前端 fetch 前端 PWA? js处理手机号|身份证中间替换成 * 号 js时间戳转换为本地时间 timestamp>localtime es6中 数组位置对换 js 数组对象循环各种方法以及性能对比 js实用黑科技之生产随机数 js加密之AES es6遍历对象方法 js删除字符串的的方法 JS中的Array长度最大可以设置为多少? html img加载失败的话替换成默认图片 图片压缩插件 lrz.bundle.js js手机号中间四位变成*号 javascript 到底要不要加分号 酷炫烟雾效果的前端js插件 waterpipe.js js稀奇古怪问题之指向 现代浏览器和触摸设备上重新排序拖放列表 - Sortable.min.js 一个监听键盘的js库 - hotkeys.js canvas操作图片合成 或文字叠加 并导出base64 字符转换-unicode <=> ASCII js删除某一个指定元素 禁止 百度ueditor过滤script link js正则效验金额最多两位小数 原生js获取元素offsetTop值不准确? 浏览器控制台跳过debugger 打乱数组顺序的两种方法 js 中的 bind介绍 原生js移除元素 document.removeElementById ?? js string进制互转 input 点击选择全部文本 点击全选 js点击复制input的值 JS/JQ获取各种屏幕的高度和宽度 闭包之[[Scopes]]属性 JS操纵html5 audio 播放以及暂停 原生js 给dom添加 onmouseenter ontouchstart 事件 Js charCodeAt fromCharCode parseInt js位操作教程 js byte[] 和string 相互转换 UTF-8 data URI 转 image data 原生JS实现 addClass removeClass hasClass JS实现为动态添加的元素增加事件 js查找页面中alert弹窗位置 JS实现Jquery的addClass,removeClass,changeClass,toggleClass HTML5 Blob与ArrayBuffer、TypeArray和字符串String之间转换 JavaScript如何转换二进制数据显示成图片 Uint8Array转成可用的imgurl es6数组快速删除指定元素 支付宝小程序与微信小程序的不同点对比 JS数组按数字的大小排序 js对象数组按照对象属性排序 js点击按钮播放音乐
回到顶部