其他随笔：
前端工程师面试问题归纳（一、问答类html/css/js基础）
前端工程师面试问题归纳（二、问答类JQ相关）
（二）、手写代码
1 、数组去重的实现
//方法一 var arr = [0,2,3,4,4,0,2]; var obj = {}; var tmp = []; for(var i = 0 ;i< arr.length;i++){if( !obj[arr[i]] ){obj[arr[i]] = 1;tmp.push(arr[i]);} } console.log(tmp);//[0, 2, 3, 4]
//方法二 var arr = [2,3,4,4,5,2,3,6],arr2 = []; for(var i = 0;i< arr.length;i++){if(arr2.indexOf(arr[i]) < 0){arr2.push(arr[i]);} } console.log(arr2);//[2, 3, 4, 5, 6]//方法三 var arr = [2,3,4,4,5,2,3,6]; var arr2 = arr.filter(function(element,index,self){return self.indexOf(element) === index; }); console.log(arr2);//[2, 3, 4, 5, 6]
filter方法用于过滤数组成员，满足条件的成员组成一个新数组返回。
它的参数是一个函数，所有数组成员依次执行该函数，返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。
filter方法的参数函数可以接受三个参数：当前成员，当前位置和整个数组。
前端面试题汇总？indexOf方法返回给定元素在数组中第一次出现的位置，如果没有出现则返回-1。
//思路：先将原数组排序，在与相邻的进行比较，如果不同则存入新数组
function unique(arr){
var arr2 = arr.sort();
前端基础面试题？ var res = [arr2[0]];
for(var i=1;i<arr2.length;i++){
if(arr2[i] !== res[res.length-1]){
面试前端的面试官一般会问你什么？ res.push(arr2[i]);
}
}
程序员vs网络工程师？ return res;
}
//先排序后去重
代码工程师、Array.prototype.unique = function(){
var result = [this[0]];this.sort();this.forEach(function(v){v != result[result.length - 1] && result.push(v); //仅与result最后一个元素比较});
}
//利用ES6 Set去重
//ES6环境下Array.prototype.unique = function(){return [...new Set(this)]; } 2 、快速排序的实现
“快速排序”的思想很简单，整个排序过程只需要三步：
（1）在数据集之中，找一个基准点
（2）建立两个数组，分别存储左边和右边的数组
（3）利用递归进行下次比较
<script type="text/javascript">function quickSort(arr){if(arr.length<=1){return arr;//如果数组只有一个数，就直接返回；}var num = Math.floor(arr.length/2);//找到中间数的索引值，如果是浮点数，则向下取整var numValue = arr.splice(num,1);//找到中间数的值var left = [];var right = [];for(var i=0;i<arr.length;i++){ if(arr[i]<numValue){ left.push(arr[i]);//基准点的左边的数传到左边数组 } else{ right.push(arr[i]);//基准点的右边的数传到右边数组 } } return quickSort(left).concat([numValue],quickSort(right));//递归不断重复比较 } alert(quickSort([32,45,37,16,2,87]));//弹出“2,16,32,37,45,87” </script> //方法一(尽可能不用js数组方法）
function quickSort(arr){qSort(arr,0,arr.length - 1);
}
function qSort(arr,low,high){if(low < high){var partKey = partition(arr,low,high);qSort(arr,low, partKey - 1);qSort(arr,partKey + 1,high); } } function partition(arr,low,high){ var key = arr[low]; //使用第一个元素作为分类依据 while(low < high){ while(low < high && arr[high] >= arr[key]) high--; arr[low] = arr[high]; while(low < high && arr[low] <= arr[key]) low++; arr[high] = arr[low]; } arr[low] = key; return low; } //方法二（使用js数组方法）
function quickSort(arr){if(arr.length <= 1) return arr;var index = Math.floor(arr.length/2);var key = arr.splice(index,1)[0];var left = [],right = [];arr.forEach(function(v){v <= key ? left.push(v) : right.push(v); }); return quickSort(left).concat([key],quickSort(right)); } //另外要知道，快速排序的平均时间复杂度O(nlogn),最坏情况是有序的情况，时间复杂度为n的平方，另外快速排序是不稳定的。
3 、写一个获取非行间样式的函数
4、实现一个函数clone，可以对JavaScript中的5种主要的数据类型（包括Number、String、Object、Array、Boolean）进行值复制
Object.prototype.clone = function(){var o = this.constructor === Array ? [] : {};for(var e in this){o[e] = typeof this[e] === "object" ? this[e].clone() : this[e];}return o;}
5、如何删除一个cookie
1.将时间设为当前时间往前一点。
var date = new Date();date.setDate(date.getDate() - 1);//真正的删除
setDate()方法用于设置一个月的某一天。
2.expires的设置
document.cookie = 'user='+ encodeURIComponent('name') + '; expires = ' + new Date(0)
6、编写一个方法 求一个字符串的字节长度
function GetBytes(str){var len = str.length;var bytes = len;for(var i=0; i<len; i++){if (str.charCodeAt(i) > 255) bytes++;}return bytes;}alert(GetBytes("你好,as"));
7、请写出函数运行结果
function test(){var a;function foo(){return 2;}console.log(a);//undefinedconsole.log(foo());//2a = 1; } test();
function fun(n,o){console.log(o);return {fun:function(m){return fun(m,n);}} } var a = fun(0);a.fun(1);a.fun(2);a.fun(3); var b = fun(0).fun(1).fun(2).fun(3); var c = fun(0).fun(1);c.fun(2);c.fun(3); //undefined 0 0 0 //undefined 0 1 2 //undefined 0 1 1
var a = 9; var b = a++ + a-- + ++a + --a + a-- //console.log(a);//8 //console.log(b);//47
var objName = "name1"; function obj(){var objName = "name2";function innerObj(){alert(objName);//name2 }innerObj(); } console.log(obj());//undefined
8、求数组最大值
//1.sort排序（先把数组从小到大排序，数组第一个即为最小值，最后一个即为最大值） ary.sort(function(a,b){return a-b;}); var minN = ary[0]; var maxN = ary[ary.length-1]; //2.假设数组第一个为最大（或最小值），和后边进行比较，若后边的值比最大值大（或比最小值小），则替换最大值（或最小值） var maxN = ary[0]; var minN = ary[0]; for(var i=1;i<ary.length;i++){var cur = ary[i];cur>maxN ? maxN=cur : null;cur<minN ? minN=cur : null; } //3.Math的max和min方法 Math.max.apply(null, a); Math.min.apply(null, a);
9、用css实现垂直居中
https://www.cnblogs.com/zhouhuan/p/vertical_center.html
10、用es6的方法将数组[5,6,7]插入数组[1,2,3,4]，得到数组[1,2,5,6,7,3,4]
var arry1 = [1,2,3,4]; var arry2 = [5,6,7]; //这里的...为扩展运算符（spread）：表示将一个数组转为用逗号分隔的参数序列。 arry1.splice(2,0,...arry2); console.log(arry1);
splice方法用于删除原数组的一部分成员，并可以在删除的位置添加新的数组成员，返回值是被删除的元素。该方法会改变原数组。
splice方法的第一个参数是删除的起始位置（从0开始），第二个参数是被删除的元素个数（第二个参数设为0的时候表示只插入元素）。如果后面还有更多的参数，则表示这些就是要被插入数组的新元素。
…扩展运算符（spread）：将一个数组转为用逗号分隔的参数序列。
11、JavaScript中如何检测一个变量是一个String类型？请写出函数实现
typeof(obj) === "string" typeof obj === "string" obj.constructor === String
12、请用js去除字符串空格？
方法一：使用replace正则匹配的方法
去除所有空格: str = str.replace(/\s*/g,"");
去除两头空格: str = str.replace(/^\s*|\s*$/g,"");
去除左空格： str = str.replace( /^\s*/, “”);
去除右空格： str = str.replace(/(\s*$)/g, "");
str为要去除空格的字符串，实例如下：
var str = " 23 23 "; var str2 = str.replace(/\s*/g,""); console.log(str2); // 2323
方法二：使用str.trim()方法
str.trim()局限性：无法去除中间的空格，实例如下：
var str = " xiao ming "; var str2 = str.trim(); console.log(str2); //xiao ming
同理，str.trimLeft()，str.trimRight()分别用于去除字符串左右空格。
方法三：使用jquery,$.trim(str)方法
$.trim(str)局限性：无法去除中间的空格，实例如下：
var str = " xiao ming "; var str2 = $.trim(str) console.log(str2); // xiao ming
13、你如何获取浏览器URL中查询字符串中的参数？
测试地址为：http://www.runoob.com/jquery/misc-trim.html?channelid=12333&name=xiaoming&age=23
实例如下：
function showWindowHref(){var sHref = window.location.href;var args = sHref.split('?');if(args[0] == sHref){return "";}var arr = args[1].split('&');var obj = {};for(var i = 0;i< arr.length;i++){var arg = arr[i].split('=');obj[arg[0]] = arg[1];}return obj; } var href = showWindowHref(); // obj console.log(href['name']); // xiaoming
14、写出3个使用this的典型应用
（1）、在html元素事件属性中使用，如：
<input type=”button” οnclick=”showInfo(this);” value=”点击一下”/> （2）、构造函数
function Animal(name, color) {this.name = name;this.color = color; }
（3）、input点击，获取值
<input type="button" id="text" value="点击一下" /> <script type="text/javascript">var btn = document.getElementById("text");btn.onclick = function() {alert(this.value); //此处的this是按钮元素 } </script>
(4)、apply()/call()求数组最值
var numbers = [5, 458 , 120 , -215 ]; var maxInNumbers = Math.max.apply(this, numbers); console.log(maxInNumbers); // 458 var maxInNumbers = Math.max.call(this,5, 458 , 120 , -215); console.log(maxInNumbers); // 458
15、判断一个字符串中出现次数最多的字符，统计这个次数
var str = 'asdfssaaasasasasaa'; var json = {}; for (var i = 0; i < str.length; i++) {if(!json[str.charAt(i)]){json[str.charAt(i)] = 1;}else{json[str.charAt(i)]++;} }; var iMax = 0; var iIndex = ''; for(var i in json){if(json[i]>iMax){iMax = json[i];iIndex = i;} } console.log('出现次数最多的是:'+iIndex+'出现'+iMax+'次'); //结果如下：出现次数最多的是:a出现9次
16、使用正则表达式验证邮箱格式
var reg = /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/;var email = "example@qq.com";console.log(reg.test(email)); // true
17、请写一个简单的幻灯效果页面
js
css3
18.解释下为什么接下来这段代码不是IIFE(立即调用的函数表达式)：function foo(){}();.
要做哪些改动使它变成IIFE?
因为在解析器解析全局的function或者function内部function关键字的时候，默认是认为function声明，而不是function表达式，如果你不显示告诉编译器，它默认会声明成一个缺少名字的function，并且抛出一个语法错误信息，因为function声明需要一个名字。
var foo = function() {// doSomeThing. }； foo();
19."123456789876543212345678987654321..."的第n位是什么？
function getNum(n){let num=0, flag=true;for(let i=0; i<n;i++){if(num===1) flag=true;if(num===9) flag=false;flag?num++:num--}return num }
