前端面试题-JS篇03

21、JavaScript 的数据类型都有什么？

基本数据类型：String,Boolean,number,undefined,object,Null 引用数据类型：Object(Array,Date,RegExp,Function)

22、已知 ID 的 Input 输入框，希望获取这个输入框的输入值，怎么做？(不使 用第三方框架)

document.getElementById(“ID”).value

23、怎样添加、移除、移动、复制、创建和查找节点（原生 JS，实在基础，没 细写每一步）

1）创建新节点 createDocumentFragment() //创建一个 DOM 片段 createElement() //创建一个具体的元素 createTextNode() //创建一个文本节点
2）添加、移除、替换、插入 appendChild() //添加 removeChild() //移除 replaceChild() //替换 insertBefore() //插入
3）查找 getElementsByTagName() //通过标签名称 getElementsByName() //通过元素的 Name 属性的值 getElementById() //通过元素 Id，唯一性

24、正则表达式构造函数 var reg=new RegExp(“xxx”)与正则表达字面量 var reg=//有什么不同？

当使用 RegExp()构造函数的时候，不仅需要转义引号（即\”表示”），并且还需要 双反斜杠（即\表示一个\）。使用正则表达字面量的效率更高。

25、列举浏览器对象模型 BOM 里常用的至少 4 个对象，并列举 window 对象的常 用方法至少 5 个

对象：Window document location screen history navigator
方法：Alert() confirm() prompt() open() close()

26、简述列举文档对象模型 DOM 里 document 的常用的查找访问节点的方法并做 简单说明

Document.getElementById 根据元素 id 查找元素 Document.getElementByName 根据元素 name 查找元素 Document.getElementTagName 根据指定的元素名查找元素

27、简述创建函数的几种方式

第一种（函数声明）： function sum1(num1,num2){ return num1+num2; }
第二种（函数表达式）： var sum2 = function(num1,num2){ return num1+num2; }匿名函数： function(){}:只能自己执行自己
第三种（函数对象方式）： var sum3 = new Function(“num1”,“num2”,“return num1+num2”);

28、Javascript 如何实现继承？

原型继承：利用原型让一个引用类型继承另外一个引用类型的属性和方法，原型链方式，即子类通过prototype将所有在父类中通过prototype追加的属性和方法都追加到Child，从而实现了继承
构造函数继承：在子类型构造函数的内部调用超类构造函数，通过使用call()和apply()方法可以在新创建的对象上执行构造函数
组合继承：将原型链和借用构造函数的技术组合在一块，从而发挥两者之长的一种继承模式。
寄生式继承：创建一个仅用于封装继承过程的函数，该函数在内部以某种方式来增强对象，最后再像真正是它做了所有工作一样返回对象。
寄生组合式继承：通过借用函数来继承属性，通过原型链的混成形式来继承方法

29、Javascript 创建对象的几种方式？

工厂方式，构造函数方式，原型模式，混合构造函数原型模式，动态原型方式

30、把 Script 标签 放在页面的最底部的 body 封闭之前 和封闭之后有什么区 别？浏览器会如何解析它们？

如果说放在 body 的封闭之前，将会阻塞其他资源的加载
如果放在 body 封闭之后，不会影响 body 内元素的加载

31、iframe 的优缺点？

优点：
1.解决加载缓慢的第三方内容如图标和广告等的加载问题
2.Security sandbox
3.并行加载脚本
缺点：
1.iframe 会阻塞主页面的 Onload 事件
2.即使内容为空，加载也需要时间
3.没有语意

32、请你谈谈 Cookie 的弊端？

缺点： 1.Cookie数量和长度的限制。每个 domain 最多只能有 20 条 cookie，每个 cookie 长度不 能超过 4KB，否则会被截掉。 2.安全性问题。如果 cookie 被人拦截了，那人就可以取得所有的 session 信息。即使加密 也与事无补，因为拦截者并不需要知道 cookie 的意义，他只要原样转发 cookie 就可以达到 目的了。 3.有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务器端保存 一个计数器。如果我们把这个计数器保存在客户端，那么它起不到任何作用。

33、js 延迟加载的方式有哪些？

1.defer 和 async
2. 动态创建 DOM 方式（创建 script，插入到 DOM 中，加载完毕后 callBack）
3. 按需异步载入 js

34、documen.write 和 innerHTML 的区别？

document.write 只能重绘整个页面
innerHTML 可以重绘页面的一部分

35、哪些操作会造成内存泄漏？

内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。 垃圾回收器定期扫描对象，并计算引用了每个对象的其他对象的数量。如果一个对象的引用 数量为 0（没有其他对象引用过该对象），或对该对象的惟一引用是循环的，那么该对象的 内存即可回收。 1. setTimeout 的第一个参数使用字符串而非函数的话，会引发内存泄漏。 2. 闭包 3. 控制台日志 4. 循环（在两个对象彼此引用且彼此保留时，就会产生一个循环）

36、数组方法 pop() push() unshift() shift()各表示什么意思？

Push()尾部添加、pop()尾部删除、Unshift()头部添加、shift()头部删除

37、IE 和 DOM 事件流的区别

1.执行顺序不一样、
ie9以前只支持事件冒泡，不支持事件捕获
2.参数不一样
attachEvent接受两个参数，第一个参数是事件名称，第二个fnHandler是回调处理函数
addEventListener方法接受三个参数：
第一个参数是事件名称，值得注意的是，这里事件名称与IE的不同，事件名称是没’on’开头的;
第二个参数fnHandler是回调处理函数;
第三个参数注明该处理回调函数是在事件传递过程中的捕获阶段被调用还是冒泡阶段被调用
3.事件加不加 on
4.this 指向问题
IE下利用attachEvent注册的处理函数调用时this指向不再是先前注册事件的元素，这时的this为window对象了
addEventListener，this关键字仍然指向被绑定的DOM元素，另外处理函数参数列表的第一个位置传递事件event对象

38、call 和 apply 的区别

首先call和apply 都是用来修改函数中this的指向问题；
其次就是它们不同的传参方式：注意上一句话中说他们的作用时有两个关键词 ‘函数’和‘this’，想要修改this 的指向，那么必然有一个this修改后的指向，而函数必然后关系到传参问题：call方法可以传给该函数的参数分别作为自己的多个参数，而apply方法必须将传给该函数的参数合并成一个数组作为自己的一个参数：

39、闭包是什么，有什么特性，对页面有什么影响

“官方”的解释是：所谓“闭包”，指的是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。
通俗的讲：就是函数a的内部函数b，被函数a外部的一个变量引用的时候，就创建了一个闭包。
闭包的特性：
①.封闭性：外界无法访问闭包内部的数据，如果在闭包内声明变量，外界是无法访问的，除非闭包主动向外界提供访问接口；
②.持久性：一般的函数，调用完毕之后，系统自动注销函数，而对于闭包来说，在外部函数被调用之后，闭包结构依然保存在系统中，闭包中的数据依然存在，从而实现对数据的持久使用。
优点：
① 减少全局变量。
② 减少传递函数的参数量
③ 封装；
缺点：
使用闭包会占有内存资源，过多的使用闭包会导致内存溢出等.

40、请你谈谈 Cookie 的弊端

缺点：
1.Cookie数量和长度的限制。每个 domain 最多只能有 50 条 cookie，每个 cookie 长度不能超过 4KB，否则会被截掉。
2.安全性问题。如果 cookie 被人拦截了，那人就可以取得所有的 session 信息。即使加密 也与事无补，因为拦截者并不需要知道 cookie 的意义，他只要原样转发 cookie 就可以达到目的了。
3.有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务器端保存 一个计数器。如果我们把这个计数器保存在客户端，那么它起不到任何作用。