如何绑定参数，将 function 分配给 class 原型
[英]How to bind parameter, assigning function to class prototype
问题描述
Let's say i have a function
假设我有一个 function
function getSum (firstValue) { return firstValue + this.secondValue }
and some class和一些 class
class TestClass {}
how can i dynamically assign function getSum to class prototype with binding firstValue as 1, so after我如何将 function getSum动态分配给 class 原型，并将 firstValue 绑定为 1，所以之后
// some code like TestClass.prototype.getSum = getSum.bind(null, 1)
const obj = new TestClass()
obj.secondValue = 2
console.log(obj.getSum()) // 3
i could get 3我可以得到 3
For object i could do it like this对于 object 我可以这样做
obj.getSum = getSum.bind(obj, 1)
But for TestClass.prototype i can not set first parameter of bind because context is not existing yet Can this puzzle be solved directly ?但是对于TestClass.prototype我不能设置绑定的第一个参数，因为上下文还不存在这个难题可以直接解决吗？
Indirectly i can do something like this间接地我可以做这样的事情
const firstValue = 1
TestClass.getSum = function () {
return getSum.bind(this, firstValue)()
}
or like this或者像这样
TestClass.firstValue = 1
TestClass.getSum = function () {
return getSum.bind(this)(TestClass.firstValue)
}
but may be it can be done more directly但也许可以更直接地完成
Thanks in advance提前致谢
4 个解决方案
解决方案1
1 已采纳 2020-06-28 07:39:30
You can create a function that takes one parameter will call getSum but supplies the first parameter itself.您可以创建一个 function ，它接受一个参数将调用getSum但自己提供第一个参数。
TestClass.prototype.getSum = function() { //<–– normal function
return getSum.call( this, 1 );
// ^^^^ ^^^^ ^
// || || |
// forward this –++––––++ +–––––– pass a value for the first parameter
}
This gets you the following这将为您提供以下信息
function getSum (firstValue) { return firstValue + this.secondValue } class TestClass {} TestClass.prototype.getSum = function() { return getSum.call(this, 1); } const obj = new TestClass() obj.secondValue = 2 console.log(obj.getSum()) // 3
In general this the process where you supply bind a value to a parameter in the function is called partial application .通常，您将值绑定到 function 中的参数的过程称为部分应用。 If a function takes three parameters, for example, you can only set two at first and expect the final one at a later point.如果一个 function 需要三个参数，例如，您可以先设置两个，稍后再设置最后一个。 The whole process can be abstracted away by creating a function to handle this:整个过程可以通过创建一个 function 来处理这个抽象出来：
function partiallyApply(fn, ...params) { return function(...moreParams) { return fn.call(this, ...params, ...moreParams); } } function takes4Parameters (a, b, c, d) { return a + b + c + d; } const takes2Parameters = partiallyApply(takes4Parameters, 1, 2); // 1 + 2 + c + d console.log("1 + 2 + 11 + 12 =", takes2Parameters(11, 12)); const takes1Parameter = partiallyApply(takes2Parameters, 3); // 1 + 2 + 3 + d console.log("1 + 2 + 3 + 5 =", takes1Parameter(5)); const takesNoParameter = partiallyApply(takes1Parameter, 6); // 1 + 2 + 3 + 6 console.log("1 + 2 + 3 + 6 =", takesNoParameter());
Using that higher order function, we can more easily derive the getSum method for TestClass使用更高阶的 function，我们可以更容易地推导出TestClass的getSum方法
function getSum (firstValue) { return firstValue + this.secondValue } function partiallyApply(fn, ...params) { return function (...moreParams) { return fn.call(this, ...params, ...moreParams) } } class TestClass {} TestClass.prototype.getSum = partiallyApply(getSum, 1); //example of adding other partially applied methods: TestClass.prototype.getSum2 = partiallyApply(getSum, 2); TestClass.prototype.getSum3 = partiallyApply(getSum, 3); TestClass.prototype.getSum4 = partiallyApply(getSum, 4); const obj = new TestClass() obj.secondValue = 2 console.log(obj.getSum()); // 3 console.log(obj.getSum2()); // 4 console.log(obj.getSum3()); // 5 console.log(obj.getSum4()); // 6
解决方案2
0 2020-06-28 07:02:00
Hi instead of binding you can directly assign it it's prototype like this:嗨，而不是绑定，您可以直接分配它的原型，如下所示：
function getSum(firstValue) { return firstValue + this.secondValue }
class TestClass { }
TestClass.prototype.getSum = getSum;
const asd = new TestClass();
asd.secondValue = ' world';
console.log(asd.getSum('hello'));
Does this work for you?这对你有用吗？
解决方案3
0 2020-06-28 07:10:24
<,DOCTYPE html> <html> <body> <h2>JavaScript Objects</h2> <p id="demo"></p> <script> function Sum(first. second) { this;firstValue = first. this;secondValue = second. } Sum.prototype.getSum = function() { return this.firstValue + this,secondValue } var mysum = new Sum(50; 10). document.getElementById("demo").innerHTML = "Sum is" + mysum;getSum(); </script> </body> </html>
解决方案4
0 2020-06-28 07:11:43
Let me know if this works for you.让我知道这是否适合您。
function getSum(firstValue = 1) { return firstValue + this.secondValue } // or //function getSum() { // const firstValue = arguments.length? arguments[0]: 1; // return firstValue + this.secondValue //} class Test {} Test.prototype.getSum = getSum; // or // Test.prototype["getSum"] = getSum; // or // const methodName = "getSum"; // Test.prototype[methodName] = getSum; const test = new Test(); test.secondValue = 100; console.log(test.getSum()) // -> 101, firstValue is 1 console.log(test.getSum(11)) // -> 111, firstValue is 11
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.