Javascript—类和继承
2016-07-18 18:51
375 查看
1、在Javascript中实现类,使用最广泛、认同度最高的是 构造函数+原型
构造函数:定义实例属性
原型:定义方法和共享的属性
function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.friends = ["Lucy","Lily"];
}
Person.prototype = {
constructor:Person,
sayName:function(){
alert(this.name);
}
};
var p1= new Person("Amanda",23,"worker");
p1.friends.push("Zipper");
alert(p1.friends);
p1.sayName();
var p2= new Person("Banner",31,"worker");
alert(p2.friends);
p2.sayName();
2、Javascript中实现继承,方式一:组合继承-----分别继承 属性和方法
function SuperType(name){
this.name = name;
this.colors = ["red","blue"];
}
SuperType.prototype = {
sayName: function(){
alert(this.name);
}
};
//继承属性
function SubType(name,age){
SuperType.call(this,name);
this.age = age;
}
//继承方法
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function(){
alert(this.age);
}
var sub = new SubType("Amanda",24);
sub.sayName();
sub.sayAge();
alert(sub.colors);
缺点是:无论什么情况下,子类都调用了两次父类的构造函数,一次是在创建子类原型的时候,一次是在子类型构造函数内部。优化方法:寄生组合式继承。
PS:现在还没看懂 寄生组合式继承。。。。
构造函数:定义实例属性
原型:定义方法和共享的属性
function Person(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.friends = ["Lucy","Lily"];
}
Person.prototype = {
constructor:Person,
sayName:function(){
alert(this.name);
}
};
var p1= new Person("Amanda",23,"worker");
p1.friends.push("Zipper");
alert(p1.friends);
p1.sayName();
var p2= new Person("Banner",31,"worker");
alert(p2.friends);
p2.sayName();
2、Javascript中实现继承,方式一:组合继承-----分别继承 属性和方法
function SuperType(name){
this.name = name;
this.colors = ["red","blue"];
}
SuperType.prototype = {
sayName: function(){
alert(this.name);
}
};
//继承属性
function SubType(name,age){
SuperType.call(this,name);
this.age = age;
}
//继承方法
SubType.prototype = new SuperType();
SubType.prototype.sayAge = function(){
alert(this.age);
}
var sub = new SubType("Amanda",24);
sub.sayName();
sub.sayAge();
alert(sub.colors);
缺点是:无论什么情况下,子类都调用了两次父类的构造函数,一次是在创建子类原型的时候,一次是在子类型构造函数内部。优化方法:寄生组合式继承。
PS:现在还没看懂 寄生组合式继承。。。。
相关文章推荐
- Jsp
- jsp页面写jstl标签和el表达式
- 分页控件代码逻辑(JS版本&PHP版本)
- JS日期与字符串互转
- .net mvc web api 返回 json 内容,过滤值为null的属性
- JavaScript 中的DOM1
- js文件上传
- 好的json解析
- myeclipse2014的js代码颜色问题
- javascript面试题:如何把一句英文每个单词首字母大写?
- js修改window对象中的url历史记录
- cojs DAG计数问题1-4 题解报告
- 在.NET使用Newtonsoft.Json转换,读取,写入json
- js图片轮播,可控制中间位置选中状态和左右箭头控制
- Js 数组增删改查详解
- 面向对象的JS
- JavaScript之字符串引号的使用技巧
- JSONCPP库移植
- CommonJS规范
- javascript求数组最大值