标签（空格分隔）： 面试准备
[TOC]
1、请解释一下什么是闭包
我的理解是，闭包就是能够读取其他函数内部变量的函数。
由于在Javascript语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成"定义在一个函数内部的函数"。
所以，在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
作用：一个是可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中。
http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Closures
2、JS跨域
概念：只要协议、域名、端口有任何一个不同，都被当作是不同的域。
浏览器都有一个同源策略，其限制之一就是第一种方法中我们说的不能通过ajax的方法去请求不同源中的文档。 它的第二个限制是浏览器中不同域的框架之间是不能进行js的交互操作的。另外同源策略只对网页的HTML文档做了限制，对加载的其他静态资源如javascript、css、图片等仍然认为属于同源。
在浏览器中，<script>、<img>、<iframe>、<link>等标签都可以加载跨域资源，而不受同源限制，但浏览器限制了JavaScript的权限使其不能读、写加载的内容。
简单地理解就是因为JavaScript同源策略的限制，a.com 域名下的js无法操作b.com或是c.a.com域名下的对象。
http://www.freebuf.com/articles/web/65468.html
http://blog.chinaunix.net/uid-20737871-id-4458460.html
https://developer.mozilla.org/zh-CN/docs/Web/Security/Same-origin_policy
1.CORS（Cross-Origin Resource Sharing）跨域资源共享
服务器端对于CORS的支持，是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置，就可以允许Ajax进行跨域的访问。
< script type = "text/javascript" >
function createCORSRequest(method, url) {
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr) {
// 此时即支持CORS的情况
// 检查XMLHttpRequest对象是否有“withCredentials”属性
// “withCredentials”仅存在于XMLHTTPRequest level 2对象里
} else {
// 否则检查是否支持XDomainRequest
// XDomainRequest仅存在于IE中，是IE用于支持CORS请求的方式
xhr = new XDomainRequest();
}
xhr.open(method, url, true);
xhr.send();
xhr.onload = function() {
alert(xhr.responseText);
}
}
createCORSRequest('GET', "http://192.168.1.58/t.php"); < /script>
Apache
<Directory />
Require all denied
Header set Access-Control-Allow-Origin *
</Directory>
Nginx
location / {
add_header Access-Control-Allow-Origin *;
}
PHP
<?php
header("Access-Control-Allow-Origin:*");
//处理请求输出数据
?>
http://www.tuicool.com/articles/mYFjaa
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
2.JSONP
一个众所周知的问题，Ajax直接请求普通文件存在跨域无权限访问的问题，甭管你是静态页面、动态网页、web服务、WCF，只要是跨域请求，一律不准；
JavaScript代码一
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script type="text/javascript">
function jsonpCallback(result) {
//alert(result);
for(var i in result) {
alert(i+":"+result[i]);//循环输出a:1,b:2,etc.
}
}
var JSONP=document.createElement("script");
JSONP.type="text/javascript";
JSONP.src="http://crossdomain.com/services.php?callback=jsonpCallback";
document.getElementsByTagName("head")[0].appendChild(JSONP);
</script>
JavaScript代码二
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<script type="text/javascript">
function jsonpCallback(result) {
alert(result.a);
alert(result.b);
alert(result.c);
for(var i in result) {
alert(i+":"+result[i]);//循环输出a:1,b:2,etc.
}
}
</script>
<script type="text/javascript" src="http://crossdomain.com/services.php?callback=jsonpCallback"></script>
$.getJSON方法
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$.getJSON("http://crossdomain.com/services.php?callback=?",
function(result) {
for(var i in result) {
alert(i+":"+result[i]);//循环输出a:1,b:2,etc.
}
});
</script>
$.AJAX方法
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$.ajax({
url:"http://crossdomain.com/services.php",
dataType:'jsonp',
data:'',
jsonp:'callback',
success:function(result) {
for(var i in result) {
alert(i+":"+result[i]);//循环输出a:1,b:2,etc.
}
},
timeout:3000
});
</script>
$.get方法
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$.get('http://crossdomain.com/services.php?callback=?', {name: encodeURIComponent('tester')}, function (json) { for(var i in json) alert(i+":"+json[i]); }, 'jsonp');
</script>
服务器端代码
<?php
//服务端返回JSON数据
$arr=array('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);
$result=json_encode($arr);
//echo $_GET['callback'].'("Hello,World!")';
//echo $_GET['callback']."($result)";
//动态执行回调函数
$callback=$_GET['callback'];
echo $callback."($result)";
Jsonp原理：
首先在客户端注册一个callback, 然后把callback的名字传给服务器。
此时，服务器先生成 json 数据。
然后以 javascript 语法的方式，生成一个function , function 名字就是传递上来的参数 jsonp.
最后将 json 数据直接以入参的方式，放置到 function 中，这样就生成了一段 js 语法的文档，返回给客户端。
客户端浏览器，解析script标签，并执行返回的 javascript 文档，此时数据作为参数，传入到了客户端预先定义好的 callback 函数里.（动态执行回调函数）
CORS与JSONP相比，无疑更为先进、方便和可靠。
1、 JSONP只能实现GET请求，而CORS支持所有类型的HTTP请求。
2、 使用CORS，开发者可以使用普通的XMLHttpRequest发起请求和获得数据，比起JSONP有更好的错误处理。
3、 JSONP主要被老的浏览器支持，它们往往不支持CORS，而绝大多数现代浏览器都已经支持了CORS）。
http://kb.cnblogs.com/page/139725/
http://justcoding.iteye.com/blog/1366102/
3.通过修改document.domain来跨子域
不同的框架之间是可以获取window对象的，但却无法获取相应的属性和方法。比如，有一个页面，它的地址是http://www.example.com/a.html， 在这个页面里面有一个iframe，它的src是http://example.com/b.html, 很显然，这个页面与它里面的iframe框架是不同域的，所以我们是无法通过在页面中书写js代码来获取iframe中的东西的：
https://segmentfault.com/a/1190000000718840#articleHeader5
4.使用window.name来进行跨域
window对象有个name属性，该属性有个特征：即在一个窗口(window)的生命周期内,窗口载入的所有的页面都是共享一个window.name的，每个页面对window.name都有读写的权限，window.name是持久存在一个窗口载入过的所有页面中的。
http://www.admin10000.com/document/3517.html
原理：iframe在加载新页面时，name值是保持不变的，由此可以重定向iframe的引用地址，由外域转到本域。
http://www.examw.com/sheji/javascript/134323/
5.使用HTML5的window.postMessage方法跨域
http://www.cnblogs.com/fuyun2000/archive/2012/09/29/2708510.html
6.利用location.hash+iframe跨域获取数据
http://www.tuicool.com/articles/6neUbeY
3、jQuery的源码看过吗？能不能简单说一下它的实现原理？
1.查找并创建JQuery对象
2.直接使用JQuery对象的方法/属性
强悍的DOM元素查看器（$）
http://ccvita.com/121.html
4、this关键字
this出现的场景分为四类:
有对象就指向调用对象
没调用对象就指向全局对象
用new构造就指向新对象
通过 apply 或 call 或 bind 来改变 this 的所指。
一点:this永远指向函数运行时所在的对象！而不是函数被创建时所在的对象。
bind()
o1对象有个f方法
想让o2对象继承o1的f方法
bind一下，o2对象就有这个现成的东西了。
//o2.f = o1.f.bind(o2);
call()和apply()
http://uule.iteye.com/blog/1158829
bind()返回的是一个函数
call和apply会返回并调用该函数
http://hawx1993.github.io/2015/12/23/js-this/
5.JS数组去重
第一种：
1.构建一个结果数组存放结果
2.用for循环每次从原数组中取出一个元素，再用for循环将这个元素与结果数组中的每一个数进行对比
3.若结果数组中没有该元素，则存到结果数组中
Array.prototype.unique1 = function() {
// 将原数组的第一个元素存入结果数组，可以少循环一次
var res = [this[0]];
// 一开始还以为 i = 1；是作者搞错了，真是low= =
for (var i = 1; i < this.length; i++) {
var repeat = false;
for (var j = 0; j < res.length; j++) {
if (this[i] == res[j]) {
repeat = true;
break;
}
}
if (!repeat) {
res.push(this[i]);
}
}
return res;
}
var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0]
console.log(arr.unique1());
第二种：
1.先将原数组进行排序(这会改变结果数组的顺序)。
2.检查原数组中的第i个元素与结果数组中的最后一个元素是否相同，因为已经排序，所以重复元素会在相邻位置
3.如果不相同，则将该元素存入结果数组中
Array.prototype.unique2 = function(){
this.sort(); //先排序
var res = [this[0]];
for(var i = 1; i < this.length; i++){
if(this[i] !== res[res.length - 1]){
res.push(this[i]);
}
}
return res;
}
var arr = [1, 'a', 'a', 'b', 'd', 'e', 'e', 1, 0]
console.log(arr.unique2());
第三种
1.创建一个新的数组存放结果
2.创建一个空对象
3.for循环时，每次取出一个元素与对象进行对比，如果这个元素不重复，则把它存放到结果数组中，同时把这个元素的内容作为对象的一个属性，并赋值为1(也可赋值为true)，存入到第2步建立的对象中。
说明：至于如何对比，就是每次从原数组中取出一个元素，然后到对象中去访问这个属性，如果能访问到值，则说明重复。
Array.prototype.unique3 = function() {
var res = [];
var json = {};
for (var i = 0; i < this.length; i++) {
if (!json[this[i]]) {
res.push(this[i]);
json[this[i]] = 1;
}
}
return res;
}
var arr = [112, 112, 34, '你好', '112', 112, 34, '你好', 'str', 'str1'];
console.log(arr.unique3());
不过这种方法有很大的疏漏，就是没有考虑到 '112' 和 112 这种元素会被当作相同元素被剔除的情况
判断一下，如果是字符串就加一个前缀，区分一下
Array.prototype.unique3 = function() {
var res = [];
var json = {};
var prefix = '';
for (var i = 0; i < this.length; i++) {
if (typeof this[i] == 'string') {
prefix = '_str';
} else {
prefix = '';
};
if (!json[this[i] + prefix]) {
res.push(this[i]);
json[this[i] + prefix] = 1;
console.log(json)
}
}
return res;
}
var arr = ["112", 112, 34, '你好', '112', 112, 34, '你好', 'str', 'str1'];
console.log(arr.unique3());
http://www.php230.com/1411947001.html
1.JavaScript是一门什么样的语言，它有哪些特点？
JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。
JavaScript脚本语言具有以下特点:
(1)脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
(2)基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
(3)简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
(4)动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
(5)跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。
http://baike.baidu.com/link?url=0rPD_5QRzezEhSDkxUlDNuaKFTOFLuOtbrFbBlgBO5Wdrm9fDpYjrFdR_bp5J93G6dmGDmRxnJ_hgv6Hb_dxUq
