美文网首页
JS高级-继承

JS高级-继承

作者: 哎呦呦胖子斌 | 来源:发表于2018-11-07 08:18 被阅读0次

            面向对象编程思想:根据需求,分析对象,找到对象有什么特征和行为,通过代码的方式来实现需求,要想实现这个需求,就要创建对象,要想创建对象,就应该显示有构造函数,然后通过构造函数创建对象,通过对象调用属性和方法来实现相应的功能及需求。
            首先JS不是一门面向对象的语言,JS是一门基于对象的语言,面向对象的变成语言中有类(class)的概念,但是JS不是面向对象的语言,所以JS中没有类(class),但是js可以模拟面向对象的思想编程,js中会通过构造函数来模拟类的概念。

    面向对象的特征:封装,继承,多态

    封装:
    一个值存储在一个变量中
    一坨重复代码放在一个函数中
    一系列的属性放在一个对象中
    一些功能类似的函数(方法)放在一个对象中
    很多相类似的对象放在一个js文件中

    继承:
    首先继承是一种关系,类与类之间的关系,js中没有类但是可以通过构造函数模拟类,然后通过原型来实现继承,继承也是为了实现数据共享,js中的集成也是为了实现数据共享。

    原型作用:数据共享,节省内存空间;实现继承

    多态:一个对象有不同的行为,或者是同一个行为针对不同的对象,产生不同的结果,要想有多态,就要先有继承,js中可以模拟多态,但是不会去使用,也不会模拟。

    原型实现继承

    缺陷:在改变原型的指向时,会给原型的属性赋值相同的值

    借用构造函数继承

    构造函数名字.call(当前对象,属性,属性…)

    解决了属性继承,并且值不重复的问题

    缺陷:父级类别中的方法不能继承

            function Animal(age,name){
                this.age = age;
                this.name = name;
            }
            Animal.prototype.eat = function(){
                console.log('动物吃东西');
            }
            function Dog (age,name,sex){
                this.sex = sex;
                Animal.call(this,age,name);
            }
            var dog = new Dog(11,'开心','男');
            console.dir(dog);
            // dog.eat();    //会报错
    
    组合继承

    在借用构造函数的同时,改变原型指向,这个时候父类中的方法就可以使用了,并且还可以在子类中添加自己的方法和属性。

            function Animal(age,name){
                this.age = age;
                this.name = name;
            }
            Animal.prototype.eat = function(){
                console.log('动物吃东西');
            }
            function Dog (age,name,sex){
                this.sex = sex;
                Animal.call(this,age,name);
            }
            Dog.prototype = new Animal();
            var dog = new Dog(11,'开心','男');
            console.dir(dog);
            dog.eat(); 
    
    拷贝继承

    将一个原型对象的每个属性(包括方法)赋值给一个空对象

    var obj = {}

    for(var key in Person.prototype){

    obj[key] = Person.prototype[key];

    }

    这是一种浅拷贝

    相关文章

      网友评论

          本文标题:JS高级-继承

          本文链接:https://www.haomeiwen.com/subject/nvwuxqtx.html