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

JavaScript 构造函数的更多相关文章

  1. javascript 构造函数方式定义对象 (转载)

    javascript 构造函数方式定义对象   javascript是动态语言,可以在运行时给对象添加属性,也可以给对象删除(delete)属性 <html> <head> & ...

  2. Javascript 构造函数、原型对象、实例之间的关系

    # Javascript 构造函数.原型对象.实例之间的关系 # 创建对象的方式 # 1.new object() 缺点:创建多个对象困难 var hero = new Object(); // 空对 ...

  3. Javascript 构造函数原型继承机制

    我们先聊聊Js的历史,1994年Netscape公司发布了Navigator浏览器0.9班.这是历史上第一个比较成熟的网络浏览器.轰动一时.但是,这个版本的浏览器只能用来浏览,不具备交互功能,最主要的 ...

  4. JavaScript构造函数学习笔记

    1 理解Javascript constructor实现原理 在 JavaScript 中,每个函数都有名为“prototype”的属性,用于引用原型对象.此原型对象又有名为“constructor” ...

  5. Javascript构造函数与prototype

    构造函数 构造函数的缺点 prototype的引入 Prototype模式的验证方法 构造函数 在Javascript语言中,new命令后面跟的不是类,而是构造函数(constructor). 构造函 ...

  6. javascript 构造函数方式定义对象

    javascript是动态语言,可以在运行时给对象添加属性,也可以给对象删除(delete)属性 <html> <head> <script type="tex ...

  7. 深入javascript——构造函数和原型对象

    常用的几种对象创建模式 使用new关键字创建 最基础的对象创建方式,无非就是和其他多数语言一样说的一样:没对象,你new一个呀! var gf = new Object(); gf.name = &q ...

  8. JavaScript构造函数+原型创建对象,原型链+借用构造函数模式继承父类练习

    虽然经常说是做前端开发的,但常常使用的技术反而是JQuery比较多一点.在JavaScript的使用上相对而言少些.尤其是在创建对象使用原型链继承上面,在项目开发中很少用到.所以今天做个demo练习一 ...

  9. JavaScript 构造函数 prototype属性和_proto_和原型链 constructor属性 apply(),call()和bind() 关键字this

    1.构造函数: 通常构造函数首字母需要大写,主要是为了区别ECMAScript的其它函数.(高程三 P145) 构造函数与其他函数的唯一区别,就在于调用它们的方式不同.只要通过new来调用,任何函数都 ...

随机推荐

  1. angular中ueditor插件的使用

    #在angularjs中使用ueditor编辑器需要注意事项: 在ui-view中使用放置ueditor的div,页面加载时编辑器在页面中是不显示的,需要通过指令手动replay 例: /** * u ...

  2. Android ScrollView 不能滚动但是有滚动条

    如果一切都检查完毕,没有任何设置为不能滚动,而且outouch事件也没有被拦截的话,那么在布局文件中检查下是否在ScrollView中的子View中设置了margin_top属性.如果设置了,那么Sc ...

  3. jquery动画总结

    基本动画 show() //直接显示元素,没有动画 show(speed, [callback]) //有动画,有回调函数 hide() //直接隐藏元素,没有动画 hide(speed, [call ...

  4. vsftp 安装日志

    很早的一个日志了,从自家的QQ上,查看总不方便,搬家的. 安装完 centos后 安装vsftpd yum install vsftpd 安装伯克利数据库工具 yum install db4 db4- ...

  5. ASP.NET菜鸟之路之实现新闻列表增删改

    背景 我是一个ASP.NET菜鸟,暂时开始学习ASP.NET,在此记录下我个人敲的代码,没有多少参考价值,请看到的盆友们为我点个赞支持我一下,多谢了. 网站介绍 根据视频的例子修改的方法,其中数据不经 ...

  6. javascript入门学习笔记

    <button type="button" onclick="alert('Welcome!')">点击这里</button>alert ...

  7. Neutron/ML2学习

    Neutron/ML2 Neutron ML2 模块层2(ml2)插件是一种允许OpenStack网络同时地利用在复杂现实数据中心发现的各种第二层网络技术的框架.目前它与存在的openvswitch. ...

  8. Android源码下载方法详解

    转自:http://www.cnblogs.com/anakin/archive/2011/12/20/2295276.html Android源码下载方法详解 相信很多下载过内核的人都对这个很熟悉 ...

  9. CSU 1160(进制问题)

    CSU 1160   Time Limit:1000MS     Memory Limit:131072KB     64bit IO Format:%lld & %llu   Descrip ...

  10. 多目标遗传算法 ------ NSGA-II (部分源码解析)README 算法的部分英文解释

    This is the Readme file for NSGA-II code. About the Algorithm--------------------------------------- ...