• JavaScript 构造函数


    关于JavaScript构造函数,如今出现了很多JavaScript的框架,例如jQuery、Ext等等这些,这些将JavaScript作为一种面向对象的语言进行编程,那么JavaScript到底是怎么样实现面向对象的一些特征的呢,首先,我们来看看JavaScript怎么样来定义一个构造函数。

    function A(x)
    {
    this.x = x;
    }
    var obj = new A(5);
    alert(obj.x);

    这段代码十分简单,但是我们重要的是看到了一个十分惊讶的结果,obj被我们赋予了一个属性x,就如同我们在C#中使用某个类的实例的时候一样。那么这个属性是怎么样产生的呢?

    关键语句:this.x=x。这句话就是进行一个属性的申明与赋值,这里,我们肯定会问到,this是什么?为什么可以使用this.x来进行申明与赋值属性呢?

    其实this代表的就是我们刚刚实例化出来的obj,就相当于我们使用obj去调用了构造函数A里面的属性、方法等等。

    那么,我们怎么样去在构造函数中定义一个方法呢?

    复制代码
    function A(x,y)
    {
    this.x = x;
    this.y = y;
    A.prototype.FunX = function(){alert(x)};
    A.prototype.FunY = function(){alert(y)};
    }
    var obj = new A(5,10);
    alert(obj.x);
    alert(obj.y);
    obj.FunX();
    obj.FunY();
    复制代码

    执行的结果十分简单,弹出5、10、5、10的结果,可以看到

    A.prototype.FunX = function(){alert(x)};
    A.prototype.FunY = function(){alert(y)};

    这两句代码定义了两个方法,分别是FunX和FunY。那么,如果现在出现了一种情况,如果我们需要临时的给A函数添加方法怎么办呢?

    复制代码
    function A(x,y)
    {
    this.x = x;
    this.y = y;
    }
    A.prototype.FunX = function(){alert("5")};
    var obj = new A(5,10);
    alert(obj.x);
    alert(obj.y);
    obj.FunX();
    A.prototype.FunY = function(){alert("10")};
    obj.FunY();
    复制代码

    运行这段代码,我们可以看到,弹出的结果还是和以前的结果一样,但是我们将两个方法都定义在了外边,而且方法FunY是定义在实例化之后的,那么这里大家看出来了什么没?很显然,在我们使用obj.FunY()语句时候,代码会重新的去构造一下obj,然后再来执行此方法,那么如果代码改成这样?

    obj.FunY();
    A.prototype.FunY = function(){alert("10")};

    很显然,FunY()就不会去执行方法了。

  • 相关阅读:
    推荐一波好的代码托管
    二十一、如何导入svg图片
    二十、滑动开关css
    十九、CSS如何引入字体
    十八、移动端rem布局
    十五、css3 Filter--滤镜
    十四、css动画基础知识
    十三、初始化标签默认样式
    十二、移动端头部声明
    十一、使用a标签打电话、发短信、发邮件
  • 原文地址:https://www.cnblogs.com/facial/p/5164158.html
Copyright © 2020-2023  润新知