1.在全局環境使用this,它指的就是頂層對象window。
console.log(this);//windowvar a=2;this.a;//2function f(){console.log(this);}f();//window2.構造函數中的this,指的是實例對象。
function F(){this.PRice=2;}var f=new F();f.price;//23.對象通過點運算符調用方法,方法中的this指的是該對象。
var obj={ a:1, f:function(){console.log(this);this.a=2;}}obj.f();obj.a;4.函數賦值給另一個變量,函數內的this代表調用函數運行時所在的對象。
var obj={ f:function(){console.log(this);}}var foo=obj.f;foo();//window5.先運算,后執行,在全局環境執行運算結果,this指向全局環境
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); }();//先執行,后賦值,沒有被o對象調用 }}o.f1()// Object// Window7.foreach方法的回調函數中的this,指向window對象
var arr=[1,2,3];arr.foreach(function(item){console.log(this);})8.避免回調函數中的this
var o = new Object();o.f = function () { console.log(this === o);}o.f()//true$('#button').on('click', o.f);//false1.參數應該是一個對象。如果參數為空、null和undefined,則默認傳入全局對象。 2.如果call方法的參數是一個原始值,那么這個原始值會自動轉成對應的包裝對象,然后傳入call方法。 3.call方法還可以接受多個參數。第一個參數就是this所要指向的那個對象,后面的參數則是函數調用時所需的參數。
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方法的一個應用是調用對象的原生方法。
var obj={};obj.hasOwnProperty('toString');//falseobj.hasOwnProperty=function(){return true;}obj.hasOwnProperty('toString);//true//hasOwnProperty方法被覆蓋,如何才能使用原來的方法呢?Object.prototype.hasOwnProperty.call(obj,'toString');//false接收一個數組作為函數執行時的參數,使用格式: function.apply(thisValue, [arg1, arg2, …])
一些有趣的應用 1.Math.max()和apply結合—求數組的最大元素
Math.max(1,2,3)//3Math.max.apply(null,[1,2,3])//32.Array構造函數和apply結合—將數組的空元素變為undefined
Array.apply(null,[1,,2])//[1, undefined, 2]數組的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結合–將類似數組的對象轉換為數組
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);對象必須有length屬性
apply方法(或者call方法)不僅綁定函數執行時所在的對象,還會立即執行函數。
1.用于將函數體內的this綁定到某個對象,然后返回一個新函數,沒有立即執行
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);//產生一個新函數,函數中的this固定指向objf();obj.count;//22.綁定this以外,還可以綁定原函數的參數
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原生方法的使用形式,以數組的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)新聞熱點
疑難解答