JavaScript总结

JavaScript
JavaScript 中有几种数据类型？

答：数据类型可以分为基本数据类型和引用数据类型 基本数据类型 ：String、Number、Boolean
、Null、Undefined、Symbol、BigInt ; 引用数据类型：Object; 有些小伙伴喜欢把引用数据类型这块分为
Object 和 Funtion，这也是可以的，(主要是 typeof可以检测function,还有就是Function这个类比较特殊)
其中 Symbol、BigInt 是新增的数据类型

JavaScript []和{}表示什么?

答：[]表示数组, {}表示对象, 这2种声明方式都为字面量方式。 除了字面量方式外还可以用new Array及new
Object来实例化。

JavaScript 什么叫全局变量?什么叫局部变量了?是如何定义出来的?

答：全局变量是在函数外部定义的变量,在JS中全局变量属于window对象,其作用域是整个源程序,全局变量全部存放在静态存储区,在程序开始执行时给全局变量分配存储区,程序运行完毕就释放。
局部变量是相对与全局变量而言的,在特定过程或函数中可以访问的变量,作用域较小,当函数运行结束释放局部变量。
在JavaScript中并没有明确局部变量的概念,是相对于其他编程语言来描述。
参考《JavaScript高级程序设计》中,变量分全局变量和函数变量。 什么叫保留字?在定义变量时我们应该注意哪些?
保留字是JavaScript中已经定义过的字,由于考虑扩展性,一些保留字可能并没有应用于当前的语法中,这是保留字与关键字的区别。
如class、abstract是保留字。在定义变量时应避免与保留字取名相同;

说一说html代码,css代码和js代码的注释方法？

答：HTML注释语法 css注释语法 /* 注释内容 */ javaScript注释 //注释内容
/注释内容/ 写一个从0到59依次循环的计时器？ 答： var flag = 0; function timer () {
flag++; if (flag > 59) {
flag = 0;
return; } console.log(flag); } setInterval(timer, 1000);

JavaScript 事件冒泡机制？

答：事件传播机制（不管是DOM0还是DOM2，这个机制是天生就带的）；
当触发底层元素的某一个事件行为，那么它的上级元素的对应事件行为也会一级级的触发，一直出发到我们的document；（只有相同的事件类型才会触发）
从底层一级级往上传播的机制叫做冒泡；
DOM2级绑定事件，第三个参数写false代表的是冒泡阶段执行，如果写的是true，代表的是在捕获阶段执行；
同一个元素既可以在捕获阶段处理也可以在冒泡阶段处理； DOM0级基本上只能控制冒泡阶段，而DOM2级是可以控制捕获阶段的； 事件委托
利用DOM的传播机制（点击任意元素，document的click都要出发），我们给document绑定一个点击事件，在事件中我们只需要获取事件源；根据不同的事件源做不同的事件就可以的了（这样就可以不用给元素一个个的绑定事件的了）；
当事件发生在子元素中的时候，旺旺会引起连锁反应，就是在它的祖先元素上也会发生这个事件，比如说你点击了div一个，也相当于点击了一个body，同样相当于点击了html，同样相当于点击了document；
理解事件传播的时候要注意两点； 一是事件本身在传播，而不是绑定在事件上的方法会传播；
二是并非所有的事件都会传播，像onfocus，onblur事件就不传播，onmouseenter和onmouseleave事件也不会传播；
我们要知道常见的事件默认行为有哪些，并且要知道组织默认行为，只要绑定到这个行为事件的方法最后加一句，return false就可以了；
但是需要强调的是，如果你的事件绑定是用addEventListener来实现的，那么组织默认行为必须用e.preventDefault=true;
阻止事件冒泡 function (e) { e.preventDefault(); }
事件委托：事件委托就是用事件的传播机制，无论哪一个网页元素，它的click事件都会最终传到document上，这样，则只需在document上处理click事件即可；
document.οnclick=function(e){ e=e||window.event; var
target=e.targrt||e.srcElement;//获取事件源是关键； alert(target.nodeName);
return false; } 事件委托的关键是理解好事件源的概念；

JavaScript 事件兼容性问题有哪些？怎么解决？

答：1、事件对象本身，标准浏览器是时间发生时自动给方法传一个实参，这个实参就是时间对象，IE是全局的window.event；（解决方法是：e=e||window.event）
2、事件源:e.target，IE下是e.srcElement;（解决办法是是 var
target=e.target||e.srcElement;）
3、DOM二级事件绑定：ele.addEventListener,IE是ele.attachEvent； 解决办法是通过
if(ele.addEventListener){ }else if(ele.attachEvent){ }
这样的方法来解决绑定对应的移除方法是removeEventListener和IE的detachEvent;
4、第三点中的IE的attachEvent绑定的方法上， 第一点、this不是当前元素了，而是变成了window；
第二点，事件的执行顺序是混乱的； 在IE678中，如果绑定的方法少于9个，执行的顺序是相反的，如果多于9个，执行的是混乱的；
第三点，同一函数可以重复绑定在同一事件上；
需要解决一个函数不能重复绑定在同一个事件上，低版本IE没有遵循这个原则；要保证一个方法只能被绑定到某事件上一次；
5、阻止事件传播；e.stopPropagation,IE是e.cancelBubble=true这个属性；这个一般不做处理，用这个属性，还可以做观察者模式的；
6、阻止默认行为：e.preventDefault()方法，IE是e.returnValue=false；
7、e.pageX,e.pageY;相对于文档的鼠标坐标IE不支持这两个属性；但都支持clentX，clentY，这个是相对于浏览器的鼠标坐标。可以通过scrollTop+clientY来实现；
Î
e.pageX=(document.documentElement.scrollLeft||document.body.scrollLeft)+
e.clientX;
e.pageY=(document.documentElement.scrollTop||document.body.scrollTop)+
e.clientY;

JavaScript DOM创建元素，添加元素，移动元素，复制节点，删除，替换元素，查找节点的方法？

答：创建元素 document.createElement(‘tagName’); 添加元素
parent.appendChild(childNode); 注：父元素调用该方法 移动元素
由于DOM对象属于引用类型，所以在操作appendChild和insertBefore方法时，
控制的节点如果是文档中存在的节点，那么将把这个节点移到目标处。 复制节点 oLi.cloneNode(true);
注：参数true表示深度克隆（深拷贝），false
表示浅度克隆（浅拷贝），深拷贝也就是复制节点及整个节点数；浅拷贝复制节点本身。复制后返回的节点副本属于文档所有，但并没有为它指定父节点。因此，整个节点副本就成为一个‘孤儿’：

• item 1
• item 2
• item 3
• • 以上代码注意childNode包含文本节点。 cloneNode()方法不会复制添加DOM节点的JS属性，例如事件处理程序等。这个方法只复制特性，其他一切都不会复制。 删除节点 parentNode.removeChild(childNode); 注：父元素调用该方法，返回值为被删除的节点 替换元素 parentNode.replaceChild(newNode,oldNode); 注：oldNode节点必须是parentNode的子节点。 插入元素 parentNode.insertBefore(newEle, oldNode); 注：父元素调用该方法 查找节点的总结 childNodes—返回节点到子节点的节点列表 firstChild—返回节点的首个子节点; lastChild—返回节点的最后一个子节点; nextSibling—返回节点之后紧跟的同级节点; nodeName—返回节点的名字，根据其类型; nodeType—返回节点的类型; nodeValue—设置或返回节点的值，根据其类型; ownerDocument—返回节点的根元素（document对象）; parentNode—返回节点的父节点; previousSibling—返回节点之前紧跟的同级节点; text—返回节点及其后代的文本（IE独有）; xml—返回节点及其后代的XML（IE独有）; 节点对象的方法 appendChild()—向节点的子节点列表的结尾添加新的子节点; cloneNode()—复制节点; hasChildNodes()—判断当前节点是否拥有子节点; insertBefore()—在指定的子节点前插入新的子节点; normalize()—合并相邻的Text节点并删除空的Text节点; removeChild()—删除（并返回）当前节点的指定子节点; replaceChild()—用新节点替换一个子节点; IE6独有方法 selectNodes()—用一个XPath表达式查询选择节点; selectSingleNode()—查找和XPath查询匹配的一个节点; transformNode()—使用XSLT把一个节点转换为一个字符串。transformNodeToObject()—使用XSLT把一个节点转换成为一个文档。 经典的问题解析 创建新节点 createDocumentFragment() //创建一个DOM片段 createElement() //创建一个具体的元素 createTextNode() //创建一个文本节点 添加、移除、替换、插入 appendChild() removeChild() replaceChild() insertBefore() //在已有的子节点前插入一个新的子节点 查找 getElementsByTagName() //通过标签名称 getElementsByName() //通过元素的Name属性的值(IE容错能力较强，会得到一个数组，其中包括id等于name值的) getElementById() //通过元素Id，唯一性 您的DOM怎么封装的？各种库是怎么写的？（DOM库,AJAX库，动画库，事件库）？ 答：在作用域套作用域的时候；子作用域内尽量不返回引用数据类型，因为闭包内的值，是另外一个子闭包的返回值的时候，如果子闭包的返回值是字面量，那么浏览器会在空闲的时候，把作用域销毁；而如果返回值的是一个引用数据类型的值，那么闭包是不会销毁的，在性能优化上，不好！ 下面是封装思路； var Tool = function () {//构造函数模式；用的时候需要new一下； this.flag = "getElementsByClassName" in document; //getElementsByClassName 在IE678中是不存在的。用这个来判断是不是低版本的IE浏览器； //每次只需要判断this.flag是否存在就可以了；如果存在就是标准浏览器，如果不存在就是IE； }; Tool.prototype = {//方法是定义在Tool的prototype上的； constructor: Tool,//重写prototype后，prototype的constructor已经不是原来的Tool了；需要手动给他强制写会到Tool上去； getIndex: function () {},//简单的备注说明； toJSON:function(){},//简单的备注说明； likeArray:function(){}//简单的备注说明； }

JavaScript 字符串的常用方法？
答：

charAt 获取指定索引位置的字符 charCodeAt 获取指定索引位置的字符对应的ASCII码值 indeof/lasrIndexof
获取某个字符串在第一次（最后一次）出现位置的索引，没有的话返回-1，我们通常用这个来检测字符串中是否包含某一个字符；
toUpperCase/tolowerCase将字符串中的字母转大写|小写；
split按照指定的分隔符，讲一个字符串拆分成数组，和数组的join对应；
substr：substr(n,m)从索引n开始截取m个字符，把截取字符返回一个新的字符串；
substring：substring(n,m)从索引n开始截取到索引m处（不包含m），将找到的字符返回成一个新的字符串；
slice：slice(n，m)和substring的用法和意思一样，只是slice可以支持负数作为索引，出现负数索引的时候，用字符串的长度+负数索引，例如：ary.slice(-6,-2)，其实是ary.slice(ary.length-6,ary.length-2)
上面三个方法，如果只写一个n，都是默认截取到字符串末尾的位置；
Replace：replace(“要替换的老字符”,“替换成的新字符”)字符串中字符替换的方法，可以应用正则来统一的进行替换，在正则中我们会详细的讲解replace的强大应用；
Match：把所有和正则匹配到的内容都进行捕获（不能捕获小分组中的内容） trim： 去掉字符串中末尾位置的空白字符（不兼容）

JavaScript 正则验证，当下面的这个表单提交的时候，输入框中不能为空，如果有空格必须把空格去掉，必须是合法的手机号？

答：
<form action="" id="form1" method="get">
  电话号码：<input type="text" value="输入电话号码" id="mobi" name=""/>
  <input type="submit" name=""/>
</form>
var form1 = document.getElementById('form1');
form1.onsubmit = function () {
  var mobi = document.getElementById('mobi');
  var reg = /^1\d{10}$/;
  if (reg.test(mobi.value.replace(/ /g, ''))) {
    console.log('ok');
  } else {
    console.log('error');
    return false;
  }
}

解释一下JavaScript的同源策略？

答：概念:同源策略是客户端脚本（尤其是Javascript）的重要的安全度量标准。 它最早出自Netscape
Navigator2.0，其目的是防止某个文档或脚本从多个不同源装载。 这里的同源策略指的是：协议，域名，端口相同，
同源策略是一种安全协议:指一段脚本只能读取来自同一来源的窗口和文档的属性。

简述 JavaScript AJAX 的原理？

答：ajax是很多种技术的集合体。其中包括 浏览器的xmlHTTPRequest对象，他是负责为你开通另一条连接通道，可以传递信息。
javascript：他是负责调用XMLHTTPRequest对象进行与后台交互的媒介。
xml是一种数据格式，用于服务器应答传递信息的格式。除了xml外，还可以使用任何的文本格式，包括text，html，json等。
ajax并非一种新的技术，而是几种原有技术的结合体。它由下列技术组合而成。 使用CSS和XHTML来表示。 使用DOM模型来交互和动态显示。
使用XMLHttpRequest来和服务器进行异步通信。 使用javascript来绑定和调用。
在上面几中技术中，除了XmlHttpRequest对象以外，其它所有的技术都是基于web标准并且已经得到了广泛使用的，XMLHttpRequest虽然目前还没有被W3C所采纳，但是它已经是一个事实的标准，因为目前几乎所有的主流浏览器都支持它。
XMLHttpRequest是ajax的核心机制，它是在IE5中首先引入的，是一种支持异步请求的技术。简单的说，也就是javascript可以及时向服务器提出请求和处理响应，而不阻塞用户。达到无刷新的效果。
所以我们先从XMLHttpRequest讲起，来看看它的工作原理。 XMLHttpRequest 的属性 它的属性有：
onreadystatechange 每次状态改变所触发事件的事件处理程序。 responseText 从服务器进程返回数据的字符串形式。
responseXML 从服务器进程返回的DOM兼容的文档数据对象。 status
从服务器返回的数字代码，比如常见的404（未找到）和200（已就绪） status Text 伴随状态码的字符串信息 readyState
对象状态值 0 (未初始化) 对象已建立，但是尚未初始化（尚未调用open方法） 1 (初始化) 对象已建立，尚未调用send方法 2
(发送数据) send方法已调用，但是当前的状态及http头未知 3 (数据传送中)
已接收部分数据，因为响应及http头不全，这时通过responseBody和responseText获取部分数据会出现错误， 4 (完成)
数据接收完毕,此时可以通过通过responseXml和responseText获取完整的回应数据
但是，由于各浏览器之间存在差异，所以创建一个XMLHttpRequest对象可能需要不同的方法。
这个差异主要体现在IE和其它浏览器之间。下面是一个比较标准的创建XMLHttpRequest对象的方法。 function
CreateXmlHttp () { //非IE浏览器创建XmlHttpRequest对象 if
(window.XmlHttpRequest) { xmlhttp = new XmlHttpRequest(); }
//IE浏览器创建XmlHttpRequest对象 if (window.ActiveXObject) { try { xmlhttp =
new ActiveXObject(“Microsoft.XMLHTTP”); } catch (e) { try { xmlhttp =
new ActiveXObject(“msxml2.XMLHTTP”); } catch (ex) { } } } } function
Ustbwuyi () { var data = document.getElementById(“username”).value;
CreateXmlHttp(); if (!xmlhttp) { alert(“创建xmlhttp对象异常！”); return
false; } xmlhttp.open(“POST”, url, false); xmlhttp.onreadystatechange
= function () { if (xmlhttp.readyState == 4) { document.getElementById(“user1”).innerHTML = “数据正在加载…”; if
(xmlhttp.status == 200) { document.write(xmlhttp.responseText); } } }
xmlhttp.send(); }
如上所示，函数首先检查XMLHttpRequest的整体状态并且保证它已经完成（readyStatus=4），即数据已经发送完毕。
然后根据服务器的设定询问请求状态，如果一切已经就绪（status=200），那么就执行下面需要的操作。
对于XmlHttpRequest的两个方法，open和send，其中open方法指定了： a、向服务器提交数据的类型，即post还是get。
b、请求的url地址和传递的参数。
c、传输方式，false为同步，true为异步。默认为true。如果是异步通信方式(true)，客户机就不等待服务器的响应；如果是同步方式(false)，客户机就要等到服务器返回消息后才去执行其他操作。我们需要根据实际需要来指定同步方式，在某些页面中，可能会发出多个请求，甚至是有组织有计划有队形大规模的高强度的request，而后一个是会覆盖前一个的，这个时候当然要指定同步方式。
Send方法用来发送请求
知道了XMLHttpRequest的工作流程，我们可以看出，XMLHttpRequest是完全用来向服务器发出一个请求的，它的作用也局限于此，但它的作用是整个ajax实现的关键，因为ajax无非是两个过程，发出请求和响应请求。
并且它完全是一种客户端的技术。而XMLHttpRequest正是处理了服务器端和客户端通信的问题所以才会如此的重要。
现在，我们对ajax的原理大概可以有一个了解了。我们可以把服务器端看成一个数据接口，它返回的是一个纯文本流，当然，这个文本流可以是XML格式，可以是Html，可以是Javascript代码，也可以只是一个字符串。
这时候，XMLHttpRequest向服务器端请求这个页面，服务器端将文本的结果写入页面，这和普通的web开发流程是一样的，不同的是，客户端在异步获取这个结果后，不是直接显示在页面，而是先由javascript来处理，然后再显示在页面。至于现在流行的很多ajax控件，比如magicajax等，可以返回DataSet等其它数据类型，只是将这个过程封装了的结果，本质上他们并没有什么太大的区别。
HTTP状态码有哪些？分别代表什么意思？ 答： 100-199 用于指定客户端应相应的某些动作。 200-299 用于表示请求成功。
300-399 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息。 400-499 用于指出客户端的错误。400
1、语义有误，当前请求无法被服务器理解。401 当前请求需要用户验证 403 服务器已经理解请求，但是拒绝执行它。 500-599
用于支持服务器错误。 503 – 服务不可用; 常用的 100 Continue 继续，一般在发送post请求时，已发送了http
header之后服务端将返回此信息，表示确认，之后发送具体参数信息 200 OK 正常返回信息 201 Created
请求成功并且服务器创建了新的资源 202 Accepted 服务器已接受请求，但尚未处理 301 Moved Permanently
请求的网页已永久移动到新位置。 302 Found 临时性重定向。 303 See Other 临时性重定向，且总是使用 GET 请求新的
URI。 304 Not Modified 自从上次请求后，请求的网页未修改过。 400 Bad Request
服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。 401 Unauthorized 请求未授权。 403
Forbidden 禁止访问。 404 Not Found 找不到如何与 URI 相匹配的资源。 500 Internal Server
Error 最常见的服务器端错误。 503 Service Unavailable 服务器端暂时无法处理请求（可能是过载或维护）。

一个页面输入URL到页面加载显示完成，中间发生了什么？
答：

在浏览器地址栏输⼊URL 浏览器查看缓存，如果请求资源在缓存中并且新鲜，跳转到转码步骤 如果资源未缓存，发起新请求
如果已缓存，检验是否⾜够新鲜，⾜够新鲜直接提供给客户端，否则与服务器进⾏验 证。 检验新鲜通常有两个HTTP头进⾏控制 Expires 和
Cache-Control ： HTTP1.0提供Expires，值为⼀个绝对时间表示缓存新鲜⽇期
HTTP1.1增加了Cache-Control: max-age=,值为以秒为单位的最⼤新鲜时间
浏览器解析URL获取协议，主机，端⼝，path 浏览器组装⼀个HTTP（GET）请求报⽂ 浏览器获取主机ip地址，过程如下： 浏览器缓存
本机缓存 hosts⽂件 路由器缓存 ISP DNS缓存 DNS递归查询（可能存在负载均衡导致每次IP不⼀样）
打开⼀个socket与⽬标IP地址，端⼝建⽴TCP链接，三次握⼿如下： 客户端发送⼀个TCP的SYN=1，Seq=X的包到服务器端⼝
服务器发回SYN=1， ACK=X+1， Seq=Y的响应包 客户端发送ACK=Y+1， Seq=Z TCP链接建⽴后发送HTTP请求
服务器接受请求并解析，将请求转发到服务程序，如虚拟主机使⽤HTTP Host头部判断请 求的服务程序
服务器检查HTTP请求头是否包含缓存验证信息如果验证缓存新鲜，返回304等对应状态码
处理程序读取完整请求并准备HTTP响应，可能需要查询数据库等操作 服务器将响应报⽂通过TCP连接发送回浏览器
浏览器接收HTTP响应，然后根据情况选择关闭TCP连接或者保留重⽤，关闭TCP连接的四 次握⼿如下： 主动⽅发送Fin=1， Ack=Z，
Seq= X报⽂ 被动⽅发送ACK=X+1， Seq=Z报⽂ 被动⽅发送Fin=1， ACK=X， Seq=Y报⽂ 主动⽅发送ACK=Y，
Seq=X报⽂ 浏览器检查响应状态吗：是否为1XX，3XX， 4XX， 5XX，这些情况处理与2XX不同 如果资源可缓存，进⾏缓存
对响应进⾏解码（例如gzip压缩） 根据资源类型决定如何处理（假设资源为HTML⽂档）
解析HTML⽂档，构件DOM树，下载资源，构造CSSOM树，执⾏js脚本，这些操作没有严 格的先后顺序，以下分别解释 构建DOM树：
Tokenizing：根据HTML规范将字符流解析为标记 Lexing：词法分析将标记转换为对象并定义属性和规则 DOM
construction：根据HTML标记关系将对象组成DOM树 解析过程中遇到图⽚、样式表、js⽂件，启动下载 构建CSSOM树：
Tokenizing：字符流转换为标记流 Node：根据标记创建节点 CSSOM：节点创建CSSOM树 根据DOM树和CSSOM树构建渲染树
: 从DOM树的根节点遍历所有可⻅节点，不可⻅节点包括：1） script , meta 这样本身 不可⻅的标签。2)被css隐藏的节点，如
display: none 对每⼀个可⻅节点，找到恰当的CSSOM规则并应⽤ 发布可视节点的内容和计算样式 js解析如下：
浏览器创建Document对象并解析HTML，将解析到的元素和⽂本节点添加到⽂档中，此
时document.readystate为loading
HTML解析器遇到没有async和defer的script时，将他们添加到⽂档中，然后执⾏⾏内
或外部脚本。这些脚本会同步执⾏，并且在脚本下载和执⾏时解析器会暂停。这样就可
以⽤document.write()把⽂本插⼊到输⼊流中。同步脚本经常简单定义函数和注册事件
处理程序，他们可以遍历和操作script和他们之前的⽂档内容
当解析器遇到设置了async属性的script时，开始下载脚本并继续解析⽂档。脚本会在它
下载完成后尽快执⾏，但是解析器不会停下来等它下载。异步脚本禁⽌使⽤
document.write()，它们可以访问⾃⼰script和之前的⽂档元素
当⽂档完成解析，document.readState变成interactive
所有defer脚本会按照在⽂档出现的顺序执⾏，延迟脚本能访问完整⽂档树，禁⽌使⽤ document.write()
浏览器在Document对象上触发DOMContentLoaded事件
此时⽂档完全解析完成，浏览器可能还在等待如图⽚等内容加载，等这些内容完成载⼊
并且所有异步脚本完成载⼊和执⾏，document.readState变为complete，window触发 load事件
显示⻚⾯（HTML解析过程中会逐步显示⻚⾯）

异步加载和延迟加载？

答： 异步加载的方案: 动态插入script标签 通过ajax去获取js代码，然后通过eval执行
script标签上添加defer或者async属性 创建并插入iframe，让它异步执行js 延迟加载：有些 js

代码并不是页面初始化的时候就立刻需要的，而稍后的某些情况才需要的。 对网站重构的理解？怎么重构页面？

答：怎么重构页面？ 编写 CSS、让页面结构更合理化，提升用户体验，实现良好的页面效果和提升性能。 对网站重构的理解
网站重构：在不改变外部行为的前提下，简化结构、添加可读性，而在网站前端保持一致的行为。也就是说是在不改变UI的情况下，对网站进行优化，在扩展的同时保持一致的UI。
对于传统的网站来说重构通常是 表格(table)布局改为DIV+CSS
使网站前端兼容于现代浏览器(针对于不合规范的CSS、如对IE6有效的) 对于移动平台的优化 针对于SEO进行优化
深层次的网站重构应该考虑的方面 减少代码间的耦合 让代码保持弹性 严格按规范编写代码 设计可扩展的API 代替旧有的框架、语言(如VB)
增强用户体验 通常来说对于速度的优化也包含在重构中 压缩JS、CSS、image等前端资源(通常是由服务器来解决)
程序的性能优化(如数据读写) 采用CDN来加速资源加载 对于JS DOM的优化 HTTP服务器的文件缓存 JavaScript
new操作符具体干了什么呢? 答： 创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型 属性和方法被加入到 this
引用的对象中 新创建的对象由 this 所引用,并且最后隐式的返回 this var obj = {}; obj.proto =
Base.prototype; Base.call(obj);

JavaScript call和apply()的作用和区别?

答：核心 动态改变某个类的某个方法的运行环境，就是改变 this 关键字 call是参数一个一个的传
apply是把参数当做一个数据统一传进去，类似arguments； call和apply的区别
Function.prototype.call 和 Function.prototype.apply
它们的作用一样,区别仅在于传入参数的形式的不同。 当使用 call 或者 apply 的时候,如果我们传入的第一个参数为
null,函数体内的 this 会指 向默认的宿主对象,在浏览器中则是 window 有时候我们使用 call 或者 apply
的目的不在于指 定this 指向,而是另有用途,比如借用其他对象的方法。那么我们可以传入 null 来代替某个具体的对象
call和apply的用途 改变this指向 Function.prototype.bind 借用其他对象的方法 call function
add (a, b) { console.log(a + b); } function sub (a, b) { console.log(a

• b); } add.call(sub, 3, 1); //用 add 来替换 sub，add.call(sub,3,1) == add(3,1) ，所以运行结果为: (4); js 中的函数其实是对象，函数名是对 Function 对象的引用

JavaScript 谈谈 this 对象的理解？

答： this 指的是调用函数的那个对象 this 在没有运行之前不能知道代表谁;js的this
指向是不确定的；和定义没有关系，和执行有关， 执行的时候，点前面是谁，this 就是谁；自执行函数里面的this 代表的是 window
定时器书写的时候，window可以省略掉；定时器执行的时候，里面的this 代表的也是 window ； this
是js的一个关键字，随着函数使用场合不同，this 的值会发生变化。 JavaScript 什么是window对象?

什么是document对象?说说你的理解

答： document 是 window 的一个对象属性。 window 对象表示浏览器中打开的窗口。 如果文档包含框架（frame 或
iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。
所有的全局函数和对象都属于Window 对象的属性和方法。 例如，可以只写 document，而不必写 window.document。
同样，可以把当前窗口对象的方法当作函数来使用，如只写 alert()，而不必写 Window.alert()。 document 对
Document 对象的只读引用。

Javascript创建对象的几种方式？

答：
工厂模式
构造函数模式
原型模式
混合构造函数和原型模式
动态原型模式
寄生构造函数模式
稳妥构造函数模式
javascript创建对象简单的说,无非就是使用内置对象或各种自定义对象. 当然还可以用JSON；但写法有很多种. 也能混合使用。
1、对象字面量的方式
person={
firstname:"zhu",
lastname:"anbang",
age:25,
eyecolor:"black"};
2、用function来模拟无参的构造函数
function Person(){}
var person=new Person();//定义一个function. 如果使用new"实例化",该function可以看作是一个Class
person.name="zhu";
person.age="25";
person.work=function(){
alert(person.name+" hello...");
}
person.work();
3、用function来模拟参构造函数来实现（用this关键字定义构造的上下文属性）
function Pet(name,age,hobby){
this.name=name;//this作用域：当前对象
this.age=age;
this.hobby=hobby;
this.eat=function(){
alert("我叫"+this.name+",我喜欢"+this.hobby+",是个程序员");
}
}
var maidou =new Pet("麦兜",25,"coding");//实例化、创建对象
maidou.eat();//调用eat方法
4、用工厂方式来创建（内置对象）
var wcDog =new Object();
wcDog.name="旺财";
wcDog.age=3;
wcDog.work=function(){
alert("我是"+wcDog.name+",汪汪汪......");
}
wcDog.work();
5、用原型方式来创建
function Dog(){}
Dog.prototype.name="旺财";
Dog.prototype.eat=function(){
alert(this.name+"是个吃货");
}
 
var wangcai =new Dog();
wangcai.eat();
5、用混合方式来创建
 
function Car(name,price){
this.name=name;
this.price=price;
}
Car.prototype.sell=function(){
alert("我是"+this.name+". 我现在卖"+this.price+"万元");
}
var camry =new Car("凯美瑞",27);
camry.sell();

JavaScript 模块化开发怎么做？

答：核心：立即执行函数,不暴露私有成员
var module1 = (function () {
var _count = 0;
var m1 = function () {
//...
};
var m2 = function () {
//..
};
return {
m1: m1,
m2: m2
};
})();
求数组中的最大值 var ary=[1,2,3,5,7,90,3,6];
答：alert(Math.max.apply(null,a))。
知识点：将a作为参数传递，返回值为排序后的新数组，第一个参数为null因为不需要借用对象，此值可以忽略。
var a = [3, 4, 6, 2, 9, 11, 4];
var maxNum = Math.max.apply(null, a);
console.log(maxNum);//11
注意：a被当做参数传递进去，因为调用对象可以忽略，所以第一个参数为null,

Math.max.apply返回的是一个新值。
还有一种方法是，先排序，然后头尾就是我们想要的；
 
ary.sort(function(a,b){return a-b})
console.log(ary[0]);
console.log(ary[ary.length-1]);

js对象的深度克隆？

答：
function clone (Obj) {
  var buf;
  if (Obj instanceof Array) {
    buf = [];  //创建一个空的数组 
    var i = Obj.length;
    while (i--) {
      buf[i] = clone(Obj[i]);
    }
    return buf;
  } else if (Obj instanceof Object) {
    buf = {};  //创建一个空对象 
    for (var k in Obj) {  //为这个对象添加新的属性 
      buf[k] = clone(Obj[k]);
    }
    return buf;
  } else {
    return Obj;
  }