博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
不会JS中的OOP,你也太菜了吧!(第一篇)
阅读量:4645 次
发布时间:2019-06-09

本文共 2779 字,大约阅读时间需要 9 分钟。

一、你必须知道的

1) 字面量

2) 原型

3) 原型链

4) 构造函数

5) 稳妥对象(没有公共属性,而且其方法也不引用this的对象。稳妥对象适合用在安全的环境中和防止数据被其它程序改变的时候)

 

二、开始创建对象吧

<1>: 首先来看两种最基本的创建对象的方法

1> 使用Object创建对象

var o = new Object();o.sname = 'JChen___1';o.showName = function(){    return this.sname;}

2> 使用对象字面量创建对象

var o = {    name: 'JChen___2',    getName: function(){        return this.name;    }}

但是这两个方式有个明显的缺点:使用同一个接口创建很多对象,会产生大量的重复代码

 

<2> 接下来看看几种创建对象的模式吧

1>工厂模式

function create(name){    var o = new Object();    o.name = name;    o.sayName = function(){        return this.name;    };    return o;}var p1 = create('JChen___');

工厂模式也有一个缺点:就是没有解决对象识别的问题(即怎样知道一个对象的类型)。

 

2> 构造函数模式

function create2(name){    this.name = name;    this.sayName = function(){        return this.name;    };    //this.sayName = sayName;}//function sayName(){ return this.name};var p1 = new create2('JChen___4');

构造函数模式也有一个缺点:就是每个方法都要在每个实例上创建一遍。

当然我们可以用上面的两行注释掉了代码来屏蔽上面那个缺点。

但是……,我们又产生了一个新问题——全局变量。如果有很多方法,我们岂不是要定义很多个全局变量函数。这是个可怕的问题。

 

3> 原型模式

1) 普通方法

function create3(){}create3.prototype.name = 'JChen___5';create3.prototype.sayName = function(){    return this.name;};var p1 = new create3();

 

2) 原型字面量方法——我姑且这么称吧

function create3(){}create3.prototype = {    constructor: create3, //我们要设置它的constructor,如果它很重要    name: 'JChen___5',    sayName: function(){        return this.name;    }};var p1 = new create3();

原型的缺点:

1): 不能传参

2): 共享了变量

 

4> 构造+原型(模式)

function create4(name){    this.name = name;}create4.prototype.sayName = function(){    return this.name;}var p1 = new create4('JChen___6');

这种模式是目前使用最广泛、认同度最高的一种创建自定义类型的方法。

 

5> 动态原型模式

function create5(name){    this.name = name;    if(typeof this.sayName != 'function'){        create5.prototype.sayName = function(){            return this.name;        }    }}var p1 = new create5('JChen___7');

这种方法确实也是十分完美的一种方法。

 

6> 寄生构造函数模式

function create6(name){    var o = new Object();    o.name = name;    o.sayName = function(){        return this.name;    }    return o;}var p1 = new create6('JChen___8');

注意那个return o。构造函数在不返回值的情况下,会返回新对象实例。而通过在构造函数的末尾加入return 语句,可以重写调用构造函数时返回的值。

这个种用法可以用在,假设我们想创建一个具有额外方法的特殊数组。由于不能直接修改Array的构造函数,因此可以使用这个模式。

function specialArray(){    var values = new Array();    values.push.apply(values, arguments);    values.join2 = function(){        return this.join('|');    };    return values;}var colors = new specialArray('red', 'blue', 'green');colors.join2();//returned: red|blue|green

 

7>稳妥构造函数模式

稳妥构造函数遵循与寄生构造函数类似的模式,但是有两点不同:

一是新创建对象的实现方法不引用this

二是不使用new操作符调用构造函数。

function create7(name){    var o = new Object();    var age = 12;                //私有变量    o.sayName = function(){      //私有方法        return name + ' ' + age;    }    return o;}var p1 = create7('JChen___9');

 

三、总结

对象(类)的创建方法大概就这9种了吧。

创建是没问题了,但是这是第一步,如何实现继承呢?且看下回分解。

转载于:https://www.cnblogs.com/JChen666/p/3365337.html

你可能感兴趣的文章
使用CSS3制作漂亮的按钮
查看>>
sql server 2014登录账号
查看>>
使用OutputDebugString输出调试信息
查看>>
leetcode 之Candy(12)
查看>>
kv.go
查看>>
利用截取字符串,生成已声明的字符串中的4位随机验证码。
查看>>
Spring 事务模型
查看>>
【MM系列】SAP S/4 HANA BP创建客户/供应商的一点想法
查看>>
【HANA系列】SAP HANA XS使用JavaScript数据交互详解
查看>>
【HANA系列】SAP HANA SQL获取上周的周一
查看>>
对称矩阵
查看>>
轮播图笔记!
查看>>
值类型与引用类型
查看>>
This kernel requires an x86-64 CPU, but only detected an i686 CPU.
查看>>
PAT 1023 Have Fun with Numbers[大数乘法][一般]
查看>>
三维空间中的几种坐标系
查看>>
乘法表
查看>>
4.express 框架
查看>>
Java基础算法集50题
查看>>
Android 桌面组件widget
查看>>