没有合适的资源?快使用搜索试试~ 我知道了~
js 中每个类都有三个部分: 构造函数内的,这是供实例化对象复制用的 构造函数外的,直接通过点语法添加的,这是供类使用的,实例化对象访问不到 类的原型上的,实例化对象可以通过其原型链间接访问到,供所有实例化对象共用 然而,继承中所涉及的不仅仅是一个对象,并且 js 也没有继承这一现有的机制,那它如何实现的呢? 原型 在 JavaScript 中,每个构造函数都拥有一个prototype属性,它指向构造函数的原型对象,这个原型对象中有一个 construtor 属性指回构造函数;每个实例都有一个__proto__属性,当我们使用构造函数去创建实例时,实例的__proto__属性就会指向构造
资源推荐
资源详情
资源评论
java学习之学习之JavaScript继承继承
js 中每个类都有三个部分:
构造函数内的,这是供实例化对象复制用的
构造函数外的,直接通过点语法添加的,这是供类使用的,实例化对象访问不到
类的原型上的,实例化对象可以通过其原型链间接访问到,供所有实例化对象共用
然而,继承中所涉及的不仅仅是一个对象,并且 js 也没有继承这一现有的机制,那它如何实现的呢?
原型原型
在 JavaScript 中,每个构造函数都拥有一个prototype属性,它指向构造函数的原型对象,这个原型对象中有一个 construtor
属性指回构造函数;每个实例都有一个__proto__属性,当我们使用构造函数去创建实例时,实例的__proto__属性就会指向构
造函数的原型对象。
1.类式继承类式继承
// 声明父类
function SuperClass() {
this.superValue = true;
}
// 父类添加共有方法
SuperClass.prototype.getSuperValue = function () {
return this.superValue;
};
// 声明子类
function SubClass() {
this.subValue = false;
}
// 继承父类
SubClass.prototype = new SuperClass();
// 为子类添加共有方法
SubClass.prototype.getSubValue = function () {
return this.subValue;
};
var instance1 = new SubClass();
console.log(instance.getSuperValue()); // true
console.log(instance.getSubValue()); // false
通常说这种继承方式有两个缺点:
由于子类通过其原型 prototype 对父类实例化,继承了父类。所以父类中的共有属性如果是引用类型,就会在子类中被所有实
例共用,因此一个子类的实例在修改从父类构造函数中继承来的共有属性时,就会直接影响到其他的子类。
由于子类实现的继承是通过其原型
prototype
对父类的实例化实现的,因此在创建子类实例的时候,无法向父类构造函数中传
递参数,因而在实例化父类的时候也无法对父类构造函数内的属性进行初始化。
2.构造函数继承构造函数继承
// 声明父类
function SuperClass(id) {
this.books = ["js", "html", "css"];
this.id = id;
}
SuperClass.prototype.showBooks = function () {
console.log(this.books);
};
// 声明子类
function SubClass(id) {
SuperClass.call(this, id);
}
var instance1 = new SubClass(10);
var instance2 = new SubClass(11);
instance1.books.push("设计模式");
console.log(instance1.books); // ['js', 'html', 'css', '设计模式'] console.log(instance1.id); // 10
console.log(instance2.books); // ['js', 'html', 'css'] console.log(instance2.id); // 11
console.log(instance1.showBooks()); // TypeError
SuperClass.call(this, id);是构造函数式继承的精华,由于这种类型的继承没有涉及原型 prototype,所以父类的原型方法不会
被子类继承。而如果想被子类继承就必须要放在构造函数中,这样创建出来的每个实例就会单独拥有一份而不能共用,这样就
违背了代码复用原则。
3.组合继承组合继承
// 声明父类
function SuperClass(name) {
资源评论
weixin_38704284
- 粉丝: 3
- 资源: 987
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功