javascript创建对象的方法总结
Javascript创建对象
最简单的方法:创建object实例。
var person=new Object();
person.name="Joey";
person.age=28;
person.sayName=function(){
alert(this.name);
};
或者使用字面量的形式会简洁一些
var person={
name:"Joey",
age:28,
sayName:function(){alert(this.name);}
};
缺点:如果要创建多个实例会产生大量重复代码,最好只用于创建单个对象。
工厂模式
ECMAscript中是没有类的,由于利用Obeject创建多个实例代码量太多,于是考虑使用一个函数将创建对象的过程封装起来。
function creatPerson(name,age){
var o=new Object();
o.name=name;
o.age=age;
o.sayName=function(){
alert(this.name)};
}
return o;
var person1=creatPerson("Joey",28);
var person2=creatPerson("Mary",20);
在creatPerson函数中,实例化了一个对象o,给了o三个属性(sayName属性对应的是一个函数)。通过传入函数的参数来为属性赋值,最终范围对象o,就像一个工厂,把原料(参数)投进去,内部进行赋值,然后把成品(对象o)返回给你。利用这种模式,可以直接调用该函数,控制不同的参数来创建许多相似的实例,非常方便。
缺陷:虽然工厂模式可以创建多个相似对象,可是没有解决对象识别的问题,在java/C#中,我们在通常会创建很多类,然后对操作不同的实例,然而在上述工厂模式中,无论定义多少个函数,实例化的对象都是Obeject类型。
构造函数模式
在var o=new Object();这个语句中,使用了new操作符调用了Object()构造函数创建了新的Object类型对象,那么我们能不能自定义构造函数来创建自定义类型的对象呢?
function Person(name,age){
this.name=name;
this.age=age;
this.sayName=function(){
alert(this.name);
};
}
var person1=new Person("Joey",28);
var person2=new Person("Mary",20);
这个例子中Person()函数取代了工厂模式中的creatPerson()函数,两者不同之处在于:
1.没有显式创建对象。
2.将属性和方法赋给了this对象。
3.没有return语句。
ps:在构造函数中的this指向全局对象(window)
当调用构造函数实例化对象时,必须使用new操作符,此时会经历以下步骤:
1.创建一个新对象。
2.将构造函数的作用域赋给新对象(此时this指向了这个新对象)。
3.执行构造函数中的代码(为新对象添加属性)。
4.返回新对象。
person1和person分别保存着Person的不同实例,这两个对象都有一个constructor(构造函数)属性,指向Person。constructor属性用来标识对象类型,如果要检测对象类型,可以使用instanceof操作符。
alert (person1 instanceof Object);//true
alert (person1 instanceof Person);//true
alert (person2 instanceof Object);//true
alert (person2 instanceof Person);//true
创建自定义构造函数意味着将来可以将它的实例标识为一种特定的类型;这正是构造函数模式的优点。
ps:person1和person2同时是Object的实例,是因为所有对象继承自Object。
构造函数虽然好用,但是也有缺点,使用构造函数的主要问题,就是每个方法要在每个实例上重新创建一遍。
alert(person1.sayName==person.sayName);//false
从上面的代码可以看出person1和person2中的sayName方法是不等的。
原型模式
每个函数都有一个prototype属性,指向一个对象,该对象包含可以由特定类型的所有实例共享的属性和方法。关于prototype在此将不详细叙述(复杂QWQ)
调用构造函数创建一个新实例之后,实例类部将包含一个指针_proto_指向构造函数的prototype对象,实现共享。
function Person()
{}
Person.prototype.name="Joey";
Person.prototype.age=28;
Person.prototype.sayName=function(){
alert(this.name);
};
var person1=new Person();
var person2=new Person();
person2.sayName();//"Joey"
person1.sayName();//"Joey"
上例写出了原型模式的基本用法,多用于共享属性和方法。
缺点:1.无法传递参数,所有实例获得的值都一样。
2.若共享的属性为引用类型,一旦改变一个实例中的引用类型值,会影响其他实例中的引用类型属性,这就是为什么很少单独使用原型模式的原因。
ps:若在实例中添加同名基本类型的值,会屏蔽原型中的对应属性。
最常用:组合模式
组合使用构造函数和原型模式来创建自定义类型。
构造函数用于定义实例属性,而原型模式用于定义方法和共享的属性。
function Person(name,age){
this.name=name;
this.age=age;
this.friends=["W","M"];
}
Person.prototype.sayName=function(){
alert(this.name);
};
var person1=new Person("Joey",28);
var person2=new Person("Mary",20);
person1.friends.push("van");
alert(person1.friends);//"Van","W","M"
alert(person2.friends);//"W","M"
alert(person1.sayName===person2.sayName);//true
上述代码中,构造函数模式中重复创建函数的缺点没有了,sayName()函数在原型中创建。引用类型则被声明在了构造函数里面,作为实例特有的属性,实例属性也可以利用参数传值进行初始化。
这是定义自定义类型,使用最广泛的方法,也是大家默认的一种模式。
javascript创建对象的方法总结的更多相关文章
- javascript创建对象的方法--基本模式
javascript创建对象的方法--基本模式 一.总结 关注本质 二.代码 <!DOCTYPE html> <html lang="zh-cn"> < ...
- javascript创建对象的方法--动态原型模式
javascript创建对象的方法--动态原型模式 一.总结 1.作用:解决组合模式的属性和函数分离问题 2.思路:基本思路和组合模式相同:共用的函数和属性用原型方式,非共用的的函数和属性用构造函数 ...
- javascript创建对象的方法--组合模式
javascript创建对象的方法--组合模式 一.总结 0.作用:解决原型模式对象独有属性创建麻烦的问题 1.组合模式使用普遍:jquery就是用的组合模式,组合模式使用非常普遍 2.组合模式优点: ...
- javascript创建对象的方法--原型模式
javascript创建对象的方法--原型模式 一.总结 1.原型模式解决内存浪费的方法(继承):通过继承,对象继承原型模式下的所有属性,对象不同于其它对象的的属性自己创建或者修改 2.原型的使用(p ...
- javascript创建对象的方法--构造函数模式
javascript创建对象的方法--构造函数模式 一.总结 构造函数模式作用和不足 1.作用:解决工厂模式不是用new关键字来创建对象的弊端 2.作用:解决工厂模式创建的实例和模型没有内在联系的问题 ...
- javascript创建对象的方法--工厂模式(非常好理解)
javascript创建对象的方法--工厂模式(非常好理解) 一.简介 创建对象的方法 本质上都是把"属性"和"方法",封装成一个对象 创建对象的基本模式 普通 ...
- web前端教程之javascript创建对象的方法
今天给大家讲讲javascript基础教程中的javascript面向对象的技术,这一次我们深入的学习一下JavaScrip基于t面向对象之创建对象,关于面向对象的一些术语这里就不给大家介绍了,不了解 ...
- JavaScript创建对象的方法
显示在浏览器中的控制台中. <script type="text/javascript"> //这个工厂方法返回一个新的"范围对象" functio ...
- JavaScript创建对象的方法汇总
JavaScript中的对象 ECMA-262把对象定义为:“无序属性的集合,其属性可以包含基本值.对象或者函数.”严格来讲,这就相当于说对象是一组没有特性顺序的值.对象的每一个属性或方法都有一个名字 ...
随机推荐
- 【故障处理】ORA-12162: TNS:net service name is incorrectly specified (转)
本文将给大家阐述一个因未设置系统环境变量ORACLE_SID导致ORA-12162错误的案例.希望大家有所思考. 1.获得有关ORA-12162报错信息的通用表述信息 [oracle@asdlabdb ...
- Ubuntu 14.04 在桌面上双击运行shell 脚本文件
http://askubuntu.com/questions/465531/how-to-make-a-shell-file-execute-by-double-click up vote7down ...
- 低功耗蓝牙BLE [学习笔记]
手机设备会区分 "connecting" and "pairing" ,前者可以自动连接,后者则需要请求.BLE不再有pairing的麻烦,能直接连上目标设备, ...
- SDP协议中的Continuation State
在SDP request和SDP response中,最后一部分为Continuation State,结构如下: 它用于一次response不够把所有的Data传回去的情况.这时候需要将respon ...
- X-UA-Compatible是神马
X-UA-Compatible是神马 X-UA-Compatible是IE8的一个专有<meta>属性,它告诉IE8采用何种IE版本去渲染网页,在html的<head>标签中使 ...
- C#程序读取数据库中包含null的列的值
private void btn2_Click(object sender, RoutedEventArgs e) { using (SqlConnection ...
- 说说怎么写clean code
前两天参加了公司组织的一个培训,主题是“如何写出好的代码” ,刚看到这个主题,第一反应是又不知道是哪个培训机构来忽悠钱的!老大安排了,就去听听呗. 说实在的,课程内容没有什么新鲜的东西,就是讲讲如何发 ...
- ArcGIS API for Silverlight中加载Google地形图(瓦片图)
原文:ArcGIS API for Silverlight中加载Google地形图(瓦片图) 在做水利.气象.土地等行业中,若能使用到Google的地形图那是再合适不过了,下面就介绍如何在ArcGIS ...
- LightOj 1138 - Trailing Zeroes (III) 阶乘末尾0的个数 & 二分
题目链接:http://lightoj.com/volume_showproblem.php?problem=1138 题意:给你一个数n,然后找个一个最小的数x,使得x!的末尾有n个0:如果没有输出 ...
- Fiddler-006-修改HTTP请求参数
在进行 App 测试时,经常需要修改请求参数,以获得不同的显示效果,以查看相应的页面显示处理.例如:可以通过修改 HTTP请求 的参数,来获取不同的响应结果. 下面以修改 HTTP请求的商品系统编号为 ...