前端面试整理——javascript算法和测试题

Posted kristy1993

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端面试整理——javascript算法和测试题相关的知识,希望对你有一定的参考价值。

(1)算法:

1、斐波那契数列:1、1、2、3、5、8、13、21。输入n,输出数列中第n位数的值。

方案一:

 function fn(n){
        var num1 = 1, num2= 1, num3 = 0;
        for(var i=0;i<n-2;i++){
            num3 = num1+num2;
            num1 = num2;
            num2 = num3;
        }
        return num3;
    }
console.log(fn(7)) //13

方案二:

 function fn(n){
   if(n<=2){
        return 1;
   }
    return fn(n-1)+fn(n-2);
 }
console.log(fn(7)) //13

2、数组排序

1)冒泡排序

实现:
a、双重for循环 b、指定比较的轮数和每轮比较的次数 c、如果符合条件就交换位置
流程:
a、比较相邻的元素,如果第一个比第二个大,就交换他们两个的位置。从开始第一对比较到最后一对,最后的元素是最大的元素。
b、从头到尾再比较一次,每进行一轮最后的都是最大的了,因此后一轮比前一轮少一次比较。

function maopao(arr){
    var temp=0;
    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]){
                temp=arr[j];
                arr[j]=arr[j+1];
                arr[j+1]=temp;
            }
        }
    }
    return arr;
}
var s=[15,32,12,5,7,6];
var result=maopao(s);
console.log(result);

2)插入排序

  //双重for循环实现
    function  insertSort(arr){
        var  temp = 0;
        for(var i=1;i<arr.length;i++){
            var temp = arr[i];
            for(var j=i-1;j>=0;j--){
                if(arr[j]>temp){
                    arr[j+1]=arr[j];
                }else{
                    break;
                }
            }
            arr[j+1]=temp;
        }
        return arr;
    }
    //for+while实现
    function insertSort2(arr){
        var  temp = 0;
        for(var i=1;i<arr.length;i++){
            var temp = arr[i];
            var j = i-1;
          while(j>=0 && arr[j]>temp){
              arr[j+1]=arr[j];
              j--;
          }
            arr[j+1]=temp;
        }
        return arr;
    }
    var arr = [32,6,12,9,23,5,8,1,23];
    var arr2 = [32,6,12,9,23,5,8,1,23];
    console.log(\'for:\'+insertSort(arr));
    console.log(\'while:\'+insertSort2(arr2));

3)简单选择排序

3、用js实现二分查找

二分查找的前提是有序数组
实现:将要查找的值每次与中间值比较,大于中间值,则在右边进行相同的查找,小于中间值则在左边进行比较查找,找到返回索引值,没找到返回-1。

1、非递归查找

 function binarySearch(target,arr){
        var start = 0;
        var end = arr.length-1;
        while(start <= end){
            var mid = parseInt((start+end)/2);
            if(target == arr[mid]){
                return mid
            }else if(target > arr[mid]){
                start = mid + 1;
            }else if(target < arr[mid]){
                end = mid - 1;
            }else{
                return -1;
            }
        }
    }
    var arr = [1,2,4,6,8,9,11,34,67];
    console.log(binarySearch(11,arr));

2、递归查找

 function binarySearch(arr,target,start,end){
        var start = start || 0;
        var end = end || arr.length-1;
        var mid = parseInt((start+end)/2);
        if(target == arr[mid]){
                 return mid
             }else if(target > arr[mid]){
                 start = mid + 1;
                 return binarySearch(arr,target,start,end);
             }else if(target < arr[mid]){
                 end = mid - 1;
                 return binarySearch(arr,target,start,end);
             }else{
                 return -1;
        }
    }
     var arr = [1,2,4,6,8,9,11,34,67];
     console.log(binarySearch(arr,11));

4、数组去重

方案一:

 function fn(arr){
        var obj = {};
        var newArr = [];
        for(var i=0;i<arr.length;i++){
            if(!obj[arr[i]]){
                obj[arr[i]] = 1;
                newArr.push(arr[i]);
            }
        }
        return newArr;
    }
 var arr = [2,4,7,3,5,2,8,7];
console.log(fn(arr));

方案二:

  var arr = [2,4,7,3,5,2,8,7];
  var setArr = new Set(arr);
   var newArr = Array.from(setArr);
console.log(newArr);

方案三:

var arr =[1,2,2,4,5,4,11,6];
function fn(arr){
    var a=arr;
    for(var i=0;i<a.length;i++){
       for(var j=a.length-1;j>i;j--){
           if(a[i]==a[j]){
                a.splice(j,1);
           }
       }
    }
    return a;
}
var s=fn(arr);
console.log(s);

5、数组求和

 var arr = [10,23,45,70,10];
    var num1 =0;
//方案一
    arr.forEach((item)=>{
        num1 += item;
    })
    console.log(num1);
 //方案二
    var num2 =0;
    arr.some((item)=>{
        num2 += item;
    })
    console.log(num2);
//方案三
    var num3 =0;
    arr.filter((item)=>{
        num3 += item;
    })
    console.log(num3);
 //方案四
    var num4 =0;
    arr.map((item)=>{
        num4 += item;
    })
    console.log(num4);
//方案五
    var num5 =0;
    num5 = arr.reduce((num,now)=>{
        return num+now;
    })
    console.log(num5);



(2)测试题:

1、哪个会弹出1?

A. if(\'21\'<\'15\'){alert(1)}
B. if(15-15){alert(1)}
C. if(\'21\'<15){alert(1)}
D. if(\'5\'+0){alert(1)} 

选D,解析:
1)\'21\'<\'15\' 字符串之间的比较,是按照从左到右的顺序,逐位进行比较,按照unicode码的大小
charCodeAt(index)用于获取指定索引值位置的unicode
2)\'5\'+0 =》 \'50\' => true
+作用: 字符串拼接:左右两侧只要有一侧是字符串,那么就是字符串拼接

2、输出结果?

var i=0,j=0;
for(;j<6,i<10;i++,j++){
k = i+j;
}
console.log(k);//18
解析:
逗号运算符,返回最后一位

3、(!+[]+[]+!+[]).length 输出结果?

console.log((!+[]+[]+!+[]).length); //8
解析:
(!+[]+[]+!+[]) //truetrue
首先是这里的第一个加号代表的是正号
!+[] 结果为布尔值true
!+[]+[]结果为字符串true

4、2000[\'toString\'][\'length\'] 输出结果?

console.log(2000[\'toString\'][\'length\']); //1
解析:
2000[\'toString\']返回一个函数,function.length这里返回函数的参数个数。

5、输出结果是多少?

var f = function g(){return 23;};
console.log(typeof g()); // g is not defined
解析:
外部访问不到g()函数

6、写一个字符串转成驼峰的方法

方法一:

function change(str){
        var s1 = str.split("");
        for(var i=0;i<s1.length;i++){
            if(s1[i] == \'-\'){
                s1[i+1] = s1[i+1].toUpperCase();
            }
        }
        return s1.join("").replace(/-/g,\'\');
    }
var str = "border-bottom-color";
console.log(change(str));

方法二:

 function change(str){
        var s1 = str.split("-");
        for(var i=1;i<s1.length;i++){
           s1[i] = s1[i].charAt(0).toUpperCase() + s1[i].substring(1);
        }
        return s1.join("");
    }
var str = "border-bottom-color";
console.log(change(str));

方法三:

  function change(str){
        var reg = /-(\\w)/g;
        return str.replace(reg,function(s1,s2){
             return s2.toUpperCase();
        })
    }
var str = "border-bottom-color";
console.log(change(str));

7、查找字符串中出现最多的字符和个数

方法一:

 function query(str){
        var obj = {};
        var s1 = str.split("");
        for(var i=0;i<s1.length;i++ ){
            if(!obj[s1[i]]){
                obj[s1[i]] = 1;
            }else{
                obj[s1[i]]++;
            }
        }
        var maxChar = \'\';
        var maxNum = 0;
        for(var key in obj){
            if(obj[key]>maxNum){
                maxNum = obj[key];
                maxChar = key;
            }
        }
        console.log(maxChar,maxNum);
    }
  var str = "sdfejdmdjskijfdheeehehehsss";
  query(str);

方法二:

function query(str){
        var obj = {};
        var num = 0;
        var value = 0;
        for(var i=0;i<str.length;i++){
            if(!obj[str[i]]){
                obj[str[i]] = [];
            }
            obj[str[i]].push(str[i]);
        }
        for(var attr in obj){
            if(num < obj[attr].length){
                  num = obj[attr].length;
                  value = obj[attr][0];
            }
        }
        console.log(value,num);
    }
    var str = "sdfejdmdjskijfdheeehehehsss";
    query(str);

方法三:

function query(str){
        var arr = str.split("");
        arr.sort();
        str = arr.join("");
        var num = 0;
        var value = \'\';
       var re = /(\\w)\\1+/g;
       str.replace(re,function(param1,param2){
            if(num<param1.length){
                num = param1.length;
                value = param2;
            }
       });
        console.log(value,num);
    }
var str = "sdfejdmdjskijfdheeehehehsss";
query(str);

8、如何给字符串加千分符?

方案一:

 function fn(str){
           var arr = [];
           var num = str.length%3;
           if(num){
               arr.push(str.slice(0,num));
               str = str.substring(num);
           }
           var count = 0;
           var temp = \'\';
           for(var i=0;i<str.length;i++){
                count++;
                temp += str[i];
                if(count ==3 && temp){
                    arr.push(temp);
                    temp = \'\';
                    count = 0;
                }
           }
        var newStr = arr.join(\',\');
        console.log(newStr);
    }
    var str = \'3323245678651456\';
    fn(str);

方案二:

function fn(str){
       var arr = [];
       var num = str.length%3;
       if(num){
         arr.push(str.slice(0,num));
       }
       var count = 3;
       for(var i = num;i<str.length;i++){
           count --;
           if(count == 2){
               arr.push(str.slice(i,i+3));
           }else if(count == 0){
               count = 3;
           }

       }
       var newStr = arr.join(\',\');
       console.log(newStr);
    }
var str = \'3323245678651456\';
fn(str);

方案三:

 function fn(str){
        // ?1\\b代表不属于独立部分,开始、结束、有空格
        var re = /(?=(?!\\b)(\\d{3})+$)/g;
        console.log(str.replace(re,\',\'));
    }
    var str = \'3323245678651456\';
    fn(str);

9、返回一个值包含数字类型的数组?

方案一:

function fn(str){
        var arr = [];
        var temp = \'\';
        for(var i=0;i<str.length;i++){
           if(!isNaN(str[i])){
                temp += str[i];
           }
           if(isNaN(str[i]) || (i== str.length-1 && !isNaN(str[i]))){
               if(temp){
                   arr.push(temp);
                   temp = \'\';
               }
           }
        }
        console.log(arr);
    }
    var str = \'js123ldka78sdassdfd653ssss3\';
    fn(str);

方案二:

 function fn(str){
        var re = /[0-9]+/g;
        var arr = [];
        str.replace(re,function($0,$1){
            arr.push($0);
        });
        console.log(arr);
    }
    var str = \'js123ldka78sdassdfd653ssss3\';
    fn(str);

10、a,b两个变量,不用第三个变量来切换两个变量的值

方案一:

  var a = 10,var b = 20;
   [a,b] = [b,a];
 console.log(a,b);

方案二:

var a = 10,b = 20;
a = [b,b=a][0];
console.log(a,b);

解析:
b=a 是赋值表达式、可以像普通的表达式一样用于任何表达式中,也包括在数组中使用。
a=[b,b=a][0]的执行顺序是:
第一步把b的值放入数组的0下标中;
第二步执行b=a赋值表达式,对b重新赋值,并把这个值放入数组的1下标,这个数组的1下标是没有用的,b=a写这里是为了让它在第三步之前执行。
第三步把数组的0下标赋值给a。

11、有一个数n=5,不用for循环,怎么返回[1,2,3,4,5]这样的数组?

 function fn(n){
        var arr = [];
        return (function(){
            arr.unshift(n);
            n--;
            if(n!=0){
                arguments.callee(n);
            }
           return arr;
        })();
    }
    console.log(fn(5));

12、一个数n,当n小于100时返回n,否则就返回100

方案一:

function fn(n){
   return n<100?n:100;
}
console.log(fn(102));

方案二:

 function fn(n){
       return Math.min(n,100);
    }
console.log(fn(99));

方案三:

    function fn(n){
        switch(n<100){
            case true:
                return n;
                break;
            case false:
                return 100;
                break;
        }
    }
    console.log(fn(99));

方案四:

var n = 104;
   var arr = [n,100];
   arr.sort(function(n1,n2){
       return n1-n2;
   })
console.log(arr[0]);

13、伪数组及转化标准数组

方案一:for循环

var arr = [];
 for(var i=0;i<funs.length;i++){
     arr.push(funs[i]);
 }
console.log(arr);

方案二:

var arr = Array.prototype.slice.call(funs);
//或
var arr = [].slice.call(funs);

14、以下题目弹出的结果是多少?

 var i=0;
   alert(++i == i++);  //true

解析:
等式是从左往右执行,先是执行了++i ,然后进行比较,最后执行i++

15、以下输出结果是多少?

 function Fn(){
        this.name = \'miaov\';
        this.adress = \'北京\';
        return {}
    }
    var fn = new Fn();
    console.log(fn.name); //undefined

以上是关于前端面试整理——javascript算法和测试题的主要内容,如果未能解决你的问题,请参考以下文章

来自大厂 300+ 道前端面试题大全附答案(整理版)+前端常见算法面试题~~最全面详细

JavaScript 总结面试笔记 + 经典面试题 + 常用算法,帮你搞定前端 JavaScript 面试!

面试题JVM常见面试题

前端面试题全面整理-带解析 涵盖CSSJS浏览器VueReact移动web前端性能算法Node

2年大厂经验Java面试,题目和答案!

带你整理面试过程中关于 JVM 的运行内存划分垃圾回收算法和 4种引用类型的相关知识点