javaScript创建对象的几种方式

1.工厂方式

        var laughter = function () {
            return '哈哈哈' 
        }
        function parent() {
            var children = new Object()
            children.name = '小梁'
            children.gender = 'female'
            children.laughter = laughter
            return children
        }

        var baby = parent()
        console.log(baby.name) //小梁
        console.log(baby.laughter()) //哈哈哈

说明:
1.在函数中定义对象,并定义对象的各种属性,,虽然属性可以为方法,但是建议将属性为方法的属性定义到函数之外,这样可以避免重复创建该方法
2.引用该对象的时候,这里使用的是 var x = Parent()而不是 var x = new Parent();因为后者会可能出现很多问题(前者也成为工厂经典方式,后者称之为混合工厂方式),不推荐使用new的方式使用该对象
3.在函数的最后返回该对象
4.不推荐使用这种方式创建对象,但应该了解

2.构造函数方式

        var laughter = function () {
            return '哈哈哈2' 
        }
        function Parent () {
            this.name = '小梁2'
            this.gender = 'female2'
            this.laughter = laughter
        }

        var baby = new Parent()
        console.log(baby.name)  // 小梁2
        console.log(baby.laughter()) //哈哈哈2

说明:
1.与工厂方式相比,使用构造函数方式创建对象,无需再函数内部重建创建对象,而使用this指代,并而函数无需明确return
2.同工厂模式一样,虽然属性的值可以为方法,扔建议将该方法定义在函数之外
3..同样的,不推荐使用这种方式创建对象,但仍需要了解

3.原型方式

        var laughter = function () {
            return '哈哈哈3' 
        }
        function Parent() {}
        
        Parent.prototype.name = '小梁3'
        Parent.prototype.gender = 'female3'
        Parent.prototype.laughter = laughter
        //或则下面这样写
        // Parent.prototype = {
        //     name: '小梁3',
        //     gender: 'female3',
        //     laughter: laughter
        // }

        var baby = new Parent()
        console.log(baby.name) // 小梁3
        console.log(baby.laughter()) //哈哈哈3

说明:
1.函数中不对属性进行定义
2.利用prototype属性对属性进行定义
3.同样的,不推荐使用这样方式创建对象

4.混合构造函数和原型方式

        function Parent() {
            this.name = '小梁4'
            this.gender = 'female4'
        }
        Parent.prototype.laughter = function () {
            return '哈哈哈4'
        }

        var baby = new Parent()
        console.log(baby.name) // 小梁4
        console.log(baby.laughter()) //哈哈哈4

说明:
1.将所有属性不是方法的属性定义在函数中(构造函数方式)
将所有属性值为方法的属性利用prototype在函数之外定义(原型方式)
2.推荐使用这样方式创建对象.

5.动态原型方式

        function Parent(name, gender) {
            this.name = name
            this.gender = gender
            if(typeof Parent._say == 'undefined') { //**标记处1
                Parent.prototype.sayName = function () {
                    return this.name
                }
                Parent._say = true   //**标记处2
            }
        }
        var baby1 = new Parent('小梁5')
        var baby2 = new Parent('碳碳')
        console.log(baby1.sayName ())
        console.log(baby2.sayName ())

说明:
1.动态原型方式可以理解为混合构造函数,原型方式的一个特例
2.执行到【标记处2】就再也不执行【标记处1】第二次,因为此时此刻,Parent._say只是函数的属性,而不是函数对象的原型属性,如果是原型属性的话,new一个函数对象的实例,就会改变函数里面原型对象的属性,那么就会重复构造sayName 这个函数。正因为是这个原因,当Parent._say等于undefined的时候,执行一次sayName ,最后得到的Parent._say = true,这个时候改变的是函数的属性,而不是函数原型的属性,所以外部new一个对象实例根本无法改变函数的属性,从而保证创建该对象的实例时,属性的方法不会被重复创建!
3.推荐使用这种模式

6.寄生构造函数方式

    function myArray() {
        var value = new Array()
        value.push.apply(value, arguments)
        value.change = function () {
            return this.join('/')
        }
        return value
    }
    var fruit = new myArray('apple','banana','pear')
    console.log(fruit.change())

说明:
1.有时候我们并不想数组输出元素之间用“,”分割,于是我们采用join()方法;但是每定义一个引用类型都使用一次join()方法有点麻烦,那么解决这个问题的办法就是直接改变Array构造函数默认定义的输出方式, 类似Object,Array,Date等等的拥有原生构造函数的引用类型并不能直接修改其原生构造函数,那么此时寄生构造函数就派上用场了。
2.其实寄生构造函数就是在原生构造函数上的一个扩展,也就是你可以利用寄生构造函数来自定义一种引用类型,实现自己想要达到的效果。

7.稳妥构造函数方式

    function Person(name,age,gender){
        var obj = new Object();
        obj.sayName = function(){
            console.log(name)
        };
        return obj;
    }
    var person = Person("小梁",18,"female");
    person.sayName();

说明:
1.稳妥即没有公共属性,而且其方法也不引用this对象,这种模式适应于一些安全环境中(禁止使用this和new),或防止数据被其他应用程序改动;
2.这里person中保存了一个稳妥对象,除了调用sayName()方法外,没有别的方式可以访问其数据成员。即使有其他代码会给这个对象添加方法或属性,但也不可能有别的办法访问传入到构造函数中的原始数据 。同样与寄生函数模式类似,使用稳妥构造函数模式创建的对象与构造函数之间也没有任何关系.

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

推荐阅读更多精彩内容