JavaScript基础(十一)---- 面向对象的继承方法

原创 2017年07月16日 23:36:31

1. 原型链的继承

把父类私有+公有的属性和方法,都给了子类公有的;(让子类.prototype=父类的实例)

例子:

function F(){
        this.x=100;  //父类私有
    }
    F.prototype.showX=function(){};   //父类公有的;

    function S(){
        this.y=200;   //子类私有
    }
    S.prototype=new F;  //核心:把父类私有+公有的属性和方法,都作为子类公有的属性和方法;
    S.prototype.constructor=S;//修改S的constructor指向;
    var s=new S;
    console.dir(s);

2. call继承

把父类私有的属性和方法,给了子类私有的属性和方法;(注意:通过call改变this指向)

例子:

    // call()中第一个参数:用来改变this指向
    //call()中从第二个参数开始,相当于给call点前面的函数,从左往右一个个的传参;

    //注意:call继承只跟父类私有属性和方法有关,跟父类公有的方法没有关系;
    function F(){
        //this指向F的实例;
        this.x=100;//父类私有的
        this.showX=function(){
            alert(this.x);
        }
    }
    var f=new F;
    console.dir(f);
    function S(name){//子类构造函数中,都放的是私有的属性和方法;
        //this-S的实例
        F.call(this);//F中的this-F new出来的实例
        this.y=200;
        this.name=name;
    }
    var s=new S('aaa');
    console.dir(s);

3. 冒充继承

把父类私有+公有的属性和方法,都给了子类私有的;

例子:

function F(){//父类私有的
        this.x=100;
    }
    F.prototype.showX=function(){};
    F.prototype.showY=function(){};
    var f=new F;
    function S(){
        //this-S的实例;
        var f=new F;
        for(var attr in f){
            this[attr]=f[attr];
        }
        this.aa=123;
    }
    var s=new S;
    console.dir(s);

4. 混合继承1: call继承+原型链继承

call继承:在子类的构造函数中继承,一定要改变this指向;(通过call);

    function F(){//私有
        this.x=100;
    }
    F.prototype.showX=function(){};//公有
    var f=new F;
    console.dir(f);

    function S(){//call继承在子类的构造函数中进行继承;
        F.call(this);//call继承
    }
    //原型链继承在子类的prototype上进行继承
    S.prototype=new F;//原型链继承;
    S.prototype.constructor=S;
    S.prototype.aaa='123';
    var s=new S;
    console.dir(s);

5. 混合继承2: call继承+拷贝继承;

拷贝继承:extend(新对象,old对象);

    function extend(obj2,obj1){
        for(var attr in obj1){
            obj2[attr]=obj1[attr];
        }
        return obj2;
    }
    //混合继承2:call继承+拷贝继承
    function F(){
        this.x=100;
    }
    F.prototype.showX=function(){};

    function S(){
        F.call(this);//call继承
    }
    //拷贝继承:克隆一份一模一样的;
    extend(S.prototype, F.prototype);
    var s=new S;
    console.dir(s);

6. 寄生式组合继承:call继承+Object.create()的思想;

function F(){//父类私有的
        this.x=100;
    }
    F.prototype.showX=function(){} //父类公有的;

    //找一个中间类,只把公有的过滤进来;
    function Tmp(){}; //没有私有的属性和方法
    Tmp.prototype=F.prototype; //Tmp只保留了F类公有的方法;

    function S(){
        F.call(this);//call继承:把F私有的属性和方法继承过来了;
    }
    S.prototype = new Tmp;//S.prototype这个原型就相当于tmp的实例;就可以享用Tmp私有+公有的方法;但是我们知道,Tmp没有私有方法;只有公有方法;
    S.prototype.constructor=S;
    var s=new S;
    console.dir(s);

7. 批量操作公有属性,可以用{};

用{}的时候,一定要注意两点:
1. constructor会有问题,我们一定要重写constructor的指向;
2. 系统内置类的公有方法不能批量删除,这是浏览器对系统内置类的自我保护;所以,如果想删除的话,只能一个个的删除;

例子 — 删除公有属性:

Array.prototype.pop={};
Array.prototype.push={};
Array.prototype.shift={};

例子 – 给数组添加一个公有的去重方法

    Array.prototype.rmSame=function(){
        //this--ary数组
        var obj={};//如果对象中没有,给对象添加,如果有了,说明数组中重复了,删除这一项,同时预防数组塌陷;
        for(var i=0; i<this.length; i++){
            var cur=this[i];
            if(obj[cur]===cur){
                this.splice(i,1);
                i--;
            }else{
                obj[cur]=cur;
            }
        }
        return this;//去重后的数组;预告:为了链式操作;
    };
    ary.rmSame();
    ary2.rmSame();
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

JavaScript基础(二) ---- 数组、数组去重

1. 数组方法的作用 pop ----- 删除数组最后一项 push ----- 添加数组最后一项 unshift ---- 添加数组第一项 shift ----- ...

CSS3 --- 选择器

1. 选择器概述: 使用选择器将样式与元素直接绑定,css3还可以利用正则表达式实现各种复杂的制定,减少代码量。 选择器中常用符号: “^” — 开头字符 “?” — 结尾字符 “...

javaScript笔记(十一) 面向对象与原型

面向对象与原型   ECMAScript有两种开发模式:1.函数式(过程化),2.面向对象(OOP)。面向对象的语言有一个标志,那就是类的概念,而通过类可以创建任意多个具有相同属性和方法的对象。但...
  • sliujin
  • sliujin
  • 2016年08月08日 22:05
  • 49

javascript学习十一:面向对象之prototype

javascript面向对象之prototype

JavaScript面向对象继承方法

JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭。很多人都说JavaScript不能算是面向对象的变成语言。但是JavaScript的类型非常松散,也没有编译器。这样一来...

由JavaScript中call()方法引发的对面向对象继承机制call的思考

call   摘要:      通过给定的this和arguments来调用一个function      注意:该方法与apply方法语法相似,但不同的是:call()接受参数列,而apply...

JavaScript的两种面向对象方法--原型继承(prototype)和函数继承(闭包)

常用的两种JS继承和面向对象写法。 一、原型继承 使用prototype向对象绑定方法。 继承时在子类中使用call继承父类的构造方法,并使用new声明继承父类的方法。 var D...
  • as66t
  • as66t
  • 2013年05月06日 15:11
  • 875

黑马程序员_Java基础_面向对象(继承、子父类变量和函数以及构造函数特点、final关键字、抽象类、模版方法模式、接口)

------- android培训、java培训、期待与您交流! ---------- 一、面向对象(继承) 继承: 1.提高了代码的复用性。 2.让类与类之间产生了关系。有了这个关系,才有了多态...

Java基础之面向对象(三)--继承、抽象类、接口、final修饰符、模版方法模式

[java] view plaincopy /*  将学生和工人的共性描述提取出来,单独进行描述,  只要让学生和工人与单独描述的这个类有关系,就可以了。    ...

JAVA面向对象基础:继承、变量隐藏、方法重写、包、修饰符、this、super

本文转载链接地址:http://android.yaohuiji.com/archives/3214 一、继承 1、继承的概念 继承是面向对象的三大特性之一。在语义上继承的意思是照法律或遵照...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JavaScript基础(十一)---- 面向对象的继承方法
举报原因:
原因补充:

(最多只允许输入30个字)