zoukankan      html  css  js  c++  java
  • 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对类型进行修改,除非你有需要到“私有成员”(好像也有人叫“闭包“)……除非你有需要用到闭包来模拟“私有成员”。

    删除线和斜体部分根据木野狐同志的意见修正。

  • 相关阅读:
    Unity Shader 绘制点直线网格等基本图形
    Unity Shader 一个最简单的顶点/片元着色器
    Unity Shader 在表面着色器中控制顶点变换
    对 Unity 颠球动作的实现
    Access denied for user 'root'@'localhost'
    在centos卸载mysql
    Error:No suitable device found: no device found for connection "System eth0"
    VMware虚拟机桥接方式与真实主机共享上网
    网易的一道笔试题的参考解法---关于广告牌投放问题
    ActionScript的for循环
  • 原文地址:https://www.cnblogs.com/chenxizhang/p/1638008.html
Copyright © 2011-2022 走看看