前端⾯试中常见的算法问题总结
虽说我们很多时候前端很少有机会接触到算法。⼤多都交互性的操作，然⽽从各⼤公司⾯试来看，算法依旧是考察的⼀⽅⾯。实际上学习数据结构与算法对于⼯程师去理解和分析问题都是有帮助的。如果将来当我们⾯对较为复杂的问题，这些基础知识的积累可以帮助我们更好的优化解决思路。下⾯罗列在前端⾯试中经常撞见的⼏个问题吧。
Q1 判断⼀个单词是否是回⽂？
回⽂是指把相同的词汇或句⼦，在下⽂中调换位置或颠倒过来，产⽣⾸尾回环的情趣，叫做回⽂，也叫回环。⽐如 mamam
redivider .
很多⼈拿到这样的题⽬⾮常容易想到⽤for 将字符串颠倒字母顺序然后匹配就⾏了。其实重要的考察的就是对于reverse的实现。其实我们可以利⽤现成的函数，将字符串转换成数组，这个思路很重要，我们可以拥有更多的⾃由度去进⾏字符串的⼀些操作。
function checkPalindrom(str) {
return str == str.split('').reverse().join('');
}
Q2 去掉⼀组整型数组重复的值
⽐如输⼊: [1,13,24,11,11,14,1,2]
输出: [1,13,24,11,14,2]
需要去掉重复的11 和 1 这两个元素。
这道问题出现在诸多的前端⾯试题中，主要考察个⼈对Object的使⽤，利⽤key来进⾏筛选。
/**
* unique an array
**/
let unique = function(arr) {
let hashTable = {};
let data = [];
for(let i=0,l=arr.length;i<l;i++) {
if(!hashTable[arr[i]]) {
hashTable[arr[i]] = true;
data.push(arr[i]);
}
}
return data
}
Q3 统计⼀个字符串出现最多的字母
给出⼀段英⽂连续的英⽂字符窜，出重复出现次数最多的字母
输⼊： afjghdfraaaasdenas
输出： a
前⾯出现过去重的算法，这⾥需要是统计重复次数。
function findMaxDuplicateChar(str) {
if(str.length == 1) {
return str;
}
let charObj = {};
for(let i=0;i<str.length;i++) {
if(!charObj[str.charAt(i)]) {
charObj[str.charAt(i)] = 1;
}else{
charObj[str.charAt(i)] += 1;
}
}
let maxChar = '',
maxValue = 1;
for(var k in charObj) {
if(charObj[k] >= maxValue) {
maxChar = k;
maxValue = charObj[k];
}
}
return maxChar;
}
Q4 排序算法
如果抽到算法题⽬的话，应该⼤多都是⽐较开放的题⽬，不限定算法的实现，但是⼀定要求掌握其中的⼏种，所以冒泡排序，这种较为基础并且便于理解记忆的算法⼀定需要熟记于⼼。冒泡排序算法就是依次⽐较⼤⼩，⼩的的⼤的进⾏位置上的交换。
function bubbleSort(arr) {
for(let i = 0,l=arr.length;i<l-1;i++) {
for(let j = i+1;j<l;j++) {
if(arr[i]>arr[j]) {
let tem = arr[i];
arr[i] = arr[j];
arr[j] = tem;
}
}
}
return arr;
}
除了冒泡排序外，其实还有很多诸如插⼊排序，快速排序，希尔排序等。每⼀种排序算法都有各⾃的特
点。全部掌握也不需要，但是⼼底⼀定要熟悉⼏种算法。⽐如快速排序，其效率很⾼，⽽其基本原理如图(来⾃wiki)：
算法参考某个元素值，将⼩于它的值，放到左数组中，⼤于它的值的元素就放到右数组中，然后递归进⾏上⼀次左右数组的操作，返回合并的数组就是已经排好顺序的数组了。
function quickSort(arr) {
if(arr.length<=1) {
return arr;
}
let leftArr = [];
let rightArr = [];
let q = arr[0];
for(let i = 1,l=arr.length; i<l; i++) {
if(arr[i]>q) {
rightArr.push(arr[i]);
}else{
leftArr.push(arr[i]);
}
}
return [].concat(quickSort(leftArr),[q],quickSort(rightArr));
}
安利⼤家⼀个学习的地址，通过动画演⽰算法的实现。HTML5 Canvas Demo: Sorting Algorithms
Q5 不借助临时变量，进⾏两个整数的交换
输⼊ a = 2, b = 4 输出 a = 4, b =2
这种问题⾮常巧妙，需要⼤家跳出惯有的思维，利⽤ a , b进⾏置换。
主要是利⽤ + – 去进⾏运算，类似 a = a + ( b – a) 实际上等同于最后的 a = b;
function swap(a , b) {
b = b - a;
a = a + b;
b = a - b;
return [a,b];
}
Q6 使⽤canvas 绘制⼀个有限度的斐波那契数列的曲线？
数列长度限定在9.
斐波那契数列，⼜称黄⾦分割数列，指的是这样⼀个数列：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;
}
剩余的⼯作就是利⽤canvas arc⽅法进⾏曲线绘制了DEMO
Q7 出下列正数组的最⼤差值⽐如:
输⼊ [10,5,11,7,8,9]
输出 6
这是通过⼀道题⽬去测试对于基本的数组的最⼤值的查，很明显我们知道，最⼤差值肯定是⼀个数组中最⼤值与最⼩值的差。
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;
}
Q8 随机⽣成指定长度的字符串
实现⼀个算法，随机⽣成指制定长度的字符窜。
⽐如给定长度 8  输出 4ldkfg9j
function randomString(n) {
let str = 'abcdefghijklmnopqrstuvwxyz9876543210';
let tmp = '',
i = 0,
l = str.length;
for (i = 0; i < n; i++) {
tmp += str.charAt(Math.floor(Math.random() * l));
}
return tmp;
}
Q9 实现类似getElementsByClassName 的功能
⾃⼰实现⼀个函数，查某个DOM节点下⾯的包含某个class的所有DOM节点？不允许使⽤原⽣提供的 getElementsByClassName querySelectorAll 等原⽣提供DOM查函数。
function queryClassName(node, name) {
var starts = '(^|[ \n\r\t\f])',
ends = '([ \n\r\t\f]|$)';
var array = [],
regex = new RegExp(starts + name + ends),
elements = ElementsByTagName("*"),
length = elements.length,
i = 0,
element;
while (i < length) {
element = elements[i];
if (st(element.className)) {
array.push(element);
}字符串转数组 前端
i += 1;
}
return array;
}
Q10 使⽤js 实现⼆叉查树(Binary Search Tree)
⼀般叫全部写完的概率⽐较少，但是重点考察你对它的理解和⼀些基本特点的实现。⼆叉查树，也称⼆叉搜索树、有序⼆叉树（英语：ordered binary tree）是指⼀棵空树或者具有下列性质的⼆叉树：
任意节点的左⼦树不空，则左⼦树上所有结点的值均⼩于它的根结点的值；
任意节点的右⼦树不空，则右⼦树上所有结点的值均⼤于它的根结点的值；
任意节点的左、右⼦树也分别为⼆叉查树；
没有键值相等的节点。⼆叉查树相⽐于其他数据结构的优势在于查、插⼊的时间复杂度较低。为O(log n)。⼆叉查树是基础性数据结构，⽤于构建更为抽象的数据结构，如集合、multiset、关联数组等。
在写的时候需要⾜够理解⼆叉搜素树的特点，需要先设定好每个节点的数据结构
class Node {
constructor(data, left, right) {
this.data = data;
this.left = left;
this.right = right;
}
}
树是有节点构成，由根节点逐渐延⽣到各个⼦节点，因此它具备基本的结构就是具备⼀个根节点，具备添加，查和删除节点的⽅法. class BinarySearchTree {
constructor() {
< = null;
}
insert(data) {
let n = new Node(data, null, null);
if (!) {
= n;
}
let currentNode = ;
let parent = null;
while (1) {
parent = currentNode;
if (data < currentNode.data) {
currentNode = currentNode.left;
if (currentNode === null) {
parent.left = n;
break;
}
} else {
currentNode = currentNode.right;
if (currentNode === null) {
parent.right = n;
break;
}
}
}
}
remove(data) {
< = , data)
}
removeNode(node, data) {
if (node == null) {
return null;
}
if (data == node.data) {
// no children node
if (node.left == null && node.right == null) {
return null;
}
if (node.left == null) {
return node.right;
}
if (node.right == null) {
return node.left;
}
let getSmallest = function(node) {
if(node.left === null && node.right == null) {
return node;

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。