將參數傳遞給javascript中的函數

Question

我正在嘗試使用選項3和4更改myprop的值，但沒有成功。 為什么？

object1 = {myprop:"value1", ....};  

button1.addEventListener('click',  function(e){
 object1.myMethod("value2"); // 1) working.   myMethod is a method that sets myprop's value  
 object1.myprop="value2";    // 2) working 

 myFunction1(object1.myMethod);   // 3) not working
 myFunction2(object1.myprop);     // 4) not working
});

function myFunction1(src) {
 src("value2");
}
function myFunction2(src) {
 src="value2";
}

Answer 1

您正在傳遞object1.myMethod / object.myprop的值 ，該值被復制到src變量。

然后，您可以調用該函數（但在不同的上下文中，因此該函數在this內部的值是不同的）或覆蓋src的值，而保留原始屬性。

如果要在正確的上下文中調用該函數，則需要使用call()或apply()傳遞該上下文。

如果要覆蓋存儲在object1中的對象的myprop屬性，則必須具有對object1值的引用，並在其上設置屬性。

Answer 2

當你定義匿名函數來處理click事件（ button1.addEventListener('click', function(e) {...}價值object1.myMethod和object1.myprop在封閉拍攝。

它的意思是：您正在定義一個函數，該函數在執行時將需要一些在定義時就在范圍內的值，而不是在執行時就需要的值（ object1.myMethod和object1.myprop ）。 該函數已在您的代碼中在那里定義，但是在click事件發生在按鈕上時將作為參數傳遞，並且將在遠離該函數的位置調用它。

發生的事情是將object1.myMethod和object1.myprop的值求值並捕獲到函數的閉包中，以便稍后在執行函數時可以使用（您看不到任何情況，它只是發生了）。

因此，您的方法在這里行不通。 我看到一種用於設置屬性的替代方法，即傳遞要在其中更改值的對象，並傳遞要更改的屬性的名稱。

// 1 way to make the property call work
object1 = {myProp:"value1"};

button1.addEventListener('click',  function(e){
  myFunction2(object1, 'myProp');
});

function myFunction2(src, prop) {
  src[prop]="value3";
};

對於方法部分，我可以看到三種使其工作的方法（實際上是4種，如果我使用apply而不是call ）。

1. 首先與屬性的情況相同：傳遞object1和函數所在的插槽的名稱。

2. 其次，您可以傳遞object1和函數，然后在object1的上下文中call函數。

3. 第三，無論以后在何處調用它，都可以從object1.myMethod創建一個將綁定到object1的新函數（即object1將為其上下文）。 通過bind完成。

例子：

// 3 ways to make the method call work
object1 = {myMethod:function(someParam){console.log(someParam)}};

button1.addEventListener('click',  function(e){
  myFunction1(object1, 'myMethod');
  myFunction3(object1, object1.myMethod);
  myFunction4(object1.myMethod.bind(object1, 'value3'));
});

function myFunction1(src, prop) {
  src[prop]("value3");
};

function myFunction3(src, method) {
  method.call(src, 'value3');
};

function myFunction4(func) {
  func();
};