JS类中定义原型方法的两种实现的区别


Posted in Javascript onMarch 08, 2007

我们知道,给JavaScript类添加原形(prototype)方法是很简单的。而且常用的有下面这两种方法,可是这两种方法在使用时有区别吗?

    JScript Class:
 function JSClass()
 {

 }
    Extends prototype method:
 JSClass.prototype.MethodA = function()
 {

 };
    Or

 function = JSClass.prototype.MethodA()
 {

 };
其实这两个原形定义方式可以简化一下来讨论,先把它们看作是两个函数,如下: 
  Foo1(); 

  function Foo1() 
  { 
      alert(’This is Foo1.’); 
  }
     和   Foo2(); 
  var Foo2 = function() 
  { 
      alert(’This is Foo2.’); 
  }

     运行第一个显然是不会有任何错误的,可是运行第二个就有问题了,这时系统会说:Microsoft JScript runtime error: Object expected。这就是说函数定义(Foo1)在脚本解析器中有最高的初始化优先级,这个很好理解。如果不优先处理函数,那么对于函数中的函数调用就没有办法处理了,假使我们先定fn1()再定义fn2(),却从fn1中调fn2,那么就通不过解析了。为什么Foo2不能被初始化,Foo2的定义根本不是函数定义,它是一个标准的赋值语句,之所以能象标准函数一样的使用Foo2(Foo2()),完全是因为它指向的是一个函数对象的实例而已。
再来看原形方法导入里的两种方式,就很简单了。并且不同的执行优先循序,也决了它们在使用中的不同,看如下示例: 
<script language="javascript">
function NormalClass() 

    this.m_Property1 = ’P1 in Normal Class.’; 
    this.m_Property2 = ’P2 in Normal Class.’; 

    this.toString = function() 
    { 
         return ’[class NormalClass]’; 
    }

    return new InnerClass();   

    function InnerClass() 
    { 
         this.m_Property1 = ’P1 in Inner Class.’;  
         this.m_Property2 = ’P2 in Inner Class.’;  

         this.toString = function() 
         { 
              return ’[class InnerClass]’; 
         }     
    }

    InnerClass.prototype.Method1 = function() 
    { 
         alert(this.m_Property1); 
    }; 

    function InnerClass.prototype.Method2() 
    { 
         alert(this.m_Property2); 
    };   
}
</script>

     执行: 
var nc = new NormalClass(); 
nc.Method1(); 
nc.Method2();

     是什么效果?为什么? 

Javascript 相关文章推荐
小议Function.apply()之二------利用Apply的参数数组化来提高 JavaScript程序性能
Nov 30 Javascript
关于JavaScript定义类和对象的几种方式
Nov 09 Javascript
myeclipse安装jQuery插件的方法
Mar 29 Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 Javascript
验证码按回车不变解决方法
Mar 29 Javascript
后台获取ZTREE选中节点的方法
Feb 12 Javascript
jQuery对象和DOM对象之间相互转换的方法介绍
Feb 28 Javascript
jQuery实现Div拖动+键盘控制综合效果的方法
Mar 10 Javascript
EasyUI实现下拉框多选功能
Nov 07 Javascript
详解webpack-dev-server 设置反向代理解决跨域问题
Apr 18 Javascript
vue router带参数页面刷新或回退参数消失的解决方法
Feb 27 Javascript
Vue组件通信入门之Provide和Inject机制
Dec 29 Javascript
JavaScript语言中的Literal Syntax特性分析
Mar 08 #Javascript
从JavaScript的函数重名看其初始化方式
Mar 08 #Javascript
翻译整理的jQuery使用查询手册
Mar 07 #Javascript
用window.location.href实现刷新另个框架页面
Mar 07 #Javascript
javascript中的location用法简单介绍
Mar 07 #Javascript
JsEasy简介 JsEasy是什么?与下载
Mar 07 #Javascript
动态控制Table的js代码
Mar 07 #Javascript
You might like
php开发文档 会员收费1期
2012/08/14 PHP
解决file_get_contents无法请求https连接的方法
2013/12/17 PHP
php数据库备份还原类分享
2014/03/20 PHP
关于PHP文件的自动运行方法分析
2016/05/13 PHP
thinkPHP实现的联动菜单功能详解
2017/05/05 PHP
JavaScript 序列化对象实现代码
2009/12/18 Javascript
javascript开发随笔一 preventDefault的必要
2011/11/25 Javascript
from 表单提交返回值用post或者是get方法实现
2013/08/21 Javascript
js图片翻书效果代码分享
2015/08/20 Javascript
基于jQuery实现Tabs选项卡自定义插件
2016/11/21 Javascript
解析jQueryEasyUI的使用
2016/11/22 Javascript
利用angularjs1.4制作的简易滑动门效果
2017/02/28 Javascript
利用Jasmine对Angular进行单元测试的方法详解
2017/06/12 Javascript
vue.js的computed,filter,get,set的用法及区别详解
2018/03/08 Javascript
使用Vue.js和Flask来构建一个单页的App的示例
2018/03/21 Javascript
Vue中props的使用详解
2018/06/15 Javascript
vue移动端弹框组件的实例
2018/09/25 Javascript
原生js实现可兼容PC和移动端的拖动滑块功能详解【测试可用】
2019/08/15 Javascript
微信小程序使用前置摄像头拍照
2020/10/22 Javascript
[02:08]2014DOTA2国际邀请赛 430专访:力争取得小组前二
2014/07/11 DOTA
Python Requests安装与简单运用
2016/04/07 Python
Python日期的加减等操作的示例
2017/08/15 Python
Python实现的读取文件内容并写入其他文件操作示例
2019/04/09 Python
pytorch在fintune时将sequential中的层输出方法,以vgg为例
2019/08/20 Python
python使用HTMLTestRunner导出饼图分析报告的方法
2019/12/30 Python
pytorch:model.train和model.eval用法及区别详解
2020/02/20 Python
django admin后管定制-显示字段的实例
2020/03/11 Python
如何在scrapy中捕获并处理各种异常
2020/09/28 Python
Python常用扩展插件使用教程解析
2020/11/02 Python
HTML5实现移动端点击翻牌功能
2020/10/23 HTML / CSS
中国综合性网上购物商城:当当(网上卖书起家)
2016/11/16 全球购物
英国空调、除湿机和通风设备排名第一:Air Con Centre
2019/02/25 全球购物
2014年新生军训方案
2014/05/01 职场文书
JS数组的常用方法整理
2021/03/31 Javascript
JavaScript中MutationObServer监听DOM元素详情
2021/11/27 Javascript
Nginx使用ngx_http_upstream_module实现负载均衡功能示例
2022/08/05 Servers