首頁 > web前端 > js教程 > 主體

javascript中如何使用call和apply實作繼承用法詳解

伊谢尔伦
發布: 2017-07-20 15:02:30
原創
1838 人瀏覽過

js中call和apply都可以實現繼承,唯一的一點參數不同,func.call(func1,var1,var2,var3)對應的apply寫法為:func.apply(func1,[var1,var2 ,var3])。

JS手冊中對call的解釋:

call 方法 
呼叫一個物件的一個方法,以另一個物件替換當前物件。 

call([thisObj[,arg1[, arg2[,   [,.argN]]]]])
登入後複製

參數 
thisObj 
可選項。將被用作當前對象的對象。  

arg1, arg2,  , argN 
可選項。將會被傳遞方法參數序列。  

說明 
call 方法可以用來取代另一個物件呼叫一個方法。 call 方法可將一個函數的物件上下文從初始的上下文變更為由 thisObj 指定的新物件。  

如果沒有提供 thisObj 參數,那麼 Global 物件被用作 thisObj。  

說簡單一點,這兩個函數的作用其實就是更改物件的內部指針,也就是改變物件的this指向的內容。這在物件導向的js程式設計過程中有時是很有用的。以下以apply為例,說說這兩個函數在 js中的重要角色。如:

<SPAN style="FONT-SIZE: 18px"> function Person(name,age){   //定义一个类   
        this.name=name;     //名字   
        this.age=age;       //年龄   
        this.sayhello=function(){alert(this.name)};  
    }  
    function Print(){            //显示类的属性   
        this.funcName="Print";  
        this.show=function(){  
            var msg=[];  
            for(var key in this){  
                if(typeof(this[key])!="function"){  
                    msg.push([key,":",this[key]].join(""));  
                }  
            }  
            alert(msg.join(" "));  
        };  
    }  
    function Student(name,age,grade,school){    //学生类   
        Person.apply(this,arguments);//比call优越的地方   
        Print.apply(this,arguments);  
        this.grade=grade;                //年级   
        this.school=school;                 //学校   
    }  
    var p1=new Person("开化",80);  
    p1.sayhello();  
    var s1=new Student("云飞",40,9,"岳麓书院");  
    s1.show();  
    s1.sayhello();  
    alert(s1.funcName);</SPAN>
登入後複製

另外,Function.apply()在提升程式效能上有突出的作用:
我們先從Math.max()函數說起,Math.max後面可以接任意個參數,最後傳回所有參數中的最大值。
例如

<SPAN style="FONT-SIZE: 18px">alert(Math.max(5,8));   //8   
    alert(Math.max(5,7,9,3,1,6));   //9   
    //但是在很多情况下,我们需要找出数组中最大的元素。   
    var arr=[5,7,9,1];  
    //alert(Math.max(arr));    // 这样却是不行的。NaN   
    //要这样写   
    function getMax(arr){  
        var arrLen=arr.length;  
        for(var i=0,ret=arr[0];i<arrLen;i++){  
            ret=Math.max(ret,arr[i]);  
        }  
        return ret;  
    }  
    alert(getMax(arr)); //9   
    //换用apply,可以这样写   
    function getMax2(arr){  
        return Math.max.apply(null,arr);  
    }  
    alert(getMax2(arr)); //9   
    //两段代码达到了同样的目的,但是getMax2却优雅,高效,简洁得多。   
    //再比如数组的push方法。   
    var arr1=[1,3,4];  
    var arr2=[3,4,5];  
    //如果我们要把 arr2展开,然后一个一个追加到arr1中去,最后让arr1=[1,3,4,3,4,5]   
    //arr1.push(arr2)显然是不行的。 因为这样做会得到[1,3,4,[3,4,5]]   
    //我们只能用一个循环去一个一个的push(当然也可以用arr1.concat(arr2),但是concat方法并不改变arr1本身)   
    var arrLen=arr2.length;  
    for(var i=0;i<arrLen;i++){  
        arr1.push(arr2[i]);  
    }  
    //自从有了Apply,事情就变得如此简单   
    Array.prototype.push.apply(arr1,arr2); //现在arr1就是想要的结果</SPAN>
登入後複製


以上是javascript中如何使用call和apply實作繼承用法詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板