分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 网页技术

Web前端面试(五):面向对象

发布时间:2023-09-06 01:11责任编辑:傅花花关键词:Web前端面向对象

类与实例

类与继承:如何实现继承,继承的几种方式

     第一种:借助构造函数实现继承     

function Parent1(){  this.name = ‘parent1’;}function child1(){   Parent1.call(this); //这句话是执行父级的构造函数,也可以用apply,改变函数运行的上下文  this.type = ‘child1’;}new Child1();

        缺点:Parent1的prototype上面的属性或者方法是不能被Chlid1继承的,只实现了部分继承。

        第二种:借助原型链实现继承

function Parent2() {  this.name = ‘parent2’;}function Child2() {  this.type = ‘child2’;}Child2.prototype = new Parent2();new Chlid2();

           缺点(问题):父类中增加新的属性,那么所有的实例都会同时改变。如果某个实例的属性值(来自父类的)发生了变化,那么其他实例也都跟着发生了变化。因为所有实例的__proto__是同一个,所以相互之间会有影响。

      第三种:组合方式      

function Parent3() {  this.name = ‘parent3’;   This.play = [1,2,3,4];}function Child3(){  Parent3.call(this);  this.type = ‘child3’;}Child3.prototype = new Parent3();var s3 = new Child3();var s4 = new Child3();

         缺点:父级的构造函数执行了两次,但是却并没有必要。

        第四种:组合继承的优化方式1

      

function Parent4() {  this.name = ‘parent4’;   This.play = [1,2,3,4];}function Child4(){  Parent4.call(this);  this.type = ‘child4’;}Child4.prototype = Parent4.prototype;var s5 = new Child4();var s6 = new Child4();s5 instanceof Child4  ======>>>trues5 instanceof Parent4 ======>>>true

          问题:怎么区分一个对象是由子类实例化的,还是父类实例化的(直接实例化)

       constructor方法在这里会出问题,因为s5.constructor指向Parent4.(其实前面的方法也有这个问题)

       第五种:组合继承的优化方式2

function Parent5() {  this.name = ‘parent5’;   This.play = [1,2,3,4];}function Child5(){  Parent5.call(this);  this.type = ‘child5’;}Child5.prototype = Object.create(Parent5.prototype);Child5.prototype.constructor = Child5;var s7 = new Child5();var s8 = new Child5();

        

     

    

    

Web前端面试(五):面向对象

原文地址:http://www.cnblogs.com/yjb18335717584/p/7533207.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved