Call && apply 用法

標籤：function   return   

     . 每一個函數都包含兩個非繼承而來的函數: call,apply.  在特定的範圍中調用函數,  實際上相當於   函數體內this對象的值

     .call,apply  用途之一就是傳遞參數.    實際上強大的地方是  :   擴大函數的範圍   

           

eg1:   ( 傳遞參數 )

     

     //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

          function sum(x,y){

               return x+y;

          }

          function call1(n1,n2){

               return sum . call ( this,n1,n2 );          //~~~  return sum.apply(this , [ n1, n2 ] );

          }

          

          alert(call1(10,20));      //alert(30);

     //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

eg2:  (擴充範圍)    好處:  對象和方法 沒有 耦合關係 

  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

     

  window.color =  ‘ red ‘;

  var obj  =  { color : ‘ blue‘};

   function showColor()  {

          alert( this.color );

   }

     

   showColor.call( window );    // showColor.call(this);   // red

   showColor.call( obj );  //blue

 

  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

     //自訂對象

     function Obj ( x , y){

          this.x = x;

          this.y = y;

           return x*y ;

     }

     

     // 方法 

     function  fun( a , b ){

          return a + b;

     }

     var obj = new Obj (10 , 20);

     alert( fun . call ( obj , obj.x , obj.y );    // 30 

     

 //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

舉幾個具體例子:

例子1:

function add(a,b) 

{ 

    alert(a+b); 

} 

function sub(a,b) 

{ 

    alert(a-b); 

} 

//add.call(sub,3,1);

add.apply(sub,[3,1]);   

例子2:

function Class1() 

{ 

    this.name = "class1"; 

    this.showNam = function() 

    { 

        alert(this.name); 

    } 

} 

function Class2() 

{ 

    this.name = "class2"; 

} 

var c1 = new Class1(); 

var c2 = new Class2(); 

//c1.showNam.call(c2);   //class2

c1.showNam.apply(c2);

例子3:

   var func=new function(){this.a="func"};

//    var func = { a:"func"};

    var myfunc=function(x){

        var a="myfunc";

        alert(this.a);

        alert(x);

    };

   // myfunc.apply(func,"var");

    myfunc.apply(func,["var"]);  

例子4:[吊炸天有木有~call 可以用來實現繼承]

function Class1() 
{ 
    this.showTxt = function(txt) 
    { 
        alert(txt); 
    } 
} 
function Class2() 
{ 
    Class1.call(this); 
} 
var c2 = new Class2(); 
c2.showTxt("cc"); 

例子5:多繼承[javaScript 如何來類比物件導向的繼承,還可以實現多重繼承]

function Class10() 

{ 

    this.showSub = function(a,b) 

    { 

        alert(a-b); 

    } 

} 

function Class11() 

{ 

    this.showAdd = function(a,b) 

    { 

        alert(a+b); 

    } 

} 

function Class2() 

{ 

    Class10.call(this); 

    Class11.call(this); 

} 

var c2 = new Class2();

c2.showAdd(1,4);  //5

c2.showSub(10,6);//4

Call && apply 用法