讲解还是以示例代码搭配注释的形式，这里做个小目录：
JS代码预解析原理（包括三个段落）；
函数相关（包括 函数传参，带参数函数的调用方式，闭包）；
面向对象（包括 对象创建、原型链，数据类型的检测，继承）。
JS代码预解析原理
复制代码 代码如下:
// 下边给出 三段觉得比较典型的代码示例：
alert(num); // undefined
var num = 0;
alert(str); // 错误：str未定义
str = "string";
alert(func); // undefined
var func = function (){ alert('exec func'); }
test(); // exec test
alert(test()); // 先exec test 后undefined
function test(){ alert('exec test'); }
//var mark = 1;
function mark(x) {
return x * 2;
}
var mark;
alert(mark); // function mark(x) { return x * 2; }
// 去掉前边的var mark = 1;则会返回1
// 当有条件时候（代码包含在条件语句块里）
if (false) {
var mark1 = 1;
function mark1() {
alert("exec mark1");
}
//var mark1;
alert(mark1);
}
alert(mark1);
mark1();
// 由于解析浏览器解析不同，这段代码在不同浏览器里执行的结果不一致，具体原因可从网上查找答案
函数相关（包括 函数传参，带参数函数的调用方式，闭包）
复制代码 代码如下:
function setName(obj){
//obj拷贝了person的值（person是一个对象的引用地址），所以obj也指向了person所指向的对象。
obj.name = "xiaoxiaozi";
obj = {}; // 让obj 指向了另一个对象
obj.name = "admin";
}
var person = {};
setName(person);
alert(person.name); // xiaoxiaozi
var g = "全局变量";
function show(str) {
alert("my site: " + str);
}
setTimeout("show(g);",100); // g是全局变量，函数正确执行
function t() {
var url = "www.xujiwei.cn";
var num = 2;
//setTimeout("alert("+url+")", 3000); // 解析错误，www未定义
//setTimeout("alert("+num+")", 3000); // 解析正确，注意与上句对比
//setTimeout("show('url');", 2000); // url
//setTimeout("show("+ url +");", 2000); // 解析错误，www未定义
//setTimeout("show(url);", 2000); // 解析错误，url未定义
//setTimeout('"show("+ url +");"', 2000); // 解析错误，url未定义
//setTimeout("show('"+ url +"');", 2000); // 正确
//setTimeout(function(){show(url);},1000); // 正确
}
t();
function test1() { //通过闭包，每次能传入不同的j值。
for (var j = 0; j < 3; j++) {
(function (j) {
setTimeout(function () { alert(j) }, 3000);
})(j);
}
}
test1();
(function tt() {
for (var i = 1; i < 4; i++) {
document.getElementById("b" + i).attachEvent("onclick",
new Function('alert("This is button' + i + '");')); // 在IE中测试
}
})() // 立即执行函数，一个文件是否只能有一个？把上边函数写成立即执行出问题，怎么回事？
面向对象（包括 对象创建、原型链，数据类型的检测，继承）
复制代码 代码如下:
function MyFunc() { }; //定义一个空函数
var anObj = new MyFunc(); //使用new操作符，借助MyFun函数，就创建了一个对象
// 等价于：
function MyFunc() { };
var anObj = {}; //创建一个对象
anObj.__proto__ = MyFunc.prototype;
MyFunc.call(anObj); //将anObj对象作为this指针调用MyFunc函数
var yx01 = new function() {return "圆心"};
alert(yx01); // [object Object]
var yx02 = new function() {return new String("圆心")};
alert(yx02); // “圆心”
var myvar= new Array("a","b","c","d");
function A(){}
myvar.constructor = A;
var c = myvar.constructor;
alert(c); // function A(){}
//可见，通过constructor属性获取类型的方法很容易被修改，不应该用来判断类型。
var num = new Number(1);
var arr = [1,2,3];
alert(typeof num); //object 而不是number
alert(typeof arr); //object 而不是Array
alert(typeof null); // object
function t(){};
t.prototype = Array.prototype;
//t.prototype = [];
var x = new t();
alert(x instanceof t);//弹出true
alert(x instanceof Array);//弹出true
alert(x instanceof Object);//弹出true
var num = new Number(1);
var arr = [1,2,3];
alert(Object.prototype.toString.call(num)); // [object Number]
alert(Object.prototype.toString.call(arr)); // [object Array]
// 扩展示例：（apply等价于call）
window.utils = {
toString: Object.prototype.toString,
isObject: function (obj) {
return this.toString.apply(obj) === '[object Object]';
},
isFunction: function (obj) {
return this.toString.apply(obj) === '[object Function]';
},
isArray: function (obj) {
return this.toString.apply(obj) === '[object Array]';
}
}
function A() { }
window.utils.isFunction(A); //true
window.utils.isObject(new A()); //true
window.utils.isArray([]); //true
(function () {
// initializing变量用来标示当前是否处于类的创建阶段，
// - 在类的创建阶段是不能调用原型方法init的
// - 我们曾在本系列的第三篇文章中详细阐述了这个问题
// fnTest是一个正则表达式，可能的取值为（/b_superb/ 或 /.*/）
// - 对 /xyz/.test(function() { xyz; }) 的测试是为了检测浏览器是否支持test参数为函数的情况
// - 不过我对IE7.0,Chrome2.0,FF3.5进行了测试，此测试都返回true。
// - 所以我想这样对fnTest赋值大部分情况下也是对的：fnTest = /b_superb/;
var initializing = false, fnTest = /xyz/.test(function () { xyz; }) ? /b_superb/ : /.*/;
// 基类构造函数
// 这里的this是window，所以这整段代码就向外界开辟了一扇窗户 - window.Class
this.Class = function () { };
// 继承方法定义
Class.extend = function (prop) {
// 这个地方很是迷惑人，还记得我在本系列的第二篇文章中提到的么
// - this具体指向什么不是定义时能决定的，而是要看此函数是怎么被调用的
// - 我们已经知道extend肯定是作为方法调用的，而不是作为构造函数
// - 所以这里this指向的不是Object，而是Function（即是Class），那么this.prototype就是父类的原型对象
// - 注意：_super指向父类的原型对象，我们会在后面的代码中多次碰见这个变量
var _super = this.prototype;
// 通过将子类的原型指向父类的一个实例对象来完成继承
// - 注意：this是基类构造函数（即是Class）
initializing = true;
var prototype = new this();
initializing = false;
// 我觉得这段代码是经过作者优化过的，所以读起来非常生硬，我会在后面详解
for (var name in prop) {
prototype[name] = typeof prop[name] == "function" &&
typeof _super[name] == "function" && fnTest.test(prop[name]) ?
(function (name, fn) {
return function () {
var tmp = this._super; // 这里是必要的，第91行注释代码可说明之。
this._super = _super[name];
var ret = fn.apply(this, arguments);
this._super = tmp;
return ret;
};
})(name, prop[name]) :
prop[name];
}
// 这个地方可以看出，Resig很会伪装哦
// - 使用一个同名的局部变量来覆盖全局变量，很是迷惑人
// - 如果你觉得拗口的话，完全可以使用另外一个名字，比如function F()来代替function Class()
// - 注意：这里的Class不是在最外层定义的那个基类构造函数
// 这里的Class和上边的window.Class函数不一样，这里是window.Class内部的函数局部变量
function Class() {
// 在类的实例化时，调用原型方法init
if (!initializing && this.init)
this.init.apply(this, arguments);
}
// 子类的prototype指向父类的实例（完成继承的关键）
Class.prototype = prototype; // Class指代上边的Class，并非一开始的window.Class
// 修正constructor指向错误
// 是否可用Class.prototype.constructor = Class;来修正？？？
Class.constructor = Class;
// 子类自动获取extend方法，arguments.callee指向当前正在执行的函数
Class.extend = arguments.callee;
return Class;
};
})();
