zoukankan      html  css  js  c++  java
  • js 的几种面向对象的方式

    1.对象的字面量

    var obj = {};

    2.创建实例对象

    var obj = new Object();
    obj.name = 'leon';
    obj.age = '23';
    obj.show = function(){
        console.log(this.age);
    }

    3.通过构造函数构造对象

    function fn(name,age){
        this.name = name;
        this.age = age;
        this.show = function(){
            console.log(this.age);
        }
    }
    
    var men1 = new fn('leon','23');
    var men2 = new fn('karen','22');

    4.工厂模式

    用一个函数,通过传递函数返回对象。
    function createfn(name,age){
        var obj = new Object();
        obj.name = 'leon';
        obj.age = '23';
        obj.show = function(){
            console.log(this.age);
        }
        return obj;
    }
    
    createfn(leon,23);
    这样可以一次创建多个不同的对象,但是需要注意的是,每个创建的对象都有不同的age属性,name属性,但是show在每个创建的对象的时候也会穿件一个新的方法模板,这样就会有点浪费内存了,可以这样改造一下。
    function createfn(name,age){
        var obj = new Object();
        obj.name = 'leon';
        obj.age = '23';
        obj.show = showName;
        }
        return obj;
    }
    
    function showName(){
        console.log(this.name);
    }
    
    createfn(leon,23);

    5.原型模式

    function person() {};
    person.prototype.name = 'leon';
    person.prototype.age = '23';
    person.prototype.show = function(){
        console.log(this.age);
    } 
    
    var men = new person();
    console.log(men.name)//leon
    console.log(men.age)//23
    每个创建的person对象都会自动拥有age name 属性和show 方法而且 这种写法有一个好处就是解决了show重复创建的问题,但是两个新问题也随之而来,无法使用构造器传递参数,如person(23,"leon"),更要命的是如果属性是引用类型的所有创建的对象都会持有同一个引用 ,如何解决这个问题?
    

    6.混合模式 (原型模式+构造器)

    function person(name,age){
        this.age = age;
        this.name = name;
        this.array = new Array();
    }
    person.prototype.show =function(){
        console.log(this.age);
    }

    7.动态原型方法

    function person(age,name){  
           this.age=age;  
           this.name=name;  
           if(typeof person._initialized=='undefined'){  
                 person.prototype.showName=function(){  
                         console.log(this.age);  
                 }  
                 person._initialized=true;  
            }  
    }  
  • 相关阅读:
    移动 App 接入 QQ 登录/分享 图文教程
    Word 最后一页无法删除-解决办法
    Java快速入门-04-Java.util包简单总结
    Java快速入门-03-小知识汇总篇(全)
    SSM 框架-06-详细整合教程(IDEA版)(Spring+SpringMVC+MyBatis)
    二叉树的镜像
    浅析I/O模型及其设计模式
    远程方法调用(RMI)原理与示例
    树的子结构
    合并两个排序的链表
  • 原文地址:https://www.cnblogs.com/leon94/p/6028543.html
Copyright © 2011-2022 走看看