深入理解JavaScript系列(5):强大的原型和原型链

来源:未知 责任编辑:责任编辑 发表时间:2014-01-26 21:59 点击:

前言
JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型。
虽然这经常被当作是 JavaScript 的缺点被提及,其实基于原型的继承模型比传统的类继承还要强大。实现传统的类继承模型是很简单,但是实现 JavaScript 中的原型继承则要困难的多。
由于 JavaScript 是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链。
原型
10年前,我刚学习JavaScript的时候,一般都是用如下方式来写代码:
        var decimalDigits = 2,
            tax = 5;

        function add(x, y) {
            return x + y;
        }

        function subtract(x, y) {
            return x - y;
        }

        //alert(add(1, 3));
复制代码
通过执行各个function来得到结果,学习了原型之后,我们可以使用如下方式来美化一下代码。
原型使用方式1:
在使用原型之前,我们需要先将代码做一下小修改:
        var Calculator = function (decimalDigits, tax) {
            this.decimalDigits = decimalDigits;
            this.tax = tax;
        };
复制代码
然后,通过给Calculator对象的prototype属性赋值对象字面量来设定Calculator对象的原型。
        Calculator.prototype = {
            add: function (x, y) {
                return x + y;
            },

            subtract: function (x, y) {
                return x - y;
            }
        };
        //alert((new Calculator()).add(1, 3));
复制代码
这样,我们就可以new Calculator对象以后,就可以调用add方法来计算结果了。
原型使用方式2:
第二种方式是,在赋值原型prototype的时候使用function立即执行的表达式来赋值,即如下格式:
Calculator.prototype = function () { } ();
它的好处在前面的帖子里已经知道了,就是可以封装私有的function,通过return的形式暴露出简单的使用名称,以达到public/private的效果,修改后的代码如下:
 Calculator.prototype = function () {
            add = function (x, y) {

发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
用户名: 验证码:点击我更换图片
最新评论 更多>>

推荐热点

  • Gb2312转utf-8编码的方法(vbs+js)
  • 如何使用Ajax技术开发Web应用程序(1)
  • js跳转路径问题
  • JavaScript模仿桌面窗口
  • 用js检测两个线段是否相交
  • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
  • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
  • 我是如何去了解jquery的(六),案例之幻灯片轮换
  • Jquery封装幻灯片效果
网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
Copyright © 2008-2015 计算机技术学习交流网. 版权所有

豫ICP备11007008号-1