四、JavaScript高级模块
基础部分
1. 说说你对this关键字的理解？
- [ ] this 是一个关键字，它代表函数运行时，自动生成的一个内部对象，只能在函数内 部使用。
1.作为纯粹的函数调用 this 指向全局对象
2.作为对象的方法调用 this 指向调用对象
3.作为构造函数被调用 this 指向新的对象（new会改变 this 的指向）
4.apply 调用 this 指向 apply方法的第一个参数
2. 表单验证传输的什么数据？明文还是暗文==加密？如何加密？是每一次传
输数据，都是加密之后才传输吗？
- [ ] 1. 概述： GET是从服务器上请求数据，POST 是发送数据到服务器。事实上，GET方法是把数 据参数队列（query string）加到一个URL上，值和表单是一一对应的。比如说， name=John。在队列里，值和表单用一个&符号分开，空格用+号替换，特殊的符号转换 成十六进制的代码。因为这一队列在 URL里边，这样队列的参数就能看得到，可以被记录 下来，或更改。通常GET 方法还限制字符的大小（大概是 256 字节 ）。事实上POST 方法可以没有时间限制的传递数据到服务器，用户在浏览器端是看不到 这一过程的，所以 POST方法比较适合用于发送一个保密的（比如信用 卡号）或者比较大 量的数据到服务器。
2. 区别： Post 是允许传输大量数据的方法，而 Get 方法会将所要传输的数据附在网址后面，然 后一起送达服务器，因此传送的数据量就会受到限制，但是执行效率却比 Post 方法好。
3. 总结：
1、get 方式的安全性较Post 方式要差些，包含机密信息的话，建议用 Post 数据提交 方式；
2、在做数据查询时，建议用 Get 方式；而在做数据添加、修改或删除时，建议用Post 方式；
4. 所以： 表达如果是向服务器传输数据(如帐号密码等)都是加密数据(post)，如果只是单单想要 从服务器获得数据或者传输的数据并不重要， 可以直接使用明文方式传输( get )
3. 如何实现跨域？
- [ ] JSONP(JSON with Padding 填充式JSON 或参数式 JSON)
在js 中，我们虽然不能直接用XMLHttpRequest 请求不同域上的数据，但是在页面上引入不同域上的js 脚本文件却是可以的，jsonp正是利用这个特性来实现的。
JSONP 由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数，而数据就是传入回调函数中的JSON 数据。
优点： 它的兼容性更好，在更加古老的浏览器中都可以运行，不需要XMLHttpRequest 或 ActiveX 的支持； 能够直接访问响应文本，支持在浏览器与服务器之间双向通信
缺点： JSONP 是从其他域中加载代码执行。如果其他域不安全，很可能会在响应中夹带一些 恶意代码，而此时除了完全放弃 JSONP 调用之外，没有办法追究。因此在使用不是你自己 运维的Web 服务时，一定得保证它安全可靠。 它只支持 GET请求而不支持 POST等其它类型的 HTTP 请求；它只支持跨域 HTTP 请 求这种情况，不能解决不同域的两个页面之间如何进行 JavaScript调用的问题
4. 说说事件委托机制？这样做有什么好处？
- [ ] 事件委托，就是某个事件本来该自己干的，但是自己不干，交给别人来干。就叫事件委 托。打个比方：一个button 对象，本来自己需要监控自身的点击事件，但是自己不来监控这个点击事件，让自己的父节点来监控自己的点击事件。
优点：
提高性能：列如，当有很多 li同时需要注册事件的时候，如果使用传统方法来注册 事件的话，需要给每一个 li 注册事件。然而如果使用委托事件的话，就只需要将事件委托给 该一个元素即可。这样就能提高性能。
新添加的元素还会有之前的事件；
5. call和apply的区别？
- [ ] 它们的共同之处：都“可以用来代替另一个对象调用一个方法，将一个函数的对象上 下文从初始的上下文改变为由 thisObj 指定的新对象。”
它们的不同之处：
Apply：最多只能有两个参数——新this 对象和一个数组 argArray。如果给该方法传递多 个参数，则把参数都写进这个数组里面，当然，即使只有一个参数，也要写进数组里面。如 果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。如果没有提供 argArray 和 thisObj 任何一个参数，那么 Global 对象将被 用作 thisObj， 并且无法被传递任何参数
Call：则是直接的参数列表，主要用在js 对象各方法互相调用的时候，使当前 this 实例指 针保持一致，或在特殊情况下需要改变this指针。如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。
6. 在JS的计时器运行原理是怎样的，为什么可以触发计时效果? 计时器是多线程吗?
- [ ] 1. javascript引擎只有一个线程，强迫异步事件排队等待被执行。
2. setTimeout 和setInterval 本质上不同的地方是他们如何执行异步代码的。
3. 如果一个定时器正在执行的时候被阻塞了，那么它将会被推迟到下一个可能的执行点，这既是使得延迟时间有可能会超过声明定时器时设置的值。
4. Interval 如果有足够的时间来执行（大于制定的延迟），那么它将会无延迟的一个紧 接着一个执行。
5. 原理： 计时器通过设定一定的时间段（毫秒）来异步的执行一段代码。因为 Javascript 是一 个单线程语言，计时器提供了一种绕过这种语言限制来执行代码的能力。
6. 总结： 计时器是单线程的， 需要等待上一个执行完， 如果上一个没有执行完， 下一个需要 延迟执行， 直到上一个执行完。
7. 什么是事件的冒泡和捕获？
- [ ] 事件冒泡：子元素事件的触发会影响父元素事件；
开关事件冒泡：
A，开启事件冒泡：element.addEventListener(eventName，handler，false)；
B，关闭事件冒泡：假设传统方式事件的返回值为 e，就可以通过 e.stopPropagation()来关闭事件冒泡；
事件捕获：父元素的事件会影响子元素的事件；
开启事件捕获：element.addEventListener(eventName，handler，true)
8. 面向对象和类的区别？
- [ ] 简单的说类是对象的模版。
在 js 中没有类， 所以在js 中所谓的 类 就是构造函数， 对象就是由构造函数创建
出来的实例对象。面向对象就是使用面向对象的方式处理问题， 面向对象是对面向过程进
行封装。
面向对象有三大特性
抽象性， 需要通过核心数据和特定环境才能描述对象的具体意义
封装性， 封装就是将数据和功能组合到一起， 在js 中对象就是键值对的集合， 对象
将属性和方法封装起来， 方法将过程封装起来
继承性，将别人的属性和方法成为自己的，传统继承基于模板(类)，js 中继承基于 构
造函数
实际工作部分
1. JavaScript 中的垃圾回收机制?
- [ ] 在Javascript 中，如果一个对象不再被引用，那么这个对象就会被GC 回收。如 果两个对象互相引用，而不再被第3者所引用，那么这两个互相引用的对象也会被回收。 因为函数 a被b引用，b又被 a外的 c引用，这就是为什么 函数 a 执行后不会被回收的原 因。
2. 列出3条以上 FF 和 IE 的脚本兼容问题
- [ ] 1. window.event：
表示当前的事件对象，IE有这个对象，FF没有，FF通过给事件处理函数传递事件对象
2. 获取事件源
IE用srcElement获取事件源，而FF用target获取事件源
3. 添加，去除事件
IE：element.attachEvent(“onclick”,function) element.detachEvent(“onclick”, function)
FF：element.addEventListener(“click”,function, true) element.removeEventListener(“click”, function, true)
4. 获取标签的自定义属性
IE：div1.value或div1[“value”]
FF：可用div1.getAttribute(“value”)
3. 用正则表达式，写出由字母开头，其余由数字、字母、下划线组成的6~30的字符串？
- [ ] /^[a-zA-Z]{1}[\w]{5,29}$/
4. 下列JavaScript代码执行后，iNum的值是多少？
- [ ] var iNum = 0;
for(var i = 1; i < 10; i++){
if(i% 5 == 0){
continue;
}
iNum++;
}
- [ ] 答：8
5. 程序中捕获异常的方法？
- [ ] window.error
try{}catch(error){}finally{}
6. 正则匹配邮箱？
- [ ] /^([a-zA-Z0-9-])+@([a-zA-Z0-9-])+((.[a-zA-Z0-9_-]{2,3}){1,2})$/;
7. Javascript中callee和caller的作用？
- [ ] caller是返回一个对函数的引用，该函数调用了当前函数；
callee是返回正在被执行的function函数，也就是所指定的function对象的正文。
8. 下列代码的输出结果？
function f1(){
var tmp = 1;
this.x = 3;
console.log( tmp );
console.log( this.x );
}
var obj = new f1();
console.log( obj.x );
console.log( f1() );
答：
- [ ] 首先看代码（1），这里实例话化了f1这个类。相当于执行了 f1函数。所以这个时候 A 会输出 1， 而 B 这个时候的 this 代表的是实例化的当前对象 obj ,B 输出 3。
代码（2）毋庸置疑会输出 3，
重点 代码（3）首先这里将不再是一个类，它只是一个函数。那么 A输出 1， B呢？这里的this 代表的其实就是window对象，那么this.x 就是一个全局变量 相当于在外部 的一个全局变量。所以B 输出 3。最后代码由于f没有返回值那么一个函数如果没返回值的话，将会返回 underfined ，所以答案就是 ： 1， 3， 3， 1， 3， underfined 。
9. 下面代码输出结果？
function changeObjectProperty(o){
o.siteUrl = "http://www.csser.com/";
o = new Object();
o.siteUrl = "http://www.popcg.com/";
}
var CSSer = new Object();
changeObjectProperty( CSSer );
console.log( CSSer.siteUrl );
答：
- [ ] "http://www.popcg.com/"
网友评论