js的面向对象编程思想-面向对象的四种设计模式

面向对象

面向对象是一种编程思想,它是以对象数据类型为导向的一种编程思想;
JS中有句话 万物皆对象
JS c++ PHP java … 面向对象开发 (OOP) object oriented programming

面向对象思想的三种特性

三种特性详细介绍的百度网址 面向对象的三种特性

  • 封装
  • 继承
  • 多态

面向对象的四种设计模式

  • 单例模式
  • 工厂模式
  • 构造函数模式
  • 原型模式
    1. 单例模式
    单例模式 调用自己的属性时的方法
    单例模式 每次都要重新 var 个对象;属于手工模式

    对象名.属性名
    this调用;需要注意 this 的指向问题
    调用其他人的属性 我们只能通过 对象名.属性名
    命名空间 —》 就是咱们定义的这些对象名
    单例 —》单独的实例 – 》就是利用普通的对象作为命名空间; —》 所有的普通对象都属于 Object基类的一个实例;
    ①单例模式
var zfpx = {
        name: 'zfpx',
        set: function () {

        },
        get: function () {

        }
    };

②高级单例模式
于普通的单例模式,没有隐私;谁都能看,谁都能改;有时我们需要保护自己的一些隐私;这时就需要我们的这些高级单例模式

  var person = (function () {
        var name = 'zfpx';
        var fn = function () {
            console.log(name)
        };
        var fn2 = function () {
            console.log(name);
        };
        var fn3 = function () {
            fn2();
        };
        return {
            f: fn
        }
    })();

高级单例模式有个缺点 ----》 会形成一个不销毁的作用域;占用浏览器的内存;
2. 工厂模式
工厂模式 就是一个 普通函数
代码的冗余;
函数可以实现代码的 高内聚和低耦合
单例模式呢有个缺点 ,就是每次都要手动新创造一个对象,当我们需要创造很多个单例时,每次都var 一个新的对象比较麻烦,还会造成一定的代码冗余;这时我们可以利用函数去创造我们需要的单例;
我们把这种模式 成为工厂模式

function factory(name) {
        var obj = {
            name:name,
            set:function () {

            },
            get:function () {

            }
        };
        return obj
    }
    var obj = factory('zfpx');
    var obj2 = factory('zfpx2');
    var obj3 = factory('zfpx3');

3. 构造函数模式
**构造函数模式; 创建一个构造函数;通过 new 去创建 这个构造函数(自定义类)的一个实例
这个实例的proto属性指向 这个构造函数(自定义类) 的 原型对象
这个原型对象上有一个constructor属性 指向 构造函数本身
所有的实例都是一个对象
所有的类 都是一个函数

   function Person3() {
        var name2 = 'zfpx';
        this.name = name2;
        this.age = 9;
        // this.getName = function () {
        //     console.log(12)
        // }
        // return 9;
        // return this;
        // return {}
    }
    Person3.prototype.getName = function () {
        console.log(this.name)
    };
    Person3.prototype.name = 'zhufeng';
    var per = new Person3();
    // var per3 = new Person3();
    var n = Person3();//n
    console.log(per); // {name,age}
    per.getName();
    /*
    * per 是Person3(自定义类) 的一个实例
    * 是实例的话就能调用 所属类原型上的方法和属性
    * */

new 执行函数跟普通函数执行的区别
new 执行 会在函数内部自动创建一个 对象 (this);函数执行完成之后;会把this 默认返回
如果手动修改 return 值; 若return的是个值类型;那么 默认return的 还是 this
若 return 的是个引用数据类型;那么返回的就是 这个引用数据类型

原型模式

利用构造函数
原型: prototype

  • 每一个函数都有一个属性:prototype 这属性指向函数自己的原型对象
  • 每一个对象都有一个 proto 的属性,指向 所属类的 原型对象
  • 每一个默认的原型对象都有一个属性 constructor ;指向所属的函数本身
function Person() {
        this.name = 'zhufeng';
        this.age = 9;
    }

    console.log(Person.prototype.constructor === Person);
    Person.prototype.getName = function () {
        console.log(this.name);
    };
    console.log(Person.prototype.getName());

    // var per1 = new Person();
    var per1 = new Person; // 当构造函数不需要传参数的时候,后边括号可以省略;
    // var per2 = new Person();
    // per1 称为  Person 这个类的一个实例; 同时他也是一个对象;
    console.log(per1.__proto__ === Person.prototype);
    console.log(per1);
    per1.getName();
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,772评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,458评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,610评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,640评论 1 276
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,657评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,590评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,962评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,631评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,870评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,611评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,704评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,386评论 4 319
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,969评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,944评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,179评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 44,742评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,440评论 2 342