JS常见算法详解


Posted in Javascript onFebruary 28, 2017

算法是程序的灵魂,一个优秀前端工程师对算法也是要有所了解的,本文总结了我们在开发、面试中经常会遇到的基础算法,使用原生JS实现,未必是最优解,可以互相探讨。

为了便于查看,简单分下类,本文也会持续更新。

排序算法

1. 冒泡排序

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

2. 快速排序

function quickSort(arr,l,r){
 if(l < r){
 var i = l, j = r, x = arr[i];
 while(i<j){
 while(i<j && arr[j]>x)
 j--;
 if(i<j)
 //这里用i++,被换过来的必然比x小,赋值后直接让i自加,不用再比较,可以提高效率
 arr[i++] = arr[j];
 while(i<j && arr[i]<x)
 i++;
 if(i<j)
 //这里用j--,被换过来的必然比x大,赋值后直接让j自减,不用再比较,可以提高效率
 arr[j--] = arr[i];
 }
 arr[i] = x; 
 quickSort(arr, l, i-1);
 quickSort(arr, i+1, r);
 }
}

3. 二路归并

PS:将两个按值有序序列合并成一个按值有序序列,则称之为二路归并排序。

function merge(left, right) {
 var result = [],
  il = 0,
  ir = 0;
 while (il < left.length && ir < right.length) {
  if (left[il] < right[ir]) {
   result.push(left[il++]);
  } else {
   result.push(right[ir++]);
  }
 }
 while(left[il]){
  result.push(left[il++]);
 }
 while(right[ir]){
  result.push(right[ir++]);
 }
 return result;
}

字符串操作

1. 判断回文字符串

function palindrome(str){
 // \W匹配任何非单词字符。等价于“[^A-Za-z0-9_]”。
 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;
 //递归
 return palindrome(lowRegStr.slice(1,lowRegStr.length-1));
}

2. 翻转字符串

2.1 思路1:反向遍历字符串

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

2.2 思路2:转化成array操作。

function reverseString2(str){
 var arr = str.split("");
 var i = 0,j = arr.length-1;
 while(i<j){
  tmp = arr[i];
  arr[i] = arr[j];
  arr[j] = tmp;
  i++;
  j--;
 }
 return arr.join("");
}

PS:什么?你要问为啥不直接操作str? 因为str[i]是只读的,不能str[0]=str[1]这样操作。

再PS:如果允许用reverse(),也可以用'str'.split('').reverse().join('')实现。

3. 生成指定长度随机字符串

PS:配合模糊等效果可以生成个验证码- -

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

4. 统计字符串中次数最多字母

PS:利用Object中key的唯一性,利用key来进行筛选,然后计数。

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 + ':' + maxValue;
}

数组操作

1. 数组去重

PS: 还是利用Object中key的唯一性,利用key来进行筛选。

function unique(arr){
 var obj = {}
 var data = []
 for(var i in arr){
  if(!obj[arr[i]]){
   obj[arr[i]] = true;
   data.push(arr[i]);
 }
 }
 return data;
}

2. Number数组中最大差值

function getMaxProfit(arr){
 var min = arr[0], max = arr[0];
 for(var i=0;i<arr.length;i++){
  if(arr[i]<min)
   min = arr[i];
 if(arr[i]>max)
  max = arr[i];
 }
 return max - min;
}

其他常见算法

1. 阶乘

1.1 非递归实现

function factorialize(num) {
 var result = 1;
 if(num < 0) return -1;
 if(num == 0 || num == 1) return 1;
 while(num>1)
  result *= num--;
 return result;
}

1.2 递归实现

function factorialize(num) {
 var result = 1;
 if(num < 0) return -1;
 if(num == 0 || num == 1) return 1;
 if(num > 1){
  return num*factorialize(num-1);
 }
}

2. 生成菲波那切数列

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

2.1 强行递归实现

function getfib(n){
 if(n == 0)
 return 0;
 if(n == 1)
  return 1;
 if(n > 1){
 return getfib(n-1) + getfib(n-2);
 }
}
function fibo(len){
 var fibo = [];
 for(var i=0;i<len;i++)
 fibo.push(getfib(i));
 return fibo;
}

2.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;
}

3. 二分查找

PS:二分查找又称折半查找,是在有序数组查找中用到的较为频繁的一种算法,优点是比较次数少,查找速度快,平均性能好;其缺点是要求待查表为有序表,且插入删除困难。

3.1 非递归实现

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;
  }
 }
 return -1;
};

3.2 递归实现

function binary_search2(arr, low, high, key) {
 if(low > high)
  return -1;
 var mid = parseInt((low + high)/2);
 if(key == arr[mid])
  return mid;
 else if(key > arr[mid])
  return binary_search2(arr, mid+1, high, key);
 else if(key < arr[mid])
  return binary_search2(arr, low, mid-1, key);
}

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
初窥JQuery(二) 事件机制(1)
Nov 25 Javascript
判定是否原生方法的JS代码
Nov 12 Javascript
jQuery通过点击行来删除HTML表格行的实现示例
Sep 10 Javascript
Jquery简单分页实现方法
Jul 24 Javascript
javascript类型系统——undefined和null全面了解
Jul 13 Javascript
浅谈Web页面向后台提交数据的方式和选择
Sep 23 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
Nov 22 Javascript
80%应聘者都不及格的JS面试题
Mar 21 Javascript
Angualrjs 表单验证的两种方式(失去焦点验证和点击提交验证)
May 09 Javascript
详解Angular路由 ng-route和ui-router的区别
May 22 Javascript
jquery简单实现纵向的无缝滚动代码实例
Apr 01 jQuery
微信小程序中显示倒计时代码实例
May 09 Javascript
vue.js树形组件之删除双击增加分支实例代码
Feb 28 #Javascript
jQuery插件MovingBoxes实现左右滑动中间放大图片效果
Feb 28 #Javascript
jQuery中的on与bind绑定事件区别实例详解
Feb 28 #Javascript
利用angularjs1.4制作的简易滑动门效果
Feb 28 #Javascript
js 转义字符及URI编码详解
Feb 28 #Javascript
基于Bootstrap漂亮简洁的CSS3价格表(附源码下载)
Feb 28 #Javascript
基于vue2.0+vuex+localStorage开发的本地记事本示例
Feb 28 #Javascript
You might like
php出现内存位置访问无效错误问题解决方法
2014/08/16 PHP
php上传文件问题汇总
2015/01/30 PHP
如何解决PHP使用mysql_query查询超大结果集超内存问题
2016/03/14 PHP
thinkPHP框架可添加js事件的分页类customPage.class.php完整实例
2017/03/16 PHP
PHP面向对象中new self()与 new static()的区别浅析
2017/08/17 PHP
基于jQuery选择器的整理集合
2013/04/26 Javascript
jQuery控制TR显示隐藏的几种方法
2014/06/18 Javascript
学习JavaScript设计模式之观察者模式
2020/04/22 Javascript
基于jquery实现轮播焦点图插件
2016/03/31 Javascript
Bootstrap.css与layDate日期选择样式起冲突的解决办法
2017/04/07 Javascript
webpack打包后直接访问页面图片路径错误的解决方法
2017/06/17 Javascript
基于easyui checkbox 的一些操作处理方法
2017/07/10 Javascript
浅谈在Vue-cli里基于axios封装复用请求
2017/11/06 Javascript
vue 全选与反选的实现方法(无Bug 新手看过来)
2018/02/09 Javascript
vuex与组件联合使用的方法
2018/05/10 Javascript
基于webpack4搭建的react项目框架的方法
2018/06/30 Javascript
使用express获取微信小程序二维码小记
2019/05/21 Javascript
Vue+Element UI+vue-quill-editor富文本编辑器及插入图片自定义
2019/08/20 Javascript
[01:09:01]完美世界DOTA2联赛循环赛 Magma vs PXG BO2第一场 10.28
2020/10/28 DOTA
详解Python字符串对象的实现
2015/12/24 Python
cmd运行python文件时对结果进行保存的方法
2018/05/16 Python
python itchat实现调用微信接口的第三方模块方法
2019/06/11 Python
Python模块相关知识点小结
2020/03/09 Python
解决使用python print打印函数返回值多一个None的问题
2020/04/09 Python
python中count函数知识点浅析
2020/12/17 Python
欧洲顶级体育电子商务网站:SportsShoes.com
2018/03/27 全球购物
ECCO俄罗斯官网:北欧丹麦鞋履及皮具品牌
2020/06/26 全球购物
远程学习的教学用品和家庭学习资源:Really Good Stuff
2020/04/27 全球购物
配置管理计划的主要内容有哪些
2014/06/20 面试题
车工岗位职责
2013/11/26 职场文书
客服部工作职责范本
2014/02/14 职场文书
银行贷款承诺书
2014/03/29 职场文书
信息与计算机科学职业规划范文:成为一艘有方向的船
2014/09/11 职场文书
法院个人总结
2015/03/03 职场文书
幼儿园教师求职信
2015/03/20 职场文书
小学四年级作文之写景
2019/08/23 职场文书