Heim > Artikel > Web-Frontend > Detaillierte Erläuterung von Codebeispielen für drei Methoden der Objektvererbung in JavaScript

Detaillierte Erläuterung von Codebeispielen für drei Methoden der Objektvererbung in JavaScript

伊谢尔伦Original: 2017-07-20 14:56:421020Durchsuche

Es gibt drei Vererbungsmethoden in js

1.js Prototyp (Prototyp) implementiert die Vererbung

<SPAN style="BACKGROUND-COLOR: #ffffff"><SPAN style="FONT-SIZE: 18px"><html>  
<body>  
<script type="text/javascript">  
    function Person(name,age){  
        this.name=name;  
        this.age=age;  
    }  
    Person.prototype.sayHello=function(){  
        alert("使用原型得到Name："+this.name);  
    }  
    var per=new Person("小倩",21);  
    per.sayHello(); //输出：使用原型得到Name:小倩  
      
    function Student(){}  
    Student.prototype=new Person("如彤",21);  
    var stu=new Student();  
    Student.prototype.grade=5;  
    Student.prototype.intr=function(){  
        alert(this.grade);  
    }  
    stu.sayHello();//输出：使用原型得到Name:如彤  
    stu.intr();//输出：5  
</script>  
</body>  
</html></SPAN></SPAN>

2 Erben

<SPAN style="FONT-SIZE: 18px"><html>  
<body>  
<script type="text/javascript">  
    function  Parent(name){  
        this.name=name;  
        this.sayParent=function(){  
            alert("Parent:"+this.name);  
        }  
    }  
    function  Child(name,age){  
        this.tempMethod=Parent;  
        this.tempMethod(name);  
        this.age=age;  
        this.sayChild=function(){  
            alert("Child:"+this.name+"age:"+this.age);  
        }  
    }  
    var parent=new Parent("江剑");  
    parent.sayParent(); //输出：“Parent:江剑”  
    var child=new Child("李鸣",24); //输出：“Child:李鸣 age:24”  
    child.sayChild();  
</script>  
</body>  
</html></SPAN>

3.Aufruf, anwenden, um die Vererbung zu implementieren

<SPAN style="FONT-SIZE: 18px"><html>  
<body>  
<script type="text/javascript">  
    function  Person(name,age,love){  
        this.name=name;  
        this.age=age;  
        this.love=love;  
        this.say=function say(){  
            alert("姓名："+name);  
        }  
    }  
    //call方式  
    function student(name,age){  
        Person.call(this,name,age);  
    }  
    //apply方式  
    function teacher(name,love){  
        Person.apply(this,[name,love]);  
        //Person.apply(this,arguments); //跟上句一样的效果，arguments  
    }  
    //call与aplly的异同：  
    //1,第一个参数this都一样,指当前对象  
    //2,第二个参数不一样：call的是一个个的参数列表；apply的是一个数组（arguments也可以）  
    var per=new Person("凤楼",25,"荧屏"); //输出：“凤楼”  
    per.say();  
    var stu=new student("曹玉",18);//输出：“曹玉”  
    stu.say();  
    var tea=new teacher("秦杰",16);//输出：“秦杰”  
    tea.say();  
</script>  
</body>  
</html></SPAN>

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung von Codebeispielen für drei Methoden der Objektvererbung in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Ausführliche Erläuterung von Anwendungsbeispielen zweier nicht geerbter Methoden in JavaScriptNächster Artikel：Ausführliche Erläuterung von Anwendungsbeispielen zweier nicht geerbter Methoden in JavaScript

In Verbindung stehende Artikel

Mehr sehen