javaScript中的this範例學習詳解及工作原理_基礎知識

this的工作原理

如果一個函數被當作一個物件的方法調用，那麼this將被指派為這個物件。

複製程式碼 程式碼如下:

var parent = {        console.log(this);
    }
};

parent.method();
/
parent.method();
/

注意這種行為非常“脆弱”，如果你取得一個方法的參考並且調用，那麼this的值不會是parent了，而是window全域物件。這讓大多數開發者迷惑。

複製程式碼 程式碼如下:

ThisClownCar();


ThisClownCar();

/  

改動this

.call、 .apply 和.bind 方法用來操作呼叫函數的方式，幫我們定義this的值和傳遞給函數的參數值。

Function.prototype.call 可以有任意數量的參數，第一個參數被指派給this，剩下的被傳遞給呼叫函數。

複製程式碼

程式碼如下:


Array.prototype.slice.call([1, 222 , 3], 1, 2)
//
Function.prototype.apply 的行為和.call類似，但它傳遞給函數的參數是一個數組，而不是任意參數。

String.prototype.split.apply('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);

//

作用域鏈中的this

在下面的例子，this將無法在作用域鏈中保持不變。這是規則的缺陷，常常會給業餘開發者帶來困惑。

複製程式碼

程式碼如下:


function scoping () {


function scoping () {
this);

  return function () {
    console.log(this);
  };
}

scoping()();

}

scoping()();); // 有一個常見的方法，建立一個局部變數保持對this的引用，並且在子作用域中不能有同命變數。子作用域中的同名變數將覆寫父作用域中對this的引用。 http://www.cnblogs.com/sosoft/

複製程式碼


程式碼如下:



程式碼如下:

function retaining () {

  var self = this;

  return function () {

    console.log(self);  };; ()();//  

除非你真的想同時使用父作用域的this,以及當前this值，由於某些莫名其妙的原因,我更喜歡是使用的方法.bind函數。這可以用來將父作用域的this指定給子作用域。

 



複製程式碼


程式碼如下:

function bound function () {    console.log(this);  }.bind(this);}bound()();//