继承
<script>
function Person(name,age){
this.name = name;
this.age = age; }
let p1 = new Person('zhangsan',30);
function Student(){ }
/* instanceof 来判断这个实例(p1)是不是这个构造函数(Person)实例化出来的对象*/
/* console.log(p1 instanceof Person); */ /* =>true */
// console.log(p1 instanceof Student); /* =>false */
/* 万物皆对象 */
// console.log(p1);
// console.log(p1 instanceof Object)
</script>
原型链实例化对象
<script>
/* 构造函数可以理解为一个类 */
// function Person(){
// this.head = 1;
// this.foot = 2;
// }
// function Student(name,no){
// this.name = name;
// this.no = no;
// }
// /* 让学生类 继承 人类的两个脚和一个头的属性 */
// /* Student的prototype指向一个Person的实例 */
// Student.prototype = new Person();
// /* 加上constructor属性,并将这个属性指回原来的构造函数 */
// Student.prototype.constructor = Student;
// let stu1 = new Student();
// console.log(stu1);
// console.log(stu1.head);
// console.log(stu1.foot);
</script>
/* 写一个类 Car color price 属性 */
/* 类 Bmw 继承Car的所有属性 并实例化Bmw这个类
写个方法可以把 color 和 price 打印到页面上 */
function Car(){
this.color = '白色'
this.price = '100w'
}
function Bmw(){}
Bmw.prototype = new Car();
Bmw.prototype.constructor = Bmw;
let b1 = new Bmw();
console.log(b1.color);
console.log(b1.price);
console.log(b1);
原型链直接继承
<script>
// function Person(){
// }
// Person.prototype.head = 1;
// Person.prototype.foot = 2;
// let p1 = new Person();
// /* 不变的属性都可以直接写入Person.prototype */
// function Student(){
// }
// /* Student想要继承Person的属性 */
// /* 直接继承prototype */
// Student.prototype = Person.prototype;
// let stu1 = new Student();
// console.log(stu1.head);
// console.log(stu1.foot);
// // console.log('stu1',stu1);
// /* 缺点: */
// /* 任何对Student.prototype的修改,都会反映到Person.prototype */
/* Student的constructor不会指向自己 */
// Student.prototype.name = 'zhangsan'
// console.log('p1',p1);
</script>
写一个类 Car color price 属性 使用直接继承prototype的方式实现
类 Bmw 继承Car的所有属性 并实例化Bmw这个类
写个方法可以把 color 和 price 打印到页面上
function Car(){
}
Car.prototype.color = '白色'
Car.prototype.price = '100w'
function Bmw(){
this.print = function (){
document.write(`${this.color}--${this.price}`);
}
}
Bmw.prototype = Car.prototype;
let b1 = new Bmw();
b1.print();
利用空对象作为中介
<script>
/**
* @param 子类
* @param 父类
* */
function extend(child, parent) {
function f() { }
f.prototype = parent.prototype;
child.prototype = new f();
child.prototype.constructor = child;
}
// Object.prototype.foot = 2;
/*
空对象,几乎不占内存
修改Student的prototype对象,不会影响到Person的prototype对象
*/
/* 父类 */
function Person() { }
Person.prototype.head = 1;
Person.prototype.foot = 2;
/* 子类想继承父类的属性 */
function Student() { }
/* 新建一个空对象 */
// function f(){}
// /* 把父类的原型直接赋值给空对象的原型上 */
// f.prototype = Person.prototype;
// /* 把空对象的实例化对象 给到子类的原型上 */
// Student.prototype = new f();
// /* ★constructor构造器都是指向自己的 */
// Student.prototype.constructor = Student;
extend(Student, Person)
let stu1 = new Student();
console.log(stu1.foot);
console.log(stu1);
/* 不会影响到Person的prototype对象 */
// Student.prototype.age = 30;
// let p = new Person();
// console.log(p);
/* 原型链就是一层一层向上找的过程 */
/* 原型链继承就是利用了上面这种特性 */
/* 写一个类 Car color price 属性 */
/* 类 Bmw 继承Car的所有属性 并实例化Bmw这个类
写个方法可以把 color 和 price 打印到页面上 */
function Car() { }
Car.prototype.color = '白色'
Car.prototype.price = '100w'
// function f(){}
// f.prototype = Car.prototype;
// Bmw.prototype = new f();
// Bmw.prototype.constructor = Bmw;
extend(Bmw, Car)
function Bmw() {
this.print = function () {
document.write(`${this.color}--${this.price}`);
}
}
let b1 = new Bmw();
b1.print();
</script>