如何绑定参数，将函数分配给类原型
假设我有一个功能
function getSum (firstValue) { return firstValue + this.secondValue }
和一些班级
class TestClass {}
我如何动态地将函数分配getSum给类原型，并将 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
对于对象，我可以这样做
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)
}
但也许可以更直接地完成
肥皂起泡泡浏览 92回答 3
3回答
-
Smart猫小萌
您可以创建一个函数，该函数将调用一个参数，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 = 2console.log(obj.getSum()) // 3通常，将值绑定到函数中的参数的过程称为部分应用程序。例如，如果一个函数需要三个参数，那么您一开始只能设置两个，然后再设置最后一个。整个过程可以通过创建一个函数来处理这个抽象出来：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 + dconsole.log("1 + 2 + 11 + 12 =", takes2Parameters(11, 12));const takes1Parameter = partiallyApply(takes2Parameters, 3); // 1 + 2 + 3 + dconsole.log("1 + 2 + 3 + 5 =", takes1Parameter(5));const takesNoParameter = partiallyApply(takes1Parameter, 6); // 1 + 2 + 3 + 6console.log("1 + 2 + 3 + 6 =", takesNoParameter());使用那个高阶函数，我们可以更容易地推导getSum出TestClassfunction 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 = 2console.log(obj.getSum()); // 3console.log(obj.getSum2()); // 4console.log(obj.getSum3()); // 5console.log(obj.getSum4()); // 6 -
智慧大石
<!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 1console.log(test.getSum(11)) // -> 111, firstValue is 11
随时随地看视频慕课网APP
相关分类
JavaScript