直播app开发搭建,web前端JS中的继承方式

直播app开发搭建,web前端JS中的继承方式

ES5

//ES5中的写法一
 
    function Phone(color){
        this.color = color;
        this.show = function(){
            console.log("你喜欢看的颜色是:"+this.color);
        }
    }
    function Vivo(color){
        Phone.call(this,color);
    }
    var vivo = new Vivo("黄色");
    vivo.show();
 
//这里主要利用了call()方法改变this指向
    写法二,原型链继承
 
    function Person(name,age){
        this.name = name;
        this.age = age;
        this.eat = function(){
            console.log(name + "很能吃");
        }
    }
 
    function Player(type){
        this.type = type;
    }
    Player.prototype = new Person("简自豪");
    var player = new Player();
    player.eat();
 
    //写法三,拷贝继承
    function MingXing(name){
        this.name = name;
        this.sing = function(){
            console.log(this.name + "会唱歌");
        }
    }
    var jack = {
        extend:function(obj){
            for(var val in obj){
                this[val] = obj[val];
            }
        }
    };
    jack.extend(new MingXing("陈明"));
    jack.sing();
 
    //写法四,组合继承
    function Car(color){
        this.color = color;
    }
 
    function Passat(color,type){
        Car.call(this,color);
        this.type = type;
    }
    Passat.prototype = new Car();
    Passat.prototype.run = function(){
        console.log(this.color+this.type+"会跑");
    }
    var passat = new Passat("黑色","帕撒特");
    passat.run();

​ES6

class Fu{
        constructor(x,y){
            this.x = x;
            this.y = y;
        }
        show(){
            console.log("x = "+this.x+",y = "+this.y);
        }
    }
    class Zi extends Fu{
        constructor(x,y){
            super(x,y);
        }
    }
    const zi = new Zi(1,2);
    zi.show();

 

以上就是直播app开发搭建,web前端JS中的继承方式, 更多内容欢迎关注之后的文章

 

posted @ 2023-06-07 14:07  云豹科技-苏凌霄  阅读(5)  评论(0编辑  收藏  举报