js面向对象的几种方式----工厂模式、构造函数模式、原型模式
对象的字面量
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面向对象的几种方式----工厂模式、构造函数模式、原型模式的更多相关文章
- js面向对象的几种方式
对象的字面量 var obj={}:创建实例对象 var obj=new Object();构造函数模式 function fn(){}, new fn();工厂模式:用一个函数,通过传递参数返回对象 ...
- JS面向对象的几种写法
JS 中,面向对象有几种写法.归纳下,大概有下面这几种:工厂模式,构造函数模式,原型模式,构造函数与原型模式的混合使用,原型链继承,借用构造函数继承. 一.工厂模式 function person ( ...
- js创建对象的几种方式
/** * 顺便重温一下对象的创建方式 * 代码简单说明问题就好 * 概念性的东西这里就不提了,只加上自己简单理解 */ /** * 工厂模式,就是将手动的创建细节封装在一个方法里, * return ...
- js面向对象初步探究(上) js面向对象的5种写方法
非常长一段时间看网上大神的JS代码特别吃力.那种面向对象的写法方式让人看得云里来雾里去.于是就研究了一下JS面向对象.因为是初学,就将自己在网上找到的资料整理一下,作为记忆. js面向对象的5种写方法 ...
- js创建对象的6种方式总结
1.new 操作符 + Object 创建对象 var person = new Object(); person.name = "lisi"; person.age = 21; ...
- NET设计模式 第二部分 创建型模式(5):原型模式(Prototype Pattern)
原型模式(Prototype Pattern) ——.NET设计模式系列之六 Terrylee,2006年1月 概述 在软件系统中,有时候面临的产品类是动态变化的,而且这个产品类具有一定的等级结构.这 ...
- js创建对象的三种方式和js工厂模式创建对象
文章地址: https://www.cnblogs.com/sandraryan/ 创建对象 创建对象的三种方式 构造函数 ,是一种特殊的方法.主要用来在创建对象时初始化对象 1. 调用系统的构造函数 ...
- js创建对象的几种方式(工厂模式、构造函数模式、原型模式)
普通方法创建对象 var obj = { name:"猪八戒", sayname:function () { alert(this.name); } } var obj1 = { ...
- JS 创建对象的几种方式
面向对象就是把属性和操作属性的方法放在一起作为一个相互依存的整体--对象,即拥有类的概念,基于类可以创建任意多个实例对象,一般具有封装.继承.多态的特性! ECMA-262把对象定义为:"无 ...
随机推荐
- Codeforces 1148F Foo Fighters 贪心
题意:给你若干个数对,每个数对有两个属性,一个属性是权值,一个属性是位标志,假设这些数对的的权值和是sum,你可以选择一个二进制数s,与所有的数对的位标志按位与,如果按位与之后的位标志有奇数个1,那么 ...
- 运行连接Oracle数据库时,Idea报错: Error : java 不支持发行版本5
按照上面的截图步骤,一步步往下走,再运行程序时就不会报错了. 原文链接:https://blog.csdn.net/qq_22076345/article/details/82392236 感谢原文作 ...
- koa-artTemplate 的使用
1.父页面 <html> <head> <meta charset="UTF-8"> <title>我的音乐</title&g ...
- Largest Submatrix 3
Largest Submatrix 3 给出一个\(n\times m\)的网格图,第i行第j列上的格子有数字\(a[i][j]\),显然,你可以从中找到一个子矩阵,保证子矩阵中的数字互不相同,求子矩 ...
- leetcode-12双周赛-1244-力扣排行榜
题目描述: class Leaderboard: def __init__(self): self.map = collections.Counter() def addScore(self, pla ...
- go结构体上的函数
go结构体上的函数 我们可以将一个方法和一个结构体关联: type Saiyan struct { Name string Power int } func (s *Saiyan) Super() { ...
- 【时间】Unix时间戳
UNIX时间戳:Unix时间戳(英文为Unix epoch, Unix time, POSIX time 或 Unix timestamp) 是从1970年1月1日(UTC/GMT的午夜)开始所经过的 ...
- php 实现的功能
1.php写日志函数 (如:前端请求日志记录) : https://www.cnblogs.com/lvchenfeng/p/6794822.html 2.php中(服务器)使用CURL实现GET和P ...
- VS2012编译WDM驱动
新版的VS2012中集成了WDK8,而且WDK8中已经没有之前的Build Environment了,看来编译驱动只能通过VS2012了,直接开发WDF驱动很方便直接选取相应的模板即可,若是编译以前的 ...
- PHP面试 PHP基础知识 二(常量及数据类型)
常量及数据类型 PHP八种数据类型 四种标量类型 字符串(string).布尔(boolean).浮点(float/double).整型(integer) 两种复合类型 数组(array).对象(ob ...