javascript 定义对象的方式,有6 种:
1.1在已有对象上添加属性
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>New Web Project</title> </head> <script type="text/javascript"> //同过已有对象,扩充属性 var object =new Object(); object.name="zhangsan"; object.sayName=function(name){ this.name=name; alert(this.name); } object.sayName("lisi"); </script> </html>
1.2 工厂方式创建对象
<script type="text/javascript"> //工厂方式 创建对象 function createObject(){ var object = new Object(); object.username = "hw"; object.password = "810068"; object.get = function(){ alert(this.username + " , " + this.password); } return object; } var object1 = createObject(); var object2 = createObject(); object1.get(); </script>
<script type="text/javascript"> //工厂方式 创建对象 function createObject(name){ var object = new Object(); object.username = name; object.password = "81"; object.get = function(){ alert(this.username + " , " + this.password); } return object; } var object1 = createObject("黄威"); var object2 = createObject("付攀"); object1.get(); </script>
如何让一个函数对象被多个对象所共享,而不是每一个对象拥有一个函数对象?
方法:把函数放在外面。请看下面的代码:
<script type="text/javascript"> //使用工厂方法,创建对象 /* 让一个函数对象被多个对象所共享,而不是每一个对象拥有一个函数对象 :把方法放在外面*/ function get(){ alert(this.username + " , " + this.password); } function createObject(name, password){ var object = new Object(); object.username = name; object.password = password; object.get = get; return object; } var object1 = createObject("黄威", "456"); var object2 = createObject("付攀", "123"); object1.get(); </script>
1.3 构造函数方式(使用构造方法)
<script type="text/javascript"> function Person(){ //在执行第一行代码前,js引擎会为我们生成一个对象 this.username="hw"; this.password="root"; this.getInfo=function(){ alert(this.username + " , " + this.password); } //此处有一个隐藏的return 语句,用于将之前生成的对象返回。 } var person=new Person(); person.getInfo(); </script>
<script type="text/javascript"> function Person(name, password){ //在执行第一行代码前,js引擎会为我们生成一个对象 this.username = name; this.password = password; this.getInfo = function(){ alert(this.username + " , " + this.password); } //此处有一个隐藏的return 语句,用于将之前生成的对象返回。 } var person = new Person("wei","444"); person.getInfo(); </script>
1.4 原型(prototype)方式
<script type="text/javascript"> function Person(){ } Person.prototype.username = "zhangsan"; Person.prototype.password = "123"; Person.prototype.getInfo = function(){ alert(this.username + " , " + this.password); } var person1 = new Person(); var person2 = new Person(); person1.username = "黄"; person1.getInfo(); person2.getInfo(); </script>
单纯使用原型方式定义的对象无法在构造函数中为属性赋初值,只能在对象生成之后再去改变属性值。
此方式的缺陷:多个对象之间共享属性。
1.5 原型+构造函数方式
<script type="text/javascript"> function Person(){ this.username=new Array(); this.password="123"; } Person.prototype.getInfo=function(){ alert(this.username+" , "+this.password); } var p=new Person(); var p2=new Person(); p.username.push("黄威"); p2.username.push("素洁"); p.getInfo(); p2.getInfo(); </script>
1.6 动态原型方式
<script type="text/javascript">
//C:\Documents and Settings\Administrator\My Documents\Aptana Studio Workspace\js00001\javascript002.html
/* 通过动态原型的方式*/
function Person(){
this.username = new Array();
this.password = "123";
if (typeof Person.flag == "undefined") {
alert("invoked");
Person.prototype.getInfo = function(){
alert(this.username + " , " + this.password);
}
Person.flag=true;
}
}
var p = new Person();
var p2 = new Person();
p.username.push("黄威");
p2.username.push("Jack");
p.getInfo();
p2.getInfo();
</script>
以上就是js定义对象的6种方式。
参考:http://blog.csdn.net/hw1287789687/article/details/51636844