浅谈JavaScript 面向对象编程[转]

这周心血来潮，翻看了现在比较流行的几个 JS 脚本框架的底层代码，虽然是走马观花，但也受益良多，感叹先人们的伟大……

感叹是为了缓解严肃的气氛并引出今天要讲的话题，”javascript 面向对象编程”，接下来，我们围绕面向对象的几大关键字：封装，继承，多态，展开。

封装：javascript 中创建对象的模式中，个人认为通过闭包才算的上是真正意义上的封装，所以首先我们先来简单介绍一下闭包，看下面这个例子：

<script type="text/javascript">// <![CDATA[
var Name = function(name) {
this.name = name;
this.getName = function () {
alert(this.name);
}
};
var ioldFish = new Name("老鱼"),
btn = document.getElementById('btn');
btn.onclick = ioldFish.getName;
//btn.onclick = function(){ioldFish.getName.call(ioldFish)};
// ]]></script>

上例中点了按钮以后弹出框里并没有显示出实例对象的属性，这是因为 this 的执行上下文已经改变了，他现在所在的上下文应该是 input 这个 HTML 标签，但是该标签又不存在 getName 这个属性，所以自然无法输出这个属性的属性值了！从这个例子我们不难看出：执行上下文是在执行时才确定的，它随时可以变。

当然你可以去掉上面我注释掉的那段代码，通过 call 改变 this 的执行上下文，从而获取 getName 方法。apply 方法同样可以实现改变执行上下文的功能，不过在 prototype 框架中发现了一个更为优美的实现方法 bind。看一下这个方法的实现吧，不得不感叹先人的伟大……


Function.prototype.bind = function(obj) {
var method = this,
temp = function() {
return method.apply(obj, arguments);
};
}

相信如果能看明白的话，您已经可以靠这些知识点，去写一个简单的脚本框架了，多多实践，相信不久的将来就能高手进级了！如果没看明白，也不用着急，面向对象本来就有些抽象，多练习练习，应该 OK 的了，加油……

来源：http://ued.alipay.com/2009/03/javascript-orient-object