js中三個預設方法call，applay，bind

標籤：注意   基本   def   pre   資料   事件   his   null   數字   

這三個都是函數內建的方法（Function.prototype），這三個方法都能夠改變函數內部 this的指向，

call

//call方法接收三個參數，第一個是this指向，第二個，三個是傳遞給函數的實參，可以是數字，字串，數組等類型的資料類型都可以function fn(n1,n2){   console.log(this);     console.log(n1,n2)}fn.call();//=>this:window;let obj = {fn:fn};fn.call(obj);//=>this:obj;n1,n2:undefinedfn.call(1,2);//=>this: 1;n1=2,n2=undefined;fn.call(obj,1,2);//=>this: obj;n1=1,n2=2;//Call方法的幾個特殊屬性//非strict 模式下fn.call(undefined);//this=>windowfn.call(null);//this=>window//strict 模式下"use strict"fn.call(undefined);//this=>undefinedfn.call(null);//this=>null

apply

//apply方法的使用和call方法基本相同，唯一的區別是，apply方法傳參要求是數群組類型的，數組內可以任意形式的資料function fn (n1,n2){    console.log(this);    console.log(n1,n2)    console.log(arguments)}let obj = {fn:fn};

fn.applay(abj,[1,2]);

fn.applay(abj,1,2)；//報錯

fn.applay(abj,[11,‘apply‘,{a:123}]);//注意第二個參數必須是數組，否則會報錯

bind

//bind和call方法調用形式類似，但是原理完全不同fn.call(obj,10,20);//=>fn先執行，將fn內的this指向obj，並且把參數10,20傳遞給fnfn.bind(obj,10,20)//bind是先將fn中的this指向obj，並且將參數10,20預先傳遞給fn，但是此時的fn並沒有被執行，只有fn執行時this指向和傳遞參數才有作用fn.bind(obj,10,20);//=>不會有任何輸出fn.bind(obj,10,20)();//=>調用後才會有輸出//=>需求：點擊box這個盒子的時候，需要執行fn，並且讓fn中的this指向objoBox.onclick=fn; //=>點擊的時候執行了fn,但此時fn中的this是oBoxoBox.onclick=fn.call(opp); //=>綁定事件的時候就已經把fn立即執行了(call本身就是立即執行函數),然後把fn執行的傳回值綁定給事件oBox.onclick=fn.bind(opp);//=>fn.bind(opp)：fn調取Function.prototype上的bind方法，執行這個/*  * function(){ *     fn.call(opp); * } */oBox.onclick=function(){   //=>this:oBox    fn.call(opp);}

 

js中三個預設方法call，applay，bind