zoukankan      html  css  js  c++  java
  • javascript定义类或对象的方式

      本文介绍的几种定义类或对象的方式中,目前使用最广泛的是:混合的构造函数/原型方式、动态原型方式。不要单独使用经典的构造函数或原型方式。

    1. 工厂方式
    2. 构造器函数
    3. 原型方式
    4. 混合的构造函数/原型方式
    5. 动态原型方式

      工厂方式

    /**
     * 工厂方式
     * 使用此函数可以创建2个属性完全相同的对象。
     * 每次调用函数Car(),都要创建showcolor(),意味着每个对象都有一个自己的showcolor()方法。
     * @returns
     */
    function fac_Car(){
        var ocar = new Object(); 
        ocar.color = "blue";
        ocar.doors = 4;
        ocar.showColor = function(){
            document.write(this.color);
        };
        return ocar;
    }
    var fac_car1 = fac_Car();
    var fac_car2 = fac_Car();

      构造器函数

    /**
     * 构造函数方式
     * 在函数内部没有创建对象,是用this关键字。
     * 同工厂方式一样。每次调用都会为对象创建自己的方法。
     */
    function con_Car(color,door){
        this.color = color;
        this.doors = door;
        this.showColor = function(){
            alert(this.color);
        };
    }
    var con_car1 = new con_Car("red",4);
    var con_car2 = new con_Car("blue",4);

      原型方式

    /**
     * 原型方式
     * 利用了对象的prototype属性。
     * 首先用空函数创建类名,然后prototype属性来定义对象的属性。
     * 所有该函数的对象存放的都是指向showColor()的指针,语法上看起来都属于同一个对象。
     * 当属性指向的是对象时,如数组。一个对象的值改变时在另一个对象中也可以看到
     */
    function pro_Car(){}
    pro_Car.prototype.color = "red";
    pro_Car.prototype.doors = 4;
    pro_Car.prototype.showColor = function(){
        alert(this.color);
    };
    var pro_car1 = new pro_Car();
    var pro_car2 = new pro_Car();
    pro_car1.arr.push("cc");
    alert(pro_car1.arr); //output:aa,bb,cc
    alert(pro_car2.arr); //output:aa,bb,cc

      混合的构造函数/原型方式

    /**
     * 混合的构造函数/原型方式
     * 用构造函数定义对象的非函数属性,用原型方式定义对象的方法。
     */
    function con_pro_Car(color,door){
        this.color = color;
        this.doors = door;
        this.arr = new Array("aa","bb");
    }
    con_pro_Car.prototype.showColor(){
        alert(this.color);
    }
    var con_pro_car1 = new con_pro_Car("red",4);
    var con_pro_car2 = new con_pro_Car("blue",4);
    con_pro_car1.arr.push("cc");
    alert(con_pro_car1.arr); //output:aa,bb,cc
    alert(con_pro_car2.arr); //output:aa,bb

      动态原型方式 

    /**
     * 动态原型方式
     * 动态原型的方式同混合的构造函数/原型方式原理相似。唯一的区别就是赋予对象方法的位置。
     * 动态原型方式是使用一个标志来判断是否已经给原型赋予了方法。这样可以保证该方法只创建一次
     */
    function dyn_pro_Car(color,door){
        this.color = color;
        this.doors = door;
        this.arr = new Array("aa","bb");
        if(typeof dyn_pro_Car._initialized == "undefined"){
            dyn_pro_Car.prototype.showColor = function(){
                alert(this.color);
            };
            dyn_pro_Car._initialized = true;
        };
    };

      (本文仅供学习交流,欢迎大家共同探讨学习~)

  • 相关阅读:
    保障升级:Splashtop 公布安全顾问委员会成员
    Android Studio gradle-5.4.1
    C++__静态成员
    网络嗅探及协议分析-wireshark
    网络嗅探及协议分析-tcpdump
    Linux基本安全防护技术
    C++__动态对象
    C++___深浅拷贝
    C++____函数重载
    C++__函数的默认参数和占位
  • 原文地址:https://www.cnblogs.com/snowcan/p/6425549.html
Copyright © 2011-2022 走看看