Javascript - 将对象的成员函数放在独立变量中？

Question

我正在尝试将来自特定对象的成员函数放入独立变量中，希望能够通过简单地使用新变量来调用该函数（在原始对象上）。

所以是这样的：

var str = "abcdefgh";
var fn = str.indexOf;
console.log(fn("e")); // supposed to output 4

所以fn(x) 应该和str.indexOf(x) 做同样的事情。但这不起作用。还有其他方法可以解决这个问题吗？

请注意，这里的困难在于我希望 fn 调用函数在特定的 str 对象上。 所以fn 将成为某种封闭。

Answer 1

从You Don't Know JS Series，JS这样确定this

1. 函数是用新的（新绑定）调用的吗？如果是这样，这是 新建对象。

   var bar = new foo()

2. 是用call还是apply调用的函数（显式绑定），甚至 隐藏在绑定硬绑定中？如果是这样，这是明确的 指定对象。

   var bar = foo.call( obj2 )

3. 是否使用上下文调用的函数（隐式绑定），否则 被称为拥有或包含对象？如果是这样，这就是上下文 对象。

   var bar = obj1.foo()

4. 否则，默认 this（默认绑定）。如果在严格模式下， 选择未定义的，否则选择全局对象。

   var bar = foo()

您的问题

当您在str.indexOf('e') 上调用indexOf 时，JS 引擎开始在函数中查找上下文。它看到您在字符串对象上使用. 表示法调用了该函数，并将上下文引用到它。但 当您获得函数的引用并尝试像fn 一样调用时，引擎开始搜索上下文（上面提到）并且没有找到任何东西。否则，当您在外部获得函数引用时，它会丢失它的上下文。所以你需要明确地给出上下文。

我在这里写，每当调用fn 时，函数内的this 将引用str 变量。

var str = "abcdefgh";
var fn = str.indexOf.bind(str);
console.log(fn("e")); // supposed to output 4

Answer 2

如果您使用的是 ES6 变种 javascript，您可以使用“箭头函数”来实现这一点。这是一个不错的简短语法。

var fn = () => str.indexOf("e");

如需进一步参考， see the mozilla docs on arrow functions

这个变量当然可以传递。请注意，在此解决方案中，变量 fn 保存对您正在执行函数的字符串的直接引用，因此它解决了您的上下文问题。