理清一下JavaScript面向对象思路

JavaScript的面向对象概念还是比较容易混淆的
服务器君一共花费了284.440 ms进行了6次数据库查询,努力地为您提供了这个页面。
试试阅读模式?希望听取您的建议

借这篇文章理清一下自己的思路,同时也希望能给和我同样一知半解的同学理清一下思路。引发思考来自于我犯的一个错误,错误代码是这样的:

var o = {
    ...
}
var obj = new o();

结果不用说,当然是报错的。遗憾的是我以前一直以为var o = { }是定义了一个叫做o的类。然后自己理了一下。得出一下结论:

var o = {}; 等价于 var o = new Object(); 但不等价于 var o = function(){};

第一二种形式 o是一个对象,Object类的对象。第三种形式 o是一个function,更重要的是o是一个类。

var o = {};
o.oField = "oField";

等价于

var o = {
	oField : "oField"
} 

那问题是:对象上怎么可以直接定义属性呢?

由于o是Object类的对象,所以o.prototype是undefined 所以不能这样 o.prototype.oField = ...

另外,在思考过程中,我写了两段测试代码,一并贴上。可以算是个笔记吧。

	//定义类
    var Engin = function(){};
    
    //实例属性
    Engin.prototype.objectField = "objectField";
    
    //类属性(静态域)
    Engin.classField = "classField";
    
    //实例方法
    Engin.prototype.objectMethod = function(){
        document.write("objectMethod is called<br/>");
    }
    //类方法(静态方法)
    Engin.classMethod = function(){
        document.write("classMethod is called<br/>");
    }
    
    //调用实例方法
    new Engin().objectMethod();
    
    //调用类方法
    Engin.classMethod();
    
    document.write(new Engin().objectField + "<br/>");
    document.write(Engin.classField + "<br/>");
    
    //只能遍历出类属性和类方法
    //怎么遍历出实例属性和实例方法呢?
    document.write("使用for in 遍历Engin对象===============================<br/>");
    for(var o in Engin){
        document.write(o+"<br/>");
    }
    document.write("=======================================================<br/>");
	//定义父类Parent,并在父类里定义了一个属性pField和一个方法pMethod
    var Parent = function(){
        this.pField = "pField";
        this.pMethod = function(){
            document.write("pMethod is called<br/>");
        }
    };
    //定义父类静态属性
    Parent.staticPField = "staticPField";
    //定义父类静态方法
    Parent.staticPMethod = function(){
        document.write("staticPMethod is called<br/>");
    }
    //定义子类Child,并在子类里定义了一个属性cField和一个方法cMethod
    var Child = function(){
        this.cField = "cField";//实例属性
        this.cMethod = function(){//实例方法
            document.write("cMethod is called<br/>");
        }
    };
    //定义子类静态属性
    Child.staticCField = "staticCField";
    //定义子类静态方法
    Child.staticCMethod = function(){
        document.write("staticCMethod is called<br/>");
    }
    //指定Child继承自Parent
    Child.prototype =  new Parent();
    
    //创建子类对象
    var childObj = new Child();
    document.write(childObj.pField+"<br/>");//子类对象访问父类实例属性
    //document.write(childObj.staticPField+"<br/>");//子类对象不能访问父类静态属性
    childObj.pMethod();//子类对象调用父类实例方法
    //childObj.staticPMethod();//子类对象不能调用父类静态方法
    document.write(childObj.cField+"<br/>");//子类对象访问自己的实例属性
    document.write(Child.staticCField+"<br/>");//必须使用类名访问自己的静态属性
    childObj.cMethod();//子类对象调用自己的实例方法
    Child.staticCMethod();//必须使用类名来调用自己的静态方法

本文地址:http://www.nowamagic.net/librarys/veda/detail/337,欢迎访问原出处。

不打个分吗?

转载随意,但请带上本文地址:

http://www.nowamagic.net/librarys/veda/detail/337

如果你认为这篇文章值得更多人阅读,欢迎使用下面的分享功能。
小提示:您可以按快捷键 Ctrl + D,或点此 加入收藏

大家都在看

阅读一百本计算机著作吧,少年

很多人觉得自己技术进步很慢,学习效率低,我觉得一个重要原因是看的书少了。多少是多呢?起码得看3、4、5、6米吧。给个具体的数量,那就100本书吧。很多人知识结构不好而且不系统,因为在特定领域有一个足够量的知识量+足够良好的知识结构,系统化以后就足以应对大量未曾遇到过的问题。

奉劝自学者:构建特定领域的知识结构体系的路径中再也没有比学习该专业的专业课程更好的了。如果我的知识结构体系足以囊括面试官的大部分甚至吞并他的知识结构体系的话,读到他言语中的一个词我们就已经知道他要表达什么,我们可以让他坐“上位”毕竟他是面试官,但是在知识结构体系以及心理上我们就居高临下。

所以,阅读一百本计算机著作吧,少年!

《浪潮之巅》 吴军 (作者)

近一百多年来,总有一些公司很幸运地、有意识或无意识地站在技术革命的浪尖之上。在长达十年甚至几十年的时间里,它们代表着科技的浪潮,直到下一波浪潮的来临。从19世纪末算起,AT&T公司、IBM公司、苹果公司、英特尔公司、微软公司、思科公司、雅虎公司和Google公司都先后被幸运地推到了浪尖。虽然,它们来自不同的领域,中间有些已经衰落或正在衰落,但是它们都极度辉煌过。吴军的这本《浪潮之巅》系统地介绍了这些公司成功的本质原因及科技工业一百多年的发展。在这些公司兴衰的背后,有着它必然的规律。《浪潮之巅》不仅讲述科技工业的历史,更重在揭示它的规律性。

更多计算机宝库...