这里的“shiftBind”功能是什么意思

What does the `shiftBind` function here mean?

本文关键字:功能 是什么 意思 shiftBind 这里      更新时间:2023-09-26

在javascript片段中,我看到了这样的代码。

nglr.shiftBind = function(_this, _function) {
  return function() {
    var args = [ this ];
    for ( var i = 0; i < arguments.length; i++) {
      args.push(arguments[i]);
    }
    return _function.apply(_this, args);
  };
};

这对我来说看起来有点抽象...谁能举个例子来说明这到底做了什么..

谢谢!

似乎将当前作用域(当您调用返回的函数时)附加到传递给_function的任何参数,然后最终使用指定的范围(_this)调用它。

// Take a new scope and a callback
var shiftBind = function(_this, _function) {
  // Wrap them, creating closure
  return function() {
    // Save the current scope, when you call this function
    var args = [this];
    // Prepend it to any arguments
    for (var i = 0; i < arguments.length; i++) {
      args.push(arguments[i]);
    }
    // Then call the original function with the original scope argument
    return _function.apply(_this, args);
  };
};
// Test it
function Ctor(foo) {
  this.foo = foo;
}
// Make a pair of Ctors and give x a method
var x = new Ctor(1);
var y = new Ctor(3);
x.getFoo = function(prev) {
  return prev ? prev.foo + this.foo : this.foo;
}
// Check outputs
console.log(x.getFoo()); // 1
console.log(x.getFoo.call(y)); // 3
// Bind so we have access to both "scopes"
x.boundFoo = shiftBind(y, x.getFoo);
console.log(x.boundFoo()); // calls getFoo, which only exists on x, but prints 4

这似乎没有大量的实际用途,也不是我以前见过的模式,但允许您访问具有类似语义this的对象。

这是

创建一个新函数,用于更改原始函数的this,但将原始this添加为第一个参数。因此,它既具有约束力,又将论点向下转移。我不知道它的目的是什么。

这个函数可以定义要传递给函数的参数和参数类型(字符串、数字...)。 示例:

var nglr = {};
nglr.shiftBind = function(_this, _function) {
  return function() {
    var args = [ this ];
    for ( var i = 0; i < arguments.length; i++) {
      args.push(arguments[i]);
    }
    return _function.apply(_this, args);
  };
};
var obj2 = new Object();
obj2.name = '';
// 1. defined a function that is called when the returned function is executed.
var sumFunc = function(obj, param, param2, param3, param4, param5){
  console.log('obj2: ', this); // obj2
  console.log(obj, param, param2, param3, param4, param5); // Window-Object 1 2 3 4 5
  return param + param2 + param3 + param4 + param5;
};
// 2. hold returned function at variable
var returnedFunc = nglr.shiftBind(obj2, sumFunc);
// 3. call returned function, now all parameters that were given to the returned function are passed on to the sumFunc-function plus as first param the object which context the returned function is executed in(in this case Window, because returnedFunc is not called as member-function). 
returnedFunc(1,2,3,4,5); // 15

这就是为什么当您将第五个参数传递给返回的函数时,但您只定义了 4 个参数加上 obj 参数,如下所示:

var sumFunc = function(obj, param, param2, param3, param4){
  console.log(obj, param, param2, param3, param4); // Window-Object 1 2 3 4 
  return param + param2 + param3 + param4;
};

它返回 10 而不是 15:

returnedFunc(1,2,3,4,5); // 10

尽管如此,您可以在 arguments-property(at console.log) 中看到第五个参数 (5),但它没有在 sumFunc 函数中定义为第六个参数。因此返回 10 而不是 15:

var nglr = {};
nglr.shiftBind = function(_this, _function) {
  return function() {
    var args = [ this ];
    console.log(arguments); // [1, 2, 3, 4, 5]
    for ( var i = 0; i < arguments.length; i++) {
      args.push(arguments[i]);
    }
    return _function.apply(_this, args);
  };
};

此外,shiftBind 意味着当调用 sumFunc 时,"this"-property 可能是不同的对象。在这个例子中,obj2 而不是 nglr:

var sumFunc = function(obj, param, param2, param3, param4, param5){
  console.log('obj2: ', this); // obj2 not nglr
  //...
};