萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> javaScript中的this示例學習詳解及工作原理

javaScript中的this示例學習詳解及工作原理

 這篇文章主要介紹了javaScript中的this示例學習詳解及工作原理,大家參考使用吧

this的工作原理   如果一個函數被作為一個對象的方法調用,那麼this將被指派為這個對象。   代碼如下: var parent = {     method: function () {         console.log(this);     } };   parent.method(); // <- parent       注意這種行為非常“脆弱”,如果你獲取一個方法的引用並且調用,那麼this的值不會是parent了,而是window全局對象。這讓大多數開發者迷惑。   代碼如下: ThisClownCar(); // <- Window   改動this   .call、 .apply 和.bind 方法用來操作調用函數的方式,幫我們定義this的值和傳遞給函數的參數值。   Function.prototype.call 可以有任意數量的參數,第一個參數被分配給this,剩下的被傳遞給調用函數。 代碼如下: Array.prototype.slice.call([1, 2, 3], 1, 2) // <- [2]   Function.prototype.apply 的行為和.call類似,但它傳遞給函數的參數是一個數組,而不是任意參數。   String.prototype.split.apply('13.12.02', ['.']) // <- ['13', '12', '02']     Function.prototype.bind 創建一個特殊的函數,該函數將永遠使用傳遞給.bind的參數作為this的值,以及能夠分配部分參數,創建原函數的珂裡化(curride)版本。   代碼如下: var arr = [1, 2]; var add = Array.prototype.push.bind(arr, 3);   // effectively the same as arr.push(3) add();   // effectively the same as arr.push(3, 4) add(4);   console.log(arr); // <- [1, 2, 3, 3, 4]     作用域鏈中的this   在下面的例子,this將無法在作用域鏈中保持不變。這是規則的缺陷,並且常常會給業余開發者帶來困惑。  代碼如下: function scoping () {   console.log(this);     return function () {     console.log(this);   }; }   scoping()(); // <- Window // <- Window     有一個常見的方法,創建一個局部變量保持對this的引用,並且在子作用域中不能有同命變量。子作用域中的同名變量將覆蓋父作用域中對this的引用。http://www.cnblogs.com/sosoft/      代碼如下: function retaining () {   var self = this;     return function () {     console.log(self);   }; }   retaining()(); // <- Window     除非你真的想同時使用父作用域的this,以及當前this值,由於某些莫名其妙的原因,我更喜歡是使用的方法.bind函數。這可以用來將父作用域的this指定給子作用域。    代碼如下: function bound () {   return function () {     console.log(this);   }.bind(this); }   bound()(); // <- Window  
copyright © 萬盛學電腦網 all rights reserved