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 相关文章推荐
jQuery 1.3 和 Validation 验证插件1.5.1
Jul 09 Javascript
JavaScript基本编码模式小结
May 23 Javascript
JS调用CS里的带参方法实例
Aug 01 Javascript
form表单action提交的js部分与html部分
Jan 07 Javascript
javascript中对变量类型的判断方法
Aug 09 Javascript
JavaScript学习笔记之取数组中最大值和最小值
Mar 23 Javascript
JS获取鼠标选中的文字
Aug 10 Javascript
概述jQuery中的ajax方法
Dec 16 Javascript
angular ng-click防止重复提交实例
Jun 16 Javascript
vuejs 制作背景淡入淡出切换动画的实例
Sep 01 Javascript
vue3.0 CLI - 2.2 - 组件 home.vue 的初步改造
Sep 14 Javascript
vue抽出组件并传值实例
Jul 31 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中使用unset销毁变量并内存释放问题
2012/07/05 PHP
PHP5中GD库生成图形验证码(有汉字)
2013/07/28 PHP
浅谈php中变量的数据类型判断函数
2017/03/04 PHP
PHP实现的文件浏览器功能简单示例
2019/09/12 PHP
js实现DIV的一些简单控制
2007/06/04 Javascript
asp javascript 实现关闭窗口时保存数据的办法
2007/11/24 Javascript
jQuery 源代码显示控件 (Ajax加载方式).
2009/05/18 Javascript
JavaScript调用堆栈及setTimeout使用方法深入剖析
2013/02/16 Javascript
jQuery实现随意改变div任意属性的名称和值(部分原生js实现)
2013/05/28 Javascript
JavaScript中按位“异或”运算符使用介绍
2014/03/14 Javascript
jquery实现动态操作select选中
2015/02/11 Javascript
javascript运算符——逻辑运算符全面解析
2016/06/27 Javascript
Vue.js快速入门教程
2016/09/07 Javascript
JS多物体实现缓冲运动效果示例
2016/12/20 Javascript
javascript设计模式之Adapter模式【适配器模式】实现方法示例
2017/01/13 Javascript
jQuery简单实现向列表动态添加新元素的方法示例
2017/12/25 jQuery
微信小程序实现手势图案锁屏功能
2018/01/30 Javascript
[50:45]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第一场
2018/04/10 DOTA
Python深入学习之内存管理
2014/08/31 Python
Python使用QRCode模块生成二维码实例详解
2017/06/14 Python
Python实现输出程序执行进度百分比的方法
2017/09/16 Python
Python使用matplotlib和pandas实现的画图操作【经典示例】
2018/06/13 Python
python程序封装为win32服务的方法
2021/03/07 Python
Python操作多维数组输出和矩阵运算示例
2019/11/28 Python
如何通过Django使用本地css/js文件
2020/01/20 Python
Python中bisect的用法及示例详解
2020/07/20 Python
阿玛瑞酒店中文官方网站:Amari.com
2018/02/13 全球购物
总经理职责
2013/12/22 职场文书
《云雀的心愿》教学反思
2014/02/25 职场文书
社区居务公开实施方案
2014/03/27 职场文书
幼儿园个人总结
2015/02/28 职场文书
2015年员工试用期工作总结
2015/05/28 职场文书
2016年优秀少先队辅导员事迹材料
2016/02/26 职场文书
Win11局域网共享权限在哪里设置? Win11高级共享的设置技巧
2022/04/05 数码科技
改造DE1103三步曲
2022/04/07 无线电
Python 使用 Frame tkraise() 方法在 Tkinter 应用程序中的Frame之间切换
2022/04/24 Python