对象的字面量

 var obj={}

创建实例对象
 var obj=new Object()

工厂模式

 function cPerson(name,sex,age){
var o = new Object();
o.name = name;
o.sex = sex;
o.age = age;
o.show = function(){
console.log(this.name,this.age,this.sex);
}
return o;
}
var p1 = cPerson('谦龙','男','100');
p1.show();
var p2 = cPerson('雏田','女','14');
p2.show();

工厂模式测试

工厂方式的问题:使用工厂模式能够创建一个包含所有信息的对象,可以无数次的调用的这个函数。虽然其解决了创建多个相似对象的问题,但却没有解决对象识别的问题(即如何得知一个对象的类型)

构造函数模式

function CPerson(name,sex,age) {//注意这里 构造函数首字母大写
this.name = name;
this.sex = sex;
this.age = age;
this.show = function () {
console.log(this.name, this.age, this.sex);
}
}
var p1 = new CPerson('谦龙','男','100');
p1.show();
var p2 = new CPerson('雏田','女','14');
p2.show();

构造函数模式测试

注意构造函数与工厂模式有些不同的地方,如下

构造函数首字母大写

没有显式地创建对象

将属性和方法赋值给了 this 对象

没有return语句

而且以这种方式来调用构造函数会大致经历一下 几个步骤

创建一个新的对象

将构造函数的作用域赋值给这个对象(因此this就指向了这个对象)

执行构造函数中的代码(即给新对象添加属性和方法的过程)

返回对象

注意:构造函数其实和普通的函数没有太大的差别,唯一的不同在于调用方式的不同。以下演示不同的几种调用方式

 // 调用方式1 new 方式
var p1 = new CPerson('谦龙','男','100');
p1.show();//谦龙 100 男
// 调用方式2 普通函数调用
CPerson('谦龙','男','100');
window.show()//谦龙 100 男 注意属性和方法会被设置到window对象上
// 调用方式3 在另一个对象的作用域中调用
var obj = new Object();
CPerson.call(obj,'谦龙','男','100');
obj.show(); //谦龙 100 男 在obj的作用域

构造函数的问题:使用构造函数最主要的问题就是每个方法都要在每个实例上重新创建一次,p1与p2的都有show方法,但不是同一个Function的实例,因为function在js中也是一个对象。因此他们共有的show方法并不相等。

原型模式

每个函数都有一个prototype属性,这个属性是一个指针,指向一个对象。而这个对象的用途是 包含可以由 特定类型 的所有 实例 共享的属性和方法。即调用构造函数所创建的那个对象的 原型对象

好处是可以让所有对象的实例共享他的属性的方法。即无需在构造函数中定义实例的信息

 function CPerson(){
}
CPerson.prototype.name='谦龙';
CPerson.prototype.sex='男';
CPerson.prototype.age=100;
CPerson.prototype.show=function(){
console.log(this.name, this.age, this.sex);
}
var p1 = new CPerson();
p1.show(); //谦龙 100 男
var p2 = new CPerson();
p2.show();//谦龙 100 男
console.log(p1.show == p2.show)//true

js面向对象的几种方式----工厂模式、构造函数模式、原型模式的更多相关文章

  1. js面向对象的几种方式

    对象的字面量 var obj={}:创建实例对象 var obj=new Object();构造函数模式 function fn(){}, new fn();工厂模式:用一个函数,通过传递参数返回对象 ...

  2. JS面向对象的几种写法

    JS 中,面向对象有几种写法.归纳下,大概有下面这几种:工厂模式,构造函数模式,原型模式,构造函数与原型模式的混合使用,原型链继承,借用构造函数继承. 一.工厂模式 function person ( ...

  3. js创建对象的几种方式

    /** * 顺便重温一下对象的创建方式 * 代码简单说明问题就好 * 概念性的东西这里就不提了,只加上自己简单理解 */ /** * 工厂模式,就是将手动的创建细节封装在一个方法里, * return ...

  4. js面向对象初步探究(上) js面向对象的5种写方法

    非常长一段时间看网上大神的JS代码特别吃力.那种面向对象的写法方式让人看得云里来雾里去.于是就研究了一下JS面向对象.因为是初学,就将自己在网上找到的资料整理一下,作为记忆. js面向对象的5种写方法 ...

  5. js创建对象的6种方式总结

    1.new 操作符 + Object 创建对象 var person = new Object(); person.name = "lisi"; person.age = 21; ...

  6. NET设计模式 第二部分 创建型模式(5):原型模式(Prototype Pattern)

    原型模式(Prototype Pattern) ——.NET设计模式系列之六 Terrylee,2006年1月 概述 在软件系统中,有时候面临的产品类是动态变化的,而且这个产品类具有一定的等级结构.这 ...

  7. js创建对象的三种方式和js工厂模式创建对象

    文章地址: https://www.cnblogs.com/sandraryan/ 创建对象 创建对象的三种方式 构造函数 ,是一种特殊的方法.主要用来在创建对象时初始化对象 1. 调用系统的构造函数 ...

  8. js创建对象的几种方式(工厂模式、构造函数模式、原型模式)

    普通方法创建对象 var obj = { name:"猪八戒", sayname:function () { alert(this.name); } } var obj1 = { ...

  9. JS 创建对象的几种方式

    面向对象就是把属性和操作属性的方法放在一起作为一个相互依存的整体--对象,即拥有类的概念,基于类可以创建任意多个实例对象,一般具有封装.继承.多态的特性! ECMA-262把对象定义为:"无 ...

随机推荐

  1. Linux 登录、注销与关机

    Linux 登录.注销与关机 这里主要学习的是命令行环境下的相关操作. 一.登录 Linux 默认的情况下会提供六个终端来让用户登录,切换的方式为使用:[Ctrl + Alt + F1 ~ F6]的组 ...

  2. 总结下awk基本用法

    命令格式: awk '{commands} [{other commands}]' awk 'condition{commands} [{other commands}]' 如:awk '$4==&q ...

  3. 第3篇K8S集群部署

      一.利用ansible部署kubernetes准备: 集群介绍 本系列文档致力于提供快速部署高可用k8s集群的工具,并且也努力成为k8s实践.使用的参考书:基于二进制方式部署和利用ansible- ...

  4. 61. File类

    IO技术主要作用是解决设备与设备之间的数据传输问题.比如:硬盘---->内存     内存的数据---->硬盘上    把硬盘的数据------>内存中 IO技术的应用场景:     ...

  5. Mysql学习笔记(002)-基础查询

    基础查询 # 进阶1:基础查询 /* 语法: select 查询列表 from 表名: 类似于:system.out.println(打印东西); 特点: 1.查询列表可以是:表中的字段,常量值,表达 ...

  6. 构造——cf1202d

    和以前有一题构造01串的很像,固定住一个7,求出3的个数,对1的位置进行贪心 /* 1337 1 13337 3 133337 6 1333337 10 */ #include<bits/std ...

  7. Sqli labs系列-less-2 详细篇

    就今天晚上一个小插曲,瞬间感觉我被嘲讽了. SQL手工注入这个东西,杂说了吧,如果你好久不玩的话,一时说开了,你也只能讲个大概,有时候,长期不写写,你的构造语句还非常容易忘,要不我杂会被瞬间嘲讽了啊. ...

  8. [NOIP模拟23]题解

    中间鸽了好几篇啊QAQ……有时间再补吧…… A.mine sbdp,考场上写的巨麻烦不过还是能A的(虽然MLE了……每一维都少开1就A掉了555).设$dp[i][j][k]$为枚举到第i位,第i位是 ...

  9. 2017年上半年,一线城市豪宅TOP50成交均价排名

    辣眼睛!最新豪宅排行榜来了!释放重磅信号 东方财富网 2017-07-27 08:47 阅读:152 摘要:在中国,在买房这个问题上,不少工薪族都感到亚历山大.但是,在富豪眼里,犯难的是投资哪个房地产 ...

  10. PAT_A1025#PAT Ranking

    Source: PAT A1025 PAT Ranking Description: Programming Ability Test (PAT) is organized by the Colleg ...