1.在全局環(huán)境使用this,它指的就是頂層對象window。
console.log(this);//windowvar a=2;this.a;//2function f(){console.log(this);}f();//window2.構(gòu)造函數(shù)中的this,指的是實例對象。
function F(){this.PRice=2;}var f=new F();f.price;//23.對象通過點運算符調(diào)用方法,方法中的this指的是該對象。
var obj={ a:1, f:function(){console.log(this);this.a=2;}}obj.f();obj.a;4.函數(shù)賦值給另一個變量,函數(shù)內(nèi)的this代表調(diào)用函數(shù)運行時所在的對象。
var obj={ f:function(){console.log(this);}}var foo=obj.f;foo();//window5.先運算,后執(zhí)行,在全局環(huán)境執(zhí)行運算結(jié)果,this指向全局環(huán)境
var obj={ f:function(){console.log(this);}}(1,obj.f)()//window6.避免多層this
var o = { f1: function () { console.log(this); var f2 = function () { console.log(this); }();//先執(zhí)行,后賦值,沒有被o對象調(diào)用 }}o.f1()// Object// Window7.foreach方法的回調(diào)函數(shù)中的this,指向window對象
var arr=[1,2,3];arr.foreach(function(item){console.log(this);})8.避免回調(diào)函數(shù)中的this
var o = new Object();o.f = function () { console.log(this === o);}o.f()//true$('#button').on('click', o.f);//false1.參數(shù)應(yīng)該是一個對象。如果參數(shù)為空、null和undefined,則默認傳入全局對象。 2.如果call方法的參數(shù)是一個原始值,那么這個原始值會自動轉(zhuǎn)成對應(yīng)的包裝對象,然后傳入call方法。 3.call方法還可以接受多個參數(shù)。第一個參數(shù)就是this所要指向的那個對象,后面的參數(shù)則是函數(shù)調(diào)用時所需的參數(shù)。
var n=1;var obj={n:2};function f(){console.log(this.n);}f.call(obj);//2f.call(window);//1f.call(null);//1f.call();//1function add(a,b){console.log(a+b);}add.call(this,1,2);//3call方法的一個應(yīng)用是調(diào)用對象的原生方法。
var obj={};obj.hasOwnProperty('toString');//falseobj.hasOwnProperty=function(){return true;}obj.hasOwnProperty('toString);//true//hasOwnProperty方法被覆蓋,如何才能使用原來的方法呢?Object.prototype.hasOwnProperty.call(obj,'toString');//false接收一個數(shù)組作為函數(shù)執(zhí)行時的參數(shù),使用格式: function.apply(thisValue, [arg1, arg2, …])
一些有趣的應(yīng)用 1.Math.max()和apply結(jié)合—求數(shù)組的最大元素
Math.max(1,2,3)//3Math.max.apply(null,[1,2,3])//32.Array構(gòu)造函數(shù)和apply結(jié)合—將數(shù)組的空元素變?yōu)閡ndefined
Array.apply(null,[1,,2])//[1, undefined, 2]數(shù)組的forEach方法會跳過空元素,但是不會跳過undefined。
Array.apply(null,[1,,3]).forEach(function(item){console.log(item);})//1//undefined//3[1,,3].forEach(function(item){console.log(item);})//1//33.slice和apply結(jié)合–將類似數(shù)組的對象轉(zhuǎn)換為數(shù)組
var a={0:'a',1:'b',length:3};Array.prototype.slice.apply(a);//["a", "b", undefined]Array.prototype.slice.apply(arguments);Array.prototype.slice.call(arguments);[].slice.apply(arguments);對象必須有l(wèi)ength屬性
apply方法(或者call方法)不僅綁定函數(shù)執(zhí)行時所在的對象,還會立即執(zhí)行函數(shù)。
1.用于將函數(shù)體內(nèi)的this綁定到某個對象,然后返回一個新函數(shù),沒有立即執(zhí)行
var obj={ count:0, inc:function(){this.count++;}}obj.count;//0obj.inc();obj.count;//1var f=obj.inc;f();obj.count;//1count;//NaN改成:
var f=obj.inc.bind(obj);//產(chǎn)生一個新函數(shù),函數(shù)中的this固定指向objf();obj.count;//22.綁定this以外,還可以綁定原函數(shù)的參數(shù)
function add(x,y){return this.m+x+y;}var obj={m:1}var f=add.bind(obj,3);//傳入x為3f(2);3.對于那些不支持bind方法的老式瀏覽器,可以自行定義bind方法。
if(!('bind' in Function.prototype)){ Function.prototype.bind=function(){ var fn=this; var context=arguments[0]; var args=[].slice.call(arguments,1); return function{ return fn.apply(context,args); } }}4.利用bind方法,可以改寫一些Javascript原生方法的使用形式,以數(shù)組的slice方法為例。
[1, 2, 3].slice(0, 1)// [1]// 等同于Array.prototype.slice.call([1, 2, 3], 0, 1)// [1]//等同于var slice = Function.prototype.call.bind(Array.prototype.slice);slice([1, 2, 3], 0, 1) // [1]//o.slice(args)->slice(o,args)新聞熱點
疑難解答
圖片精選