JavaScript原型

一、引入:为多个对象统一添加属性

首先看下面一段程序

function Person(perName,perAge){

this.perName = perName;

this.perAge = perAge;

this.toString = function(){

return “PersonName=”+this.perName+” PersonAge=”+this.perAge;

};

}

var per01 = new Person(“Tom”, 20);

var per02 = new Person(“Jerry”, 25);

console.log(per01.toString());

console.log(per02.toString());

 

执行结果:

PersonName=Tom PersonAge=20

PersonName=Jerry PersonAge=25

 

在这段程序中声明了一个构造器函数Person,使用这个构造器函数创建了两个对象,并在控制台中进行了显示。

现在如果我们需要给每个Person对象都添加一个gender属性,最直接的做法可能是这样:

function Person(perName,perAge,gender){

this.perName = perName;

this.perAge = perAge;

this.gender = gender;

this.toString = function(){

return “PersonName=”+this.perName+” PersonAge=”+this.perAge+” PersonGender=”+this.gender;

};

}

var per01 = new Person(“Bob”, 20, “male”);

var per02 = new Person(“Kate”, 25, “female”);

console.log(per01.toString());

console.log(per02.toString());

 

执行结果:

PersonName=Bob PersonAge=20 PersonGender=male

PersonName=Kate PersonAge=25 PersonGender=female

 

可是这样做有一个问题:如果Person这个构造器函数不是我们创建的,我们也不能修改它,还能否添加属性呢?

当然可以,使用JavaScript的原型机制就可以做到。

 

 

本教程由尚硅谷教育大数据研究院出品,如需转载请注明来源,欢迎大家关注尚硅谷公众号(atguigu)了解更多。


上一篇:
下一篇:
关于尚硅谷
教育理念
名师团队
学员心声
资源下载
视频下载
资料下载
工具下载
加入我们
招聘岗位
岗位介绍
招贤纳师
联系我们
电话:010-56253825
邮箱:info@atguigu.com
地址:北京市昌平区宏福科技园综合楼6层(北京校区)

 深圳市宝安区西部硅谷大厦B座C区一层(深圳校区)

上海市松江区谷阳北路166号大江商厦6层(上海校区)