是否可以绑定javascript函数,使其本地上下文与“this”相同

Is it possible to bind a javascript function so that its local context is same as 'this'?

本文关键字:上下文 this 相同 绑定 javascript 函数 是否      更新时间:2023-09-26

这是一个函数nameExists,可以绑定到对象并返回其名称属性是否为空。

var nameExists = function(){
  return this.name.length > 0;
}
var person = {name: "John"};
var johnHasName = nameExists.bind(person);
johnHasName();

现在,我希望能够以某种方式简化这个nameExists函数,这样我就不需要再使用this关键字,然后看起来像这样:

var nameExists = function(){
  return name.length > 0;
}

这假定函数的本地上下文等于其this上下文。基本上,我正在寻找一种以任何可能的方式调用/绑定/应用此功能的方法,这样我就不必使用this关键字。

我有充分的理由尝试这样做,所以请不要判断。我什至不确定这是否可能,并且一直在思考但无法提出想法。我将不胜感激!

附言我尝试这样做的原因是因为我正在尝试从字符串动态构造一个过滤器函数。例如,如果我想创建一个过滤器函数来确定一个人是否有名字并且年龄超过 20 岁,我会写这样的东西:

var john = {name: "john", age: 3};
var filter = "this.name.length > 0 && this.age > 20";
var fun = new Function("return " + filter);
var filterForJohn = fun.bind(john);
filterForJohn();

这样工作正常,但我只是不喜欢冗长,所以想简化过滤器字符串,以便我可以写

var filter = "name.length > 0 && age > 20";

发现这很有挑战性,因为在我拥有过滤器字符串之前,我既不知道属性,也不知道它们的条件组合。

可以使用 with 语句扩展作用域链:

var nameExists = function() {
  with(this) {
    // Here you don't need `this`:
    return name.length > 0;
  }
}

但是,它很慢,不建议在非严格模式下使用,并且在严格模式下

禁止使用。

在 Web 浏览器上,一个疯狂的替代方法是使用事件处理程序内容属性。不能直接访问事件处理程序返回的值,但如果false该值,则将取消该事件。

var makeObj, callFunc;
(function() {
  var parent = document.createElement('div'),
      eventCanceled;
  parent.addEventListener('click', function(e) {
    eventCanceled = e.defaultPrevented;
  });
  makeObj = function(props, funcStr) {
    var obj = document.createElement('div');
    Object.assign(obj, props);
    obj.setAttribute("onclick", "return " + funcStr);
    parent.appendChild(obj);
    return obj;
  };
  callFunc = function(obj) {
    obj.click();
    return !eventCanceled;
  };
})();
var obj = makeObj({name: "john", age: 3}, "name.length > 0 && age > 20");
callFunc(obj); // false