将参数传递给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();
};