javascript的this导致的耦合问题

Question

function a(){
  this.afun = param=>{
    return this.bfun(this.a_data + param)
  }
}

function b(){
  this.bfun = param=>{
    return this.b_data + param
  }
}

function c(){
  this.cfun = param=>{
    return this.bfun(this.c_data + param)
  }
}

function d(){
  this.dfun = param=>{
    return this.afun(this.d_data + param)
  }
}

function CreateObj(){
  this.a_data = 1
  this.b_data = 2
  this.c_data = 3
  this.d_data = 4

  a.call(this)
  b.call(this)
  c.call(this)
  d.call(this)
}

let obj = new CreateObj()

想象这些方法内部都有上百行代码.
在js编程中当各个方法中的依赖比较复杂时,我一般会想到用this来解决,将所有依赖存放在this,之后只管去this里拿就ok.
但这导致使用了this中数据的方法离开了this都无法单独存在.
而且存在先后顺序的问题.
这是否对将来维护产生不必要的麻烦?
请问我这样的代码编写方式是否是正确的?

Answer 1

你如果喜欢用this，可以考虑使用JS的面向对象，将CreateObj作为一个类来使用，afun这些可以作为类的实例方法：

function CreateObj(){
  this.a_data = 1
  this.b_data = 2
  this.c_data = 3
  this.d_data = 4
}

CreateObj.prototype.afun = function(){}

let obj = new CreateObj()

最近看到这两篇文章详细讲解了JS的面向对象和this，供楼主参考：
轻松理解JS中的面向对象，顺便搞懂prototype和__proto__
this到底指向啥？看完这篇就知道了！