将原型函数绑定到此的方式不那么冗长

Less verbose way of binding prototype functions to this

本文关键字：方式不 原型 函数 绑定      更新时间：2023-09-26

我使用以下声明类的范例：

var myNamespace = myNamespace || {};
(function () {
    myNamespace.MyClass = function () {
        if (!(this instanceof myNamespace.MyClass)) {
            return new myNamespace.MyClass();
        }
        this.field = 17;
        this.foo = this.foo.bind(this);
        this.bar = this.bar.bind(this);
    };
    myNamespace.MyClass.prototype.foo = function(){
        console.log(this.field + 1);
    };
    myNamespace.MyClass.prototype.bar = function(){
        console.log(this.field + 2);
    };
})();

我使用prototype来避免在每次实例化时重新定义对象方法，并使代码更干净——将类字段与其逻辑分离
我在每个方法上调用bind，以避免出现this在方法内部指向错误的严重错误。

它很有效，但很容易出错——我必须记住对每个方法调用bind，而且它太冗长了，尤其是当有两个以上的方法时。

是否有更干净的方法来声明这些类型的函数（绑定到其类型的this，并在prototype上声明）

*我知道"干净"并没有很好地定义——一个简单的度量标准就是代码长度。

你不应该那样绑定你的方法——你在每个实例上创建新的函数，而你真的应该在原型上有方法来节省内存。如果你创建了100个实例，那么你就创建了200个新函数！像这样的简单模式更常见，也会很好地工作：

var myNamespace = myNamespace || {};
myNamespace.MyClass = (function() {
  function MyClass() {
    this.field = 17;
  }
  MyClass.prototype = {
    constructor: MyClass,
    foo: function() {
      console.log(this.field + 1);
    },
    bar: function(){
      console.log(this.field + 2);
    }
  };
  return MyClass;
}());

在声明类之后附加到您的命名空间：

var myNamespace = myNamespace || {};
(function () {
    var MyClass = function () {
        this.field = 17;
    };
    MyClass.prototype.foo = function(){
        console.log(this.field + 1);
    };
    MyClass.prototype.bar = function(){
        console.log(this.field + 2);
    };
    this.MyClass = MyClass;
}).call(myNamespace);

通过以命名空间作为作用域调用IIFE，可以通过在this对象上公开类来保持模块的干净。

您可以在一次赋值中压缩一些原型定义，并将命名空间传递到函数调用中。

var myNamespace = myNamespace || {};
(function () {
    function MyClass() { 
        this.field = 17;
    };
    MyClass.prototype = {
        foo: function () {
            console.log(this.field + 1);
        },
        bar: function () {
            console.log(this.field + 2);
        }
    };
})(myNamespace);
相关文章：