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 相关文章推荐
JavaScript的变量作用域深入理解
Oct 25 Javascript
jQuery对表单的操作代码集合
Apr 06 Javascript
jquery数组过滤筛选方法grep()简介
Jun 06 Javascript
Javascript之BOM(window对象)详解
May 25 Javascript
javascript与jquery动态创建html元素示例
Jul 25 Javascript
Bootstrap按钮功能之查询按钮和重置按钮
Oct 26 Javascript
bootstrap中添加额外的图标实例代码
Feb 15 Javascript
fullPage.js和CSS3实现全屏滚动效果
May 05 Javascript
Node.JS利用PhantomJs抓取网页入门教程
May 19 Javascript
用Vue-cli搭建的项目中引入css报错的原因分析
Jul 20 Javascript
JavaScript同源策略和跨域访问实例详解
Apr 03 Javascript
JavaScript或jQuery 获取option value值方法解析
May 12 jQuery
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求最大子序列和的算法实现
2011/06/24 PHP
PHP中new static()与new self()的比较
2016/08/19 PHP
PHP弱类型的安全问题详细总结
2016/09/25 PHP
完美解决在ThinkPHP控制器中命名空间的问题
2017/05/05 PHP
简单谈谈PHP面向对象之标识对象
2017/06/27 PHP
php strftime函数获取日期时间(switch用法)
2018/05/16 PHP
PHP 实现 JSON 数据的编码和解码操作详解
2020/04/22 PHP
通用于ie和firefox的函数 GetCurrentStyle (obj, prop)
2006/12/27 Javascript
在线编辑器的实现原理(兼容IE和FireFox)
2007/03/09 Javascript
Javascript 文件夹选择框的两种解决方案
2009/07/01 Javascript
构造函数+原型模式构造js自定义对象(最通用)
2014/05/12 Javascript
js实现选中页面文字将其分享到新浪微博
2015/11/05 Javascript
利用Query+bootstrap和js两种方式实现日期选择器
2017/01/10 Javascript
原生JS实现《别踩白块》游戏(兼容IE)
2017/02/20 Javascript
基于vue2.0实现的级联选择器
2017/06/09 Javascript
AngularJS实现的省市二级联动功能示例【可对选项实现增删】
2017/10/26 Javascript
微信小程序分享功能之按钮button 边框隐藏和点击隐藏
2018/06/14 Javascript
js实现json数组分组合并操作示例
2019/02/12 Javascript
基于node.js实现爬虫的讲解
2019/02/18 Javascript
使用VueRouter的addRoutes方法实现动态添加用户的权限路由
2019/06/03 Javascript
js实现弹窗效果
2020/08/09 Javascript
Openlayers学习之加载鹰眼控件
2020/09/28 Javascript
JavaScript代码实现简单计算器
2020/12/27 Javascript
Python实现的txt文件去重功能示例
2018/07/07 Python
Numpy之文件存取的示例代码
2018/08/03 Python
Pandas 重塑(stack)和轴向旋转(pivot)的实现
2019/07/22 Python
Python控制台输出时刷新当前行内容而不是输出新行的实现
2020/02/21 Python
python计算Content-MD5并获取文件的Content-MD5值方式
2020/04/03 Python
python实现对变位词的判断方法
2020/04/05 Python
10个很棒的 CSS3 开发工具 推荐
2011/05/16 HTML / CSS
客户经理竞聘演讲稿
2014/05/15 职场文书
小学教师师德师风自我剖析材料
2014/09/29 职场文书
二年级上册数学教学计划
2015/01/20 职场文书
圣诞晚会主持词
2015/07/01 职场文书
职场:企业印章管理制度(模板)
2019/10/18 职场文书
Go 语言结构实例分析
2021/07/04 Golang