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

迷南。 2023-06-10 06:26 22阅读 0赞

[![返回主页][aHR0cHM6Ly93d3cuY25ibG9ncy5jb20vc2tpbnMvY3VzdG9tL2ltYWdlcy9sb2dvLmdpZg]][aHR0cHM6Ly93d3cuY25ibG9ncy5jb20vc2tpbnMvY3VzdG9tL2ltYWdlcy9sb2dvLmdpZg 1]

# **[前端面试整理——javascript算法和测试题][javascript]** #

## **（1）算法：** ##

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

方案一：

<code> 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</code>

方案二：

### **2、数组排序** ###

**1）冒泡排序**

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

<code>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);</code>

**2）插入排序**

![format_png][]

<code> //双重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));</code>

**3）简单选择排序**

### **3、用js实现二分查找** ###

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

**1、非递归查找**

<code> 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));</code>

**2、递归查找**

<code> 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));</code>

### **4、数组去重** ###

方案一：

<code> 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));</code>

方案二：

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

方案三：

<code>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);
 </code>

### **5、数组求和** ###

<code> 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);</code>

## **（2）测试题：** ##

### **1、哪个会弹出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、写一个字符串转成驼峰的方法** ###

方法一：

<code>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));</code>

方法二：

<code> 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));</code>

方法三：

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

方法一：

<code> 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);</code>

方法二：

<code>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);</code>

方法三：

<code>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);</code>

### **8、如何给字符串加千分符？** ###

方案一：

<code> 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);</code>

方案二：

<code>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);</code>

方案三：

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

### **9、返回一个值包含数字类型的数组？** ###

方案一：

<code>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);</code>

方案二：

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

方案一：

<code> var a = 10,var b = 20;
 [a,b] = [b,a];
 console.log(a,b);</code>

方案二：

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

解析：  
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\]这样的数组？** ###

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

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

方案一：

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

方案二：

方案三：

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

方案四：

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

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

方案一：for循环

方案二：

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

### **14、以下题目弹出的结果是多少？** ###

<code> var i=0;
 alert(++i == i++); //true</code>

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

### **15、以下输出结果是多少？** ###

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

分类: [前端学习][Link 1]

[aHR0cHM6Ly93d3cuY25ibG9ncy5jb20vc2tpbnMvY3VzdG9tL2ltYWdlcy9sb2dvLmdpZg]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly93d3cuY25ibG9ncy5jb20vc2tpbnMvY3VzdG9tL2ltYWdlcy9sb2dvLmdpZg
[aHR0cHM6Ly93d3cuY25ibG9ncy5jb20vc2tpbnMvY3VzdG9tL2ltYWdlcy9sb2dvLmdpZg 1]: /images/20230531/3be5b33c4c3445098ccf295ed4632ae1.png
[javascript]: /images/20230531/3be5b33c4c3445098ccf295ed4632ae1.pngp/10248389.html
[format_png]: /images/20230531/5d61153710e643d487a7e8e4ac0f1af4.png
[Link 1]: /images/20230531/3be5b33c4c3445098ccf295ed4632ae1.pngcategory/1198258.html