javascript实现继承的三种方式

一、原型链继承 

function Parent(){}
function Child(){}
Child.prototype = new Parent(); 

通过对象child的prototype属性指向父对象parent的实例,使child对象的实例通过原型链访问到父对象构造所定义的属性、方法等。

二、使用apply、call方法

js中call和apply都可以实现继承,唯一的一点参数不同,func.call(func1,var1,var2,var3)对应的apply写法为:func.apply(func1,[var1,var2,var3])。

相同点:第一个参数this都一样,指当前对象。

不同点,第二参数不一样,call是一个个的参数列表,apply是一个数组(arguments也可以)

<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>  

三、对象实例间的继承

原文来自:http://www.jb51.net/article/20431.htm

原文地址:https://www.cnblogs.com/chenguiya/p/9071173.html

时间: 2024-11-09 19:16:48

javascript实现继承的三种方式的相关文章

实现JavaScript中继承的三种方式

一.原型链继承  在原型链继承方面,JavaScript与java.c#等语言类似,仅允许单父类继承.prototype继承的基本方式如下: 代码如下: function Parent(){} function Child(){} Child.prototype = new Parent(); 通过对象Child的prototype属性指向父对象Parent的实例,使Child对象实例能通过原型链访问到父对象构造所定义的属性.方法等.  构造通过原型链链接了父级对象,是否就意味着完成了对象的继承

javascript中构造函数的三种方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script type="text/javascript"> // 创建函数的三种方式: // 1 函数声明 // 2 函数表达式 //

JavaScript定义数组的三种方式(new Array(),new Array(&#39;x&#39;,&#39;y&#39;),[&#39;x&#39;,&#39;y&#39;])

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

JavaScript声明全局变量的三种方式

JavaScript声明全局变量的三种方式 JS中声明全局变量主要分为显式声明或者隐式声明下面分别介绍. 声明方式一: 使用var(关键字)+变量名(标识符)的方式在function外部声明,即为全局变量,否则在function声明的是局部变量.该方式即为显式声明详细如下: var test = 5; //全局变量 function a() { var cc=3; //局部变量 alert(test); } function b(){alert(test);} 声明方式二: 没有使用var,直接

javascript创建函数的三种方式

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content=

javascript函数命名的三种方式及区别

1, function fn(val1,val2) { alert(val1+val2); } fn(1,2); 2, var fn=function() { alert(val1+val2); } fn(1,2); 3, var fn=new Function("alert(val1+val2)"); fn(1,2); 上面三种方式逻辑上是等价的,但是还是有点小区别: 区别一:例一中的函数会在代码执行以前被加载到作用域中,而例二则是在代码执行到那一行的时候才会有定义: 区别二:函数声

javascript实现继承的几种方式

原型链方式实现继承 [javascript] view plain copy print? function SuperType(){ this.property = true; this.colors = ['red','blue','green']; } SuperType.prototype.getSuperValue = function(){ return this.property; }; function SubType(){ this.subprototype = false;

javaScript定义函数的三种方式&amp;amp;变量的作用域

一.函数定义 方式1.普通方式定义函数 function 函数名(參数n){ 函数体 } function add(a,b){ return a+b; } 方式2.直接量定义函数 var 函数名=function(參数n){ 函数体 } var add=function(a,b){ return a+b; } 方式三.构造方式定义函数 var 函数名=new Function(參数n,函数体); var add = new Function('a,b','return a+b;'); 二.变量的

javaScript定义函数的三种方式&amp;变量的作用域

一.函数定义 方式1.普通方式定义函数 function 函数名(参数n){ 函数体 } function add(a,b){ return a+b; } 方式2.直接量定义函数 var 函数名=function(参数n){ 函数体 } var add=function(a,b){ return a+b; } 方式三.构造方式定义函数 var 函数名=new Function(参数n,函数体); var add = new Function('a,b','return a+b;'); 二.变量的