您的位置:首页 > Web前端 > JavaScript

JavaScript学习(一)将实例状态存储在实例对象中,方法存储在原型中

2017-09-23 11:15 190 查看
最近受到一位前辈的启发,萌生了写技术博客的想法。一来巩固自己的知识,查漏补缺,不断提高;二来一家之见总是片面,博采众长,接受批评才能更好的进步。下面是最近在完成一个框架的扩展时所接触到的一些知识中的一点的总结,也从一些经典的书籍、网友的博客中汲取了很多的灵感,辅以自己的理解,分享出来,如果有幸能让大家有所收获,那就再好不过;如果出现错误,还请大家指正。

我们在使用js进行类式编程的时候,常常会需要给new出来的实例添加属于当前实例的独有的属性,在不理解原型与实例关系的情况下,我们可能会写成如下这样:

//定义一个Person构造函数,我们可以把它理解为类
function Person(name){
this.name=name;
}
//为Person的原型增加方法和属性
Person.prototype={
age:[],
setAge:function(age){
this.age.push(age);
}
}
//实例化xm对象,并赋值输出
var xm=new Person("小明");
xm.setAge(19);
console.log(xm.name+":"+xm.age);//小明:19
//实例化xh对象,并赋值输出,发现已经改变
var xh=new Person("小华");
xh.setAge(16);
console.log(xh.name+":"+xh.age);//小华:19,16


很明显,这样为实例添加属性是不恰当的。因为我们在对不同的实例进行setAge操作时影响到了其他的实例,这样实例的属性会失去独立性,也失去了意义。

出现这样的情况原因是Person的prototype对象是所有实例共享的,任何实例对其中的属性 进行操作都会影响到其他的实例。所以若要添加只属于某个实例的自己的属性,我们应当将这样的属性存储到实例对象自身当中,如下:

//定义一个Person构造函数,我们可以把它理解为类
function Person(name){
this.name=name;
this.age=[];
}
//为Person的原型增加方法和属性
Person.prototype={s
setAge:function(age){
this.age.push(age);
}
}
//实例化xm对象,并赋值输出
var xm=new Person("小明");
xm.setAge(19);
console.log(xm.name+":"+xm.age);//小明:19
//实例化xh对象,并赋值输出
var xh=new Person("小华");
xh.setAge(16);
console.log(xh.name+":"+xh.age);//小华:16


这样,实例的属性就成为了相互独立的,任何实例操作自身的属性都不会影响到其他实例的属性。

通常来说,实例独有的属性我们会存储到实例对象自身当中。一些永远不需要改变的属性或者本身就需要改变的属性会存储到原型对象当中。

通常来说,方法是没有状态的,并且各个实例对象之间也可以共享,因此方法一般会被放在原型对象之中。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript
相关文章推荐