JavaScript 构造函数 面相对象学习必备知识_Javascript教程-查字典教程网
JavaScript 构造函数 面相对象学习必备知识
JavaScript 构造函数 面相对象学习必备知识
发布时间:2016-12-30 来源:查字典编辑
摘要:复制代码代码如下:functionA(x){this.x=x;}varobj=newA(5);alert(obj.x);这段代码十分简单,但...

复制代码 代码如下:

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()就不会去执行方法了。

下一遍,将会说一下关于JavaScript的构造函数与原型(prototype),若有疑问或不正之处,欢迎提出指正和讨论。

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类