javascript 构造函数方式定义对象(2)


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var get=function(){
    alert(this.username+" , "+this.password);
}
function Person(username,password){
    //在执行第一行代码前,js引擎会为我们生成一个对象
    this.username=username;
    this.password=password;
    this.get=get;
    //在此处,有一个隐藏的return语句,用于返回之前生成的对象[这点是和工厂模式不一样的地方]
}
var person=new Person("zhangsan","123");
person.get();
</script>
</head>        
<body>
</body>
</html>

第四种方式: 原型(Prototype)方式创建对象

prototype是object对象中的属性,所有person对象也可以拥有prototype这个属性。

可以给对象的原型增加一些属性,方法。

单纯的使用原型方式创建对象的缺点:①无法传参数,只能在对象创建后再改变它的值

②可能会导致程序错误

复制代码 代码如下:


<!DOCTYPE html>
<html>
<head>
<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="lisi";
person1.getInfo();
person2.getInfo();
</script>
</head>        
<body>
</body>
</html>

复制代码 代码如下:


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function Person(){
}
Person.prototype.username=new Array();
Person.prototype.password="123";
Person.prototype.getInfo=function(){
    alert(this.username+" , "+this.password);
}
var person1=new Person();
var person2=new Person();
person1.username.push("wanglaowu");
person1.username.push("wanglaowu2");
person2.password="456";
person1.getInfo    ();
person2.getInfo();
</script>
</head>        
<body>
</body>
</html>

单纯使用原型方式定义对象无法再构造函数中为属性赋初值,只能在对象生成后再去改变属性值。

第五种方式: 使用原型+构造函数方式来定义对象----推荐使用

对象之间的属性互不干扰
各个对象之间共享同一个方法

复制代码 代码如下:


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
//使用原型+构造函数方式来定义对象
function Person(){
    //属性 定义在构造函数中
    this.username=new Array();
    this.password="123";
}
    //方法 定义在原型中
Person.prototype.getInfo=function(){
    alert(this.username+" , "+this.password);
}
var p1=new Person();
var p2=new Person();
p1.username.push("zhangsan");
p2.username.push("lisi");
p1.getInfo();
p2.getInfo();
</script>
</head>        
<body>
</body>
</html>

第六种方式: 动态原型方式----推荐使用

在构造函数中通过标志量让所有对象共享一个方法,而每个对象拥有自己的属性。

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgxdzz.html