Javascript面向对象编程

2016-02-20 00:33 0 1 收藏

图老师小编精心整理的Javascript面向对象编程希望大家喜欢,觉得好的亲们记得收藏起来哦!您的支持就是小编更新的动力~

【 tulaoshi.com - Web开发 】

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)----什么是类和对象
    这是所有面向对象编程之前必须弄明白的.
    所谓类:简单地说就是模板,说的专业一些,是一类具有某种性质的物的集合.比如:人就是一个类,车也是一个类,等等.
    所谓对象:就是类的具体实现.如上面所说,人是一个类,一个具体的人就是一个对象,比如张三.
   
    对象是类的实例化后的结果.javascript中使用new关键字来实例化一个类,生成一个对象.
    例子:
        function people(){    //javascript中一个function也是一个类,这里我们建立一个空的类people
        }
       
        var zhangsan=new people;    //实例化生成一个对象张三


    /*--最简单的类:
     *people类
     *    属性:性别,年龄,姓名
     *    方法:说话
     */
        function people(name,sex,age){
            this.name=name;
            this.sex=sex;
            this.age=age;
            this.say=function(){
                return "我叫"+this.name;
            }
        }
       
        使用时:
        var zhangsan=new people;
        alert(zhangsan.say());
        var lisi=new people;
        alert(lizi.say());
        说明:
            上面使用了this关键字,this总是指向当前的对象,在上面例子中,zhangsan.say中具有this.name,这里的this是当前的对象zhangsan.后面lisi.say则是指向当前对象lisi
            对象具有属性,上面的name,sex和age就是对象的属性.我们这样可以访问,如lisi.name,zhangsan.age
            对象还具有方法,比如上面的say.方法是通过构造函数实现的.使用时,如上面,用lisi.say(),zhangsan.say()
           
            当然我们还可以在实例化对象后为对象添加新的属性和方法.比如:
            zhangsan.girlfriend="小丽";
            zhangsan.doing=function(){
                return "I am eating";
            }

----javascript类/对象和其他面向对象语言的异同
    相同点:面向对象编程的思想都是一样的,世界上所有的具体事物都可以看成对象,而这些事物从属的集合都可以看成类.我们要做的是构造我们需要的类,在实例化成我们需要的对象为我们工作.
    不同点:其他面向对象编程的语言对于类/对象关心下面的事情:
            1.作用域:公用,私用,受保护,静态.而javascript只有一种作用域:公用作用域.
            2.特性:继承,多态.javascript不支持多态,继承方面的内容将在"javascript对象的继承"一文中介绍

----构建javascript类/对象的方式
    首先,可以大致定义出下面几种类型:
        1.工厂方式
        2.构造函数方式
        3.原型方式
        4.混合的构造函数/原型方式
        5.动态原型方法
        6.混合工厂方式
   
    具体说明:
       
            所谓工厂方式,是指先建立对象,然后再往对象里面添加属性和方法.
            eg.1
                var zhangsan=new Object;    //创建对象
                zhangsan.name="张三";        //给对象添加属性
                zhangsan.say=function(){    //给对象增加方法
                    alert("我叫张三");
                }
            eg.2 上面的例子没有封装性,我们可以使用函数封装,实现多重利用
                function people(){
                    var p_object=new Object;
                    p_object.name="张三";
                    p_object.say=function(){
                        alert("我叫张三");
                    }
                    return p_object;    //返回对象
                }
                var zhangsan=people;
                var lisi=people;
                上面zhangsan和lisi两个对象具有完全相同的属性和方法,都叫"张三"(name属性),都会说"我叫张三"(say()方法)
            eg.3 通过传递参数改进eg.2
                function people(name){
                    var p_object=new Object;
                    p_object.name=name;
                    p_object.say=function(){
                        alert("我叫"+this.name);
                    }
                    return p_object;    //返回对象
                }
                var zhangsan=people("张三");
                var lisi=people("李四");
            总结:
                工厂方式,总是先创建一个对象,再往对象中添加你需要的属性和方法.但这种做法对于封装性和多种利用性不是很有利,这导致了这种对象的构造方法不被提倡.
                使用工厂方式总是为每个对象创建独立的函数版本.
                这类方式使用封装然后调用新对象的时候不使用new创建对象.
               
        B.构造函数方式:
            所谓构造函数方式,就像我给出的例子"一个具体形象的例子",就是采用构造函数的方式.它和工厂方式的区别是不再在函数内部创建一个对象.而是通过this关键字指向当前对象.
            构造函数的例子不再给出.
            构造函数和工厂方式一样,会重复生成函数,为每个版本的对象创建独立的函数版本.
       
        C.原型方式
            所谓原型方式,就是利用prototype属性来实现属性和方法的继承
            eg.1
                function people(){
                }
               
                people.prototype.name="张三";
                people.prototype.say=function(){
                    alert("我叫"+this.name);
                };
               
                var zhangsan=new people();
                var lisi=new people();
            原型方式不能通过构造函数传递参数初始化属性的值,因为所有的属性和方法都是通过prototype添加的
           
        D.混合的构造函数/原型方式
            对于对象的属性,使用构造函数的方式
            对于对象的方法,使用原型方式
            eg.1
                function people(name){
                    this.name=name;
                }
                people.prototype.say=function(){
                    return "我的名字叫"+this.name;
                };
               
                var zhangsan=new people("张三");
                document.write(zhangsan.say());
           
            eg.2 我们也可以把prototype写入类,实现视觉上的封装.
                function people(name){
                    this.name=name;
                    people.prototype.say=function(){
                        return "我的名字叫"+this.name;
                    };
                }
               
                var zhangsan=new people("张三");
                document.write(zhangsan.say());
           
            总结:这种构造类/对象的方法是推荐使用的
           
       
            这是在混合的构造函数/原型方式上改进的一种方式(提供更友好的编码风格),他们功能是等价的
            eg.1
                function people(name){
                    this.name=name;
                    if(typeof people._initialized=="undefined"){
                        people.prototype.say=function(){
                            return "我的名字叫"+this.name;
                        };
                        people._initialized=true;
                    }
                }
                var zhangsan=new people("张三");
                document.write(zhangsan.say());
                var lisi=new people("李四");
                document.write(lisi.say());
            这样处理的目的是创建对象的方法后下一次使用时不要再创建.
            由于上面的原因,动态原型方式也是javascript中常用的一种创建类/对象的一种方式
           
        F.混合工厂方式
            混合工厂方式几乎和工厂方式是一样的.它同样是先构造对象,然后再往对象中添加属性和方法.不同的是,混合工厂方式生成对象时依旧使用new关键字.
            eg.1
                function people(){
                    var p_object=new Object;
                    p_object.name="张三";
                    p_object.say=function(){
                        alert("我叫张三");
                    }
                    return p_object;    //返回对象
                }
                var zhangsan=new people;
                var lisi=new people;
                zhangsan.say();
                lisi.say();
            混合工厂方式和工厂方式以及经典方式(构造函数,原型方式)一样会产生问题,不推荐使用
           
    对各种构建类/对象方式的总结:
        通常地,我们使用混合的构造函数/原型方式,即属性使用构造函数方式,方法采用原型方式.当然,加强地,我们可以使用动态原型方式.
        上面两种方式是推荐使用的.
       
                   
----关于prototype的其他功能
    1.给对象(包括本地对象)添加新的方法
        比如Array对象,你可能需要添加一个方法toHexString,你可以这样做:
            Array.prototype.toHexString=function(){
                //code here
            }
    2.重定义方法
        实质是让方法指向一个新的函数
            Array.prototype.toHexString=function(){
                //other code href
            }

来源:https://www.tulaoshi.com/n/20160220/1632115.html

延伸阅读
标签: Web开发
JavaScript 是面向对象的。但是不少人对这一点理解得并不全面。 在 JavaScript 中,对象分为两种。一种可以称为“普通对象”,就是我们所普遍理解的那些:数字、日期、用户自定义的对象(如:{})等等。 还有一种,称为“方法对象”,就是我们通常定义的 function。你可能觉得奇怪:方法就是方法,怎么成了对象了?但是在 JavaSc...
标签: Web开发
作者:Truly http://truly.cnblogs.com/ 日期:2007.7.29 上次我们在《在JavaScript中使用面向对象》讨论了对象的声明、成员的声明、全局变量和局部变量以及命名空间的处理。本文继续讨论面向对象,今天介绍方法重载。 http://www.cnblogs.com/Truly/archive/2007/07/24/830013.html 同时上次有人询问Function对象的apply方法和c...
标签: Delphi
  Delphi 的编程语言是以 Pascal为基础的。 Pascal 语言具有可读性好、编写容易的特点,这使得它很适合作为基础的开发语言。同时,使用编译器创建的应用程序只生成单个可执行文件 (.EXE) ,正是这种结合,使得 Pascal 成为 Delphi这种先进开发环境的编程语言。         本章中,我们将讨论 Object...
标签: Delphi
  2.1.8.4 过程和函数的语句部分         过程或函数的语句部分由 begin 开始, end结束。函数需要一个返回值。可以将返回值赋给函数名称,也可以将返回值赋给 Result 变量。下面的例程将返回值赋给函数名称: function CalculateInterest(Principal,InterestRate: Double):Double; begi...
标签: Web开发
要是XHTML与CSS能面向对象。。太阳应该从北边升起了。但是,凡事都应该带着OO的思想来看问题,也勉强可以凑数拉。其实,早在零几年就有人提出了OO-style,不过已找不到。 那要怎样OO呢?现在大家都知道CSS是可以介样写滴:  .G_G { /* xxxxxx */ }  我们可以把它大约看一个原型,或者说成类,-__-b 好像本来就是类的样子,然后要...

经验教程

930

收藏

21

精华推荐

JavaScript入门教程(3):面向对象

JavaScript入门教程(3):面向对象

我愿為伱战天下

Delphi面向对象的编程方法(四)

Delphi面向对象的编程方法(四)

大家好HX

ASP面向对象编程探讨及比较

ASP面向对象编程探讨及比较

风不动我不动

微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部