javascript中类的定义和使用{转载}
本文转载自:http://www.cnblogs.com/klesh/archive/2007/09/28/understanding-classs-definition-in-javascript.html
关于如何在Javascript中定义类,网上可以找到不少的文章。在开始讲之前,还是先来看看定义类的两种基本方式吧:
(1) 利用函数构造类型。
function Foo(text, url) {this.text = text;this.url = url;this.render = function() {document.write('<a href="' + this.url + '">' + this.text + '</a>');} }
(2) 利用原型prototype。
function Bar(text, url) {this.text = text;this.url = url; } Bar.prototype = {render : function() {document.write('<a href="' + this.url + '">' + this.text + '</a>');} }
代码并不复杂,相信大多数人看完之后都会晓得怎么使用了。但是当我第一次看到这种类的定义方式的时候觉得很奇怪,很长一段时间里都是知其然而不知其所以然。如果你有和我一样的困惑,也许可以分享一下我的一点经验。
先来看看怎么使用定义好的类型,
var a = new Foo('Link A', 'http://www.cnblogs.com'); var b = new Bar('Link B', 'http://www.csdn.net'); a.render(); b.render();
跟很多面向对象语言(如C#)的使用方法一样,都是使用new关键字实例化类,而且当你用instanceof来测试它们是不是相应类型时,都可以得到预望的答案。两种不同方式定义出来的类型Foo和Bar很多时候使用起来并没有什么不同。
但它们在原理上是完全不同,方式1,是在构造函数中动态中创建类的成员,这就意味着每个Foo的实例它们的render方法其实是两个完全独立的函数;而方式2,则是通过原型prototype的方式将类的共享成员与类的实例绑定在一起,所以每个Bar实例的render方法都是指向同一个方法,它是静态的。请看以下代码:
document.write(Object.prototype==String.prototype); var c = new Foo('Link C', 'http://www.asp.net'); document.write(c.render == a.render); // false var d = new Bar('Link D', 'http://www.klesh.cn); document.write(d.render == b.render); // true
Foo在实例化后就是一个独立的个体,它的任何改动不会影响到原来的类型定义,也不会影响到其他的实例;而Bar则不同,它的所有实例都依然受prototype的影响,通过对Bar.prototype的修改或扩展,可以影响到所有包括已经实例化的实例。回过头来看Foo,由于它的成员,特别是成员函数是动态创建的,利用闭包,则可以模拟面向对象中的“私有成员”,这一点内容会很长,稍后有时间再和大家分享。
两种方式各有特点。但是最后,严格来说,无论什么方式,都只能说是“模拟自定义类型”,因为在基于对象的Javascript中,它事实上是没有原生的“自定义类型”的概念的(这一点也很长,暂不细说)。
最后推荐大家一般使用方式2来在Javascript模拟自定义类,一来,速度上会比较快,而且还可以通过prototype对类型进行修改,除非你有需要到“私有成员”(好像也有人叫“闭包“)……除非你有需要用到闭包来模拟“私有成员”。
删除线和斜体部分根据木野狐同志的意见修正。
转载于:https://www.cnblogs.com/chenxizhang/archive/2010/01/02/1638008.html
javascript中类的定义和使用{转载}相关推荐
- javascript的函数定义的区别
javascript中函数定义通常有两种方法: 1. 普通的函数定义: function f1 (){} 2. 变量式函数定义: var f2 = function(){} 还有一种定义方法是new ...
- AJAX基础:JavaScript中类的实现
理解类的实现机制 在JavaScript中可以使用function关键字来定义一个"类",如何为类添加成员.在函数内通过this指针引用的变量或者方法都会成为类的成员, 例如: ...
- 在JavaScript函数中定义全局变量
是否可以在JavaScript函数中定义全局变量? 我想在其他函数中使用trailimage变量(在makeObj函数中声明). <html xmlns="http://www.w3. ...
- Python中类的定义与使用
Python中类的定义与使用 Part I 目标: 1.类的定义 2.父类,子类定义,以及子类调用父类 3.类的组合使用 4.内置功能 1.类的定义 #!/usr/bin/env python #co ...
- python如何定义类_Python中类的定义、继承及使用对象实例详解
本文实例讲述了Python中类的定义.继承及使用对象的方法.分享给大家供大家参考.具体分析如下: Python编程中类的概念可以比作是某种类型集合的描述,如"人类"可以被看作一个类 ...
- ArcGIS中的坐标系定义与转换 (转载)
原文:ArcGIS中的坐标系定义与转换 (转载) 1.基准面概念: GIS中的坐标系定义由基准面和地图投影两组参数确定,而基准面的定义则由特定椭球体及其对应的转换参数确定,因此欲正确定义GIS系统坐 ...
- java类的定义的实例_Java中类的定义和初始化示例详解
类的定义 类的定义格式 //创建类 class classname{ field ://成员属性/字段 method://方法 } class为定义类的关键字,classname为类的名字,{ }为类 ...
- php类的实例化方法,php中类的定义和实例化方法
php中类的定义和实例化方法 发布时间:2020-06-18 11:29:37 来源:亿速云 阅读:57 作者:Leah 这篇文章运用简单易懂的例子给大家介绍php中类的定义和实例化方法,代码非常详细 ...
- JavaScript JS 如何定义多行文本
JavaScript JS 如何定义多行文本 JavaScript JS 定义多行文本最优雅的方式 var lines = function () { 你的文本内容开始 asd ccac文本结束}; ...
最新文章
- 一种清除windows通知区域“僵尸”图标的方案——问题分析
- 自动机器学习:团队如何在自动学习项目中一起工作?
- 冒泡排序的PHP实现 Bubble Sort
- 专家答题:GB50311-2007 常见问题
- Spark任务调度流程及调度策略分析
- python爬取动态网页的内容
- P1332,nssl1316-血色先锋军【bfs】
- 剑指offer--斐波那契数列
- 有点火的程序秒收录牛X
- java encode乱码_java 中文乱码问题的解决
- VirtualApp实战之拿到女神朋友圈封面
- 这可能是有史以来最详细的JNI入门教程
- 开发中的多线程ID检测工具(ESET_VC52_MCID)
- html5 最小化,当前界面最小化快捷键 窗口最小化和全屏化的快捷键是什么?
- 矩阵代数(四)- 分块矩阵
- mysql特性—自适应哈希索引AHI
- linux系统使用crontab定时删除日志文件
- 飞上“云端”的OA系统:什么是OA系统的云端化?
- Sublime 使用总结
- vb 彩牛概率统计for Excel
热门文章
- vue中rules校验是验证首字符_小白也能秒懂Vue源码中那些精细设计(选项处理)...
- Qt + Python + OpenCV图标替换工具 之 Qt界面设计(四)
- 系统架构师学习笔记-操作系统(三)
- Linux学习笔记-使用gdb调试
- Qt学习笔记-OpenGL做正方体并旋转
- C/C++获取CPU相关信息(非WMI)
- MySQL入门之创建、修改、删除、查看数据库
- HTML期末大网页作业-腾讯官网
- mysql常见数据库设计_常见数据库设计
- 方舟进入服务器显示未知错误,服务器点进去后出错求解!急!