js前端面试资料整理（纯理论）

js面试资料（纯理论）整理

1、js数据类型

数字、字符串、数组、布尔值、对象、null、undefined

2、js typeof 返回的数据类型

object、number、function、boolean、undefined、string

3、原型对象

每一个javascript对象（null除外）都和另一个对象（原型）关联，每一个对象都从原型继承属性。 原型对象其实就是普通对象（Function.prototype除外,它是函数对象，但它很特殊，他没有prototype属性（前面说道函数对象都有prototype属性））。每个对象都有 __proto__ 属性，但只有函数对象才有 prototype 属性。实例的构造函数属性（constructor）指向构造函数。
原型对象（Person.prototype）是 构造函数（Person）的一个实例。原型对象用于继承。

4、原型链

JS在创建对象（不论是普通对象还是函数对象）的时候，都有一个叫做__proto__的内置属性，用于指向创建它的函数对象的原型对象prototype。person.prototype对象也有__proto__属性，它指向创建它的函数对象（Object）的prototype。Object.prototype对象也有__proto__属性，但它比较特殊，为null。我们把这个有__proto__串起来的直到Object.prototype.__proto__为null的链叫做原型链。

5、继承

原理：子构造函数中执行父构造函数，并用call\apply改变this；克隆父构造函数原型上的方法。
实现方式：1.原型链继承（引用类型共享、无法向父类型传参），2.构造函数继承（函数不能复用），3.组合继承（创建一次实例，调用两次父类构造函数），4.寄生式继承，5.寄生组合式继承，6.原型式继承

6、call()和apply()的区别

作用一样，区别在于传递的参数不一样，都可以用来替代另一个对象调用一个方法，将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象。

7、闭包

闭包是能够读取其他函数内部变量的函数，是定义在一个函数内部的函数，闭包是可以包含自由变量的代码块，这些变量不是在这个代码块或者任何全局上下文中定义的，而是在定义代码块的环境中定义。
特点：函数嵌套函数，内部函数可以访问外部函数的变量，参数和变量不会被回收。
用途：读取函数内部变量，设计私有变量与方法，让变量始终保存在内存中。
缺点：消耗内存，容易造成内存泄漏。

8、事件委托

利用事件冒泡原理，让父元素代替执行自己所触发的事件。

9、阻止事件冒泡和默认事件

阻止冒泡：window.event.cancelBubble=true;event.stopPropagation();
阻止默认事件：window.event.returnValue=false;event.preventDefault();return false;

10、三个使用this的典型应用

事件： 如onclick this->发生事件的对象；
构造函数： this->new 出来的object；
call/apply： 改变this

11、深度拷贝

var newObj = $.extend(true,{},oldObjs)

12、同源策略

Js只能与同一个域中的页面进行通讯，同一个域是指协议相同，端口相同，域名相同。

13、跨域方案

1、jsonp跨域（动态创建script标签），
2、document.domain + iframe跨域；
3、 location.hash + iframe；
4、 window.name + iframe跨域；
5、 postMessage跨域；
6、 跨域资源共享（CORS）；
7、 nginx代理跨域；
8、 nodejs中间件代理跨域；
9、 WebSocket协议跨域

14、new操作符的过程

1、创建一个空对象；
2、将构造函数的作用域赋给新对象（this指向新对象）；
3、执行构造函数（新对象添加属性）；
4、返回新对象

15、this指向问题

this 指的是当前对象，如果在全局范围内使用this，则指代当前页面window；
如果在函数中使用this，则this指代什么是根据当前函数是在什么对象上调用；构造函数或者构造函数原型对象中this指向构造函数的实例。
我们可以使用call和apply改变函数中this的具体指向。
箭头函数的this绑定看的是this所在的函数定义在哪个对象下，绑定到哪个对象则this就指向哪个对象，如果有对象嵌套的情况，则this绑定到最近的一层对象上

16、箭头函数和普通函数的区别

1、箭头函数是匿名函数，不能作为构造函数，不能使用new；
2、箭头函数不绑定arguments，取而代之用rest参数...解决；
3、箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值；
4、箭头函数通过 call() 或 apply() 方法调用一个函数时，只传入了一个参数，对 this 并没有影响；
5、箭头函数没有原型属性；
6、箭头函数不能当做Generator函数,不能使用yield关键字

17、ajax原理

Ajax是异步的javascript和xml，通过后台与服务器进行少量数据交换使网页实现异步更新。
交互模型：1、创建XMLHttpRequest对象；2、open打开url通道并设置异步传输；3、send发送数据到服务器；4、服务器接受数据并处理，处理完后返回结果；5客户端接受服务器返回结果。
同步和异步的区别：同步，脚本会停留并等待服务器发送回复然后再继续；异步，脚本允许页面继续进程并处理可能的回复。

18、js异步处理原理

每一个任务有一个或多个回调函数（callback），前一个任务结束后，不是执行后一个任务，而是执行回调函数，后一个任务则是不等前一个任务结束就执行，所以程序的执行顺序与任务的排列顺序是不一致的、异步的。异步函数，如setTimeout和setInterval，是被压入了称之为Event Loop的队列。Event Loop是一个回调函数队列。当异步函数执行时，回调函数会被压入这个队列。JavaScript引擎直到异步函数执行完成后，才会开始处理事件循环。这意味着JavaScript代码不是多线程的，即使表现的行为相似。事件循环是一个先进先出（FIFO）队列，这说明回调是按照它们被加入队列的顺序执行的。

19、回调地狱

JS异步编程，或使用大量回调函数时，其代码阅读起来晦涩难懂，并不直观。
处理回调地狱：1.减少代码嵌套；2.模块化；3.处理每一个错误。总结：不要嵌套函数，命名后调用更好；使用函数提升；处理回调函数的每一个错误；创建可重用函数，写成模块，让你更容易读懂代码。把你的代码拆分成小块可以帮助你处理错误，写测试，重构，方便为你的代码写更稳定的API

20、Cookie、sessionStorage、localStorage的区别

cookie：生命周期为只在设置的cookie过期时间内，存放大小为4K左右，有个数限制，与服务器通信。
sessionStorage：仅在当前会话下有效，关闭浏览器后被清除，大小一般为5M左右，仅在客户端保存，不参与和服务器通信。
localStorage：生命周期永久，大小一般为5M左右，仅在客户端保存，不参与服务器通信。

21、模块化的过程

1、将系统拆分分割为一个一个的独立部分；
2、将功能和特征相似的部分组合在一起构成资源块；
3、将资源块放到固定地方调用

22、浏览器内核

Ie(Ie内核)、 火狐（Gecko）、谷歌（webkit）、 opear(Presto)