前端面试题2019.02.28

一、用 js 写出几种去除 string 空格的方法。

（1）、使用js循环　　 　　

//供使用者调用 
function trim(s){ 
return trimRight(trimLeft(s)); 
} 
//去掉左边的空白 
function trimLeft(s){ 
if(s == null) { 
return ""; 
} 
var whitespace = new String(" \t\n\r"); 
var str = new String(s); 
if (whitespace.indexOf(str.charAt(0)) != -1) { 
var j=0, i = str.length; 
while (j < i && whitespace.indexOf(str.charAt(j)) != -1){ 
j++; 
} 
str = str.substring(j, i); 
} 
return str; 
}

//去掉右边的空白 
function trimRight(s){ 
if(s == null) return ""; 
var whitespace = new String(" \t\n\r"); 
var str = new String(s); 
if (whitespace.indexOf(str.charAt(str.length-1)) != -1){ 
var i = str.length - 1; 
while (i >= 0 && whitespace.indexOf(str.charAt(i)) != -1){ 
i--; 
} 
str = str.substring(0, i+1); 
} 
return str; 
}

（2）使用正则

String.prototype.Trim = function() 
{ 
return this.replace(/(^\s*)|(\s*$)/g, ""); 
} 
String.prototype.LTrim = function() 
{ 
return this.replace(/(^\s*)/g, ""); 
} 
String.prototype.RTrim = function() 
{ 
return this.replace(/(\s*$)/g, ""); 
}

//去左空格;
function ltrim(s){
return s.replace(/(^\s*)/g, "");
}
//去右空格;
function rtrim(s){
return s.replace(/(\s*$)/g, "");
}
//去左右空格;
function trim(s){
return s.replace(/(^\s*)|(\s*$)/g, "");
}

（3）使用JQ

$trim(str)

二、如何获取浏览器URL中查询字符串中的参数？

function getQuery(name)

　　{

　　var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");

　　var r = window.location.search.substr(1).match(reg);

　　if (r!=null) return unescape(r[2]); return null;
　　}

三、比较 typeof 与 instanceof ?

相同点：都经常使用来判断一个变量是否为空，或者是什么类型的。

不一样点：tyoeof返回字符串用来讲明变量的数据类型，instanceof 返回布尔值，用来判断变量是否属于某个对象的实例。

四、如何理解闭包？

通常指能够访问另外一个函数做用域变量的的函数。当一个变量想要反复调用，又想避免全局污染的状况下，会使用到闭包。缺点是所占用的空间不容易被释放，须要手动清除。

五、JQuery的几种选择器分别是？

（1）、基本选择器

*
#id
element
.class

（2）、层次选择器

ancestor descendant
parent > child
prev + next
prev ~ siblings

(3)、基本过滤器选择器

:first
:last
:not
:even
:odd
:eq
:gt
:lt
:header
:animated

(4)、内容过滤器选择器

:contains
:empty
:has
:parent

(5)、可见性过滤器选择器

(6)、属性过滤器选择器

(7)、子元素过滤器选择器

(8)、表单选择器

(9)、表单过滤器选择器

具体可参考 http://api.jquery.com/category/selectors/

六、浏览器的内核分别是什么？

IE内核：Trident

Firefox内核：Gecko

Safari内核：Webkit

Opera内核：Presto=>Blink

Chrome内核：Blink 

七、浏览器本地存储？

Cookie、LocalStorag、SessinStorage。

LocalStorage读取数据须要在 协议、主机名和端口相同的状况下，而SessionStorage在知足上面的条件时还要求在同一窗口（标签页）。

Cookie默认关闭窗口清除数据，可经过SetCookie设置存储时间。

LocalStorage永久存储，可设置保存时间。

SessionStorage 会话级存储，关闭页面自动销毁。至关于Cookie的默认。

Cookie是数据会在蔑称发送HTTP请求的时候，同时发送给服务器。 而LocalStorag、SessinStorage 则不会。

八、你了解的Web攻击技术？

（1）、xss跨站攻击技术：主要是攻击者往网页里嵌入恶意脚本，或者经过改变html元素属性来实现攻击，主要缘由在于开发者对用户的变量直接使用致使进入html中会被直接编译成js，一般的get请求经过url来传参，能够在url中传入恶意脚本，从而获取信息，解决方法：特殊字符过滤。

（2）、sql注入攻击：主要是就是经过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令，好比select * from test where username="wuxu" or 1=1，这样会使用户跳过密码直接登陆，具体解决方案：一、特殊字符过滤，不要用拼接字符串的方法来凑sql语句。二、对sql语句进行预编译，好比java的preparedstatement。三、关闭错误信息，攻击者可能会经过不断的尝试来获得数据库的一些信息，因此关闭错误信息变得重要起来。四、客户端对数据进行加密，使原来传进来的参数由于加密而被过滤掉。五、控制数据库的权限，好比只能select，不能insert，防止攻击者经过select * from test ；drop tables这种操做。

（3）、远程目录包含攻击，原理就是注入一段用户能控制的脚本或代码，并让服务端执行。好比php中的include($filename)，而此filename由用户传入，用户便可传入一段恶意脚本，从而对服务其形成伤害，解决方法：当采用文件包含函数的时候，不该动态传入，而应该有具体的文件名，若是动态传入，要保证动态变量不被用户所控制。
（4）、会话劫持：这是一种经过获取用户Session ID后，使用该Session ID登陆目标帐号的攻击方法，此时攻击者其实是使用了目标帐户的有效Session。会话劫持的第一步是取得一个合法的会话标识来假装成合法用户，所以须要保证会话标识不被泄漏，通俗一点就是用户在登陆时，惟一标示用户身份的session id被劫持，使得攻击者能够用这个session id来进行登陆后操做，而攻击者主要是经过 窃取：使用网络嗅探，XSS攻击等方法得到。而第一种方式网络嗅探，咱们能够经过ssl加密，也就是https来对报文进行加密，从而防止报文被截获，而第二种方式xss攻击，方式在第一种已经给出，再也不赘述。此外经过设置HttpOnly。经过设置Cookie的HttpOnly为true，能够防止客户端脚本访问这个Cookie，从而有效的防止XSS攻击，还有就是设置token验证。关闭透明化Session ID。透明化Session ID指当浏览器中的Http请求没有使用Cookie来存放Session ID时，Session ID则使用URL来传递。

九、iframe的优缺点？

优势：（1）、可以完整展现嵌入网页。（2）、页面和程序分类（3）、一个iframe可屡次调用，代码复用性高。（4）、加载第三方内容如：图标、广告等可以使用 iframe 解决。

缺点：（1）、兼容性差，在移动端没法彻底显示。（2）、结构混乱，多个框架会出现滚动条，用户体验差。（3）、会产生多个页面，不利于管理。（4）、会增长服务器的 http 请求。

十、编写一个方法，去掉一个数组的重复元素。

function unique(arr){
 //Set数据结构，它相似于数组，其成员的值都是惟一的
 return Array.from(new Set(arr)); // 利用Array.from将Set结构转换成数组
}