[英]How to bind parameter, assigning function to class prototype
假设我有一个 function
function getSum (firstValue) { return firstValue + this.secondValue }
和一些 class
class TestClass {}
我如何将 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
我可以得到 3
对于 object 我可以这样做
obj.getSum = getSum.bind(obj, 1)
但是对于TestClass.prototype
我不能设置绑定的第一个参数,因为上下文还不存在这个难题可以直接解决吗?
间接地我可以做这样的事情
const firstValue = 1
TestClass.getSum = function () {
return getSum.bind(this, firstValue)()
}
或者像这样
TestClass.firstValue = 1
TestClass.getSum = function () {
return getSum.bind(this)(TestClass.firstValue)
}
但也许可以更直接地完成
提前致谢
您可以创建一个 function ,它接受一个参数将调用getSum
但自己提供第一个参数。
TestClass.prototype.getSum = function() { //<–– normal function
return getSum.call( this, 1 );
// ^^^^ ^^^^ ^
// || || |
// forward this –++––––++ +–––––– pass a value for the first parameter
}
这将为您提供以下信息
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
通常,您将值绑定到 function 中的参数的过程称为部分应用。 如果一个 function 需要三个参数,例如,您可以先设置两个,稍后再设置最后一个。 整个过程可以通过创建一个 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());
使用更高阶的 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
嗨,而不是绑定,您可以直接分配它的原型,如下所示:
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'));
这对你有用吗?
<,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>
让我知道这是否适合您。
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.