Question

使用ES6课程很棒，但是我发现自己在任何地方使用this.variable，它总是指我的课程。有没有办法让我的班级中的隐含全局变量暗示this.variable而不是？所以，如果我写'宽度'，它将默认为this.width而不是隐含的全局？

或者如果有一些我可能没有意识到的最佳做法可以减少我的“这个”成瘾，我也很乐意阅读。在我目前正在处理的文件中，这些关键字的数量大约是代码行的一半......

Answer 1

使用构造函数/类和this只是使用JavaScript的一种方法。 JavaScript是一种多范式语言，是的，完全可以在不使用this的情况下使用它。一种方法是通过封闭。

考虑这个class示例：

class Person {
  constructor(first, last) {
    this.first = first;
    this.last = last;
    this.things = [];
  }
  sayHello() {
    console.log(`Hi, I'm ${this.first} ${this.last}`);
  }
  grabThing(thing) {
    this.things.push(thing);
  }
}
const p1 = new Person("Joe", "Bloggs");
p1.sayHello();
p1.grabThing("thing1");
console.log(p1.first + "'s things: " + p1.things.join(", "));
const p2 = new Person("Suresh", "Kumar");
p2.sayHello();
p2.grabThing("thing2");
p2.grabThing("thing3");
console.log(p2.first + "'s things: " + p2.things.join(", "));

现在，请考虑使用闭包的方法：

function createPerson(first, last) {
  const things = [];
  return {
    sayHello() {
      console.log(`Hi, I'm ${first} ${last}`);
    },
    grabThing(thing) {
      things.push(thing);
    },
    get things() {
      return things;
    },
    get first() {
      return first;
    },
    get last() {
      return last;
    }
  };
}
const p1 = createPerson("Joe", "Bloggs");
p1.sayHello();
p1.grabThing("thing1");
console.log(p1.first + "'s things: " + p1.things.join(", "));
const p2 = createPerson("Suresh", "Kumar");
p2.sayHello();
p2.grabThing("thing2");
p2.grabThing("thing3");
console.log(p2.first + "'s things: " + p2.things.join(", "));

请注意我们如何直接在first中使用last和[{1}}函数提供的createPerson和sayHello参数，我们只需将things声明为本地grabThing关闭的常数。在该示例中，我们还为各种信息提供了getter（first，last，things），因此可以从我们返回的对象中使用它们，但如果有信息我们我想保持私密，我们可以省去吸气剂。（有些人更愿意将这些明确的功能而不是吸气剂。）

这种方法的一个缺点是sayHello，grabThing，getter等的单独函数对象，用于由{{1}创建的每个对象在createPerson示例中，只有一个class函数对象，它通过原型继承在sayHello个对象之间共享。一方面，创建额外的Person函数对象似乎很浪费;但现代JavaScript引擎重复使用底层函数代码，即使有不同的sayHello对象，对象在我们的现代世界中相当便宜。

上行是获取私人信息的简便方法，无需使用和管理sayHello。

道格拉斯·克罗克福德（道格拉斯·克罗克福德）（以及其他人）如果想要了解更多信息，可以推广这种方法。（请注意，在他的写作中，克罗克福德有时无法清楚地区分事实和他的观点 - 男孩是否有意见 - 但无论如何，他的写作都值得一读。）

（我不是在倡导this或非class，只是注意到有选项。）

Answer 2

我知道这不是推荐的做法，但with声明是OP要求的。

with允许使用属性作为语句中的变量来解析对象：

＆＃13;

var MyClass = /** @class */ (function() {
  function MyClass(name, age) {
    this.name = name;
    this.age = age;
  }
  MyClass.prototype.whoami = function() {
    with(this) {
      console.log(name, age);
    }
  };
  return MyClass;
}());
var c = new MyClass("bob", 123);
c.whoami();

＆＃13;

with中存在strict mode被禁用的问题，这意味着有some contexts where it simply won't work。

ES6课程就是这样一个上下文，所以如果OP想要使用ES6课程，那么with就会出局。

Answer 3

回想一下这个古老的问题，随着钩子的发布，答案变得显而易见了，只是不要写类组件而写函数组件：）

我怎么不经常写'这个'？

3 个答案: