面向对象和继承

js高级

1.面向对象

(1)面向过程和面向对象的区别

面向过程就是分析出解决问题需要的步骤,然后用函数按照步骤一步步实现,使用时在分别调用.
举个例子 按面向过程的方法解决把大象放进冰箱需要几部:第一步:打开冰箱 ;第二步:让大象进去;第三步:关上冰箱门.
面向对象就是把事务分解为一个个对象,然后对各个对象进行分析,由各个对象之间协作
举个例子 按面向对象方式分析大象冰箱问题.有两个对象:冰箱 和 大象.大象对象: 进去;冰箱对象:打开,关闭.

(2)两种方式的应用场景

面向对象的性能比面向对象强,适合跟硬件联系很亲密的东西,例如单片机就采用面向过程编程.但它没有面向对象易维护,易复用,易扩展.
面向对象有封装/继承/多态性,可以设计出高内聚低耦合的系统,是系统更灵活,更易于维护.缺点就是性能比面向过程低.

(3)小结

面向过程就像是一份蛋炒饭需要蛋和饭同时进行翻炒,而面向对象就像是一份盖浇饭,客人来了要什么菜,在现成的米饭上浇什么汤汁.

2.类的继承

类的继承的关键字是extends.
super 用于访问和调用父类的构造函数,也可用于调用父类的普通函数.

class Father {
	constructor(uname) {
		this.uname = uname;
	}
}
class Son extends  Father {
	constructor(uname,age) {
		super(uname);
		this.age= age;
	}
}
// 子类在构造函数中使用super时,必须要把super写在this 前面
// (必须先调用父类的构造函数,在使用子类构造方法)

3.对象原型和原型对象

(1)构造函数的原型对象:prototype

Javascript规定,* 每一个构造函数都有一个prototype属性*,指向另一个对象.这个prototype就是一个对象,这个对象的所有的属性和方法,都会被构造函数所拥有.所以我们可以直接把那些不变的方法,直接定义在proptotype对象上,这样对象的所有实例都可以共享这些方法.,

(2)实例的对象原型:proto

每个对象实例都会有一个__proto__属性指向构造函数的prototype对象的属性和方法,这就是为什么实例对象可以调用构造函数.__proto__和prototype是等价的.__proto__对象原型的意义就在于对象的查找机制提供一个方向,或者说一个属性,但由于它是非标准属性,因此实际开发中不可以使用这个属性,他只是内部指向原型对象prototype.

(3)constructor 构造函数

对象原型和原型对象都有一个属性constructor,被称为构造函数,因为它指回构造函数本身.它主要记录该对象引用了哪个构造函数,他可以让对象原型重新指向原来的构造函数.
一般情况下,对象的方法都在构造原型中设置.如果有多个对象的方法,我们可以给原型对象采取对象形式赋值,但是这样就会覆盖构造函数原型对象原来的内容,这样修改后的原型对象constructor就不在指向当前构造函数啦.此时,我们可以在修改后的原型对象中,添加一个constructor指向原来的构造函数.

(4)三者的关系:在这里插入图片描述
(5)原型链在这里插入图片描述
<script>
        // 借用父构造函数继承属性
        // 1. 父构造函数
        function Father(uname, age) {
            // this 指向父构造函数的对象实例
            this.uname = uname;
            this.age = age;
        }
        Father.prototype.money = function() {
            console.log(100000);

        };
        // 2 .子构造函数 
        function Son(uname, age, score) {
            // this 指向子构造函数的对象实例
            Father.call(this, uname, age);
            this.score = score;
        }
        // Son.prototype = Father.prototype;  这样直接赋值会有问题,如果修改了子原型对象,父原型对象也会跟着一起变化
        Son.prototype = new Father();
        // 如果利用对象的形式修改了原型对象,别忘了利用constructor 指回原来的构造函数
        Son.prototype.constructor = Son;
        // 这个是子构造函数专门的方法
        Son.prototype.exam = function() {
            console.log('孩子要考试');

        }
        var son = new Son('刘德华', 18, 100);
        console.log(son);
        console.log(Father.prototype);
        console.log(Son.prototype.constructor);
    </script>

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值