ES6语法中方法定义到构造函数中是什么意思？

Question

在工作时，用到了websocket，定义了一个回调函数，但同事非的把回调函数的定义在构造函数里面，我说像往常定义一样定义，他说这样比较好，下面是代码，哪位大侠能给解释下。

export default class USubsystemMain extends UnitBase {
    constructor(props) {
        super(props);
        var _self = this;
        _self.state = {
            configSource: [],
            valueSource: {},
            startLabel: "",
            faultLable: ""
        }
        
         _self.websocktCallback = function (pointValues) {
             //do something
         }
    }
    
    showName(){
        console.log('zhangsan');
    }
}

上面的websocktCallback函数为什么不和showName一样进行定义呢？这两种定义是否是一样的？有什么区别呢？

Answer 1

上面的websocktCallback函数为什么不和showName一样进行定义呢

showName是USubsystemMain.prototype.showName
_self.websocktCallback是new USubsystemMain()的实例的自身属性。
可以理解为深复制
super(props)所添加的属性是所添加的属性是浅复制

就是实例属性的位置，定义在自身上(this上) 还是定义在原型链上的区别

可以用 hasOwnProperty检测

Answer 2

光是从这个类的定义来看很难说哪个比较好。因为具体而言两种方式各有各的好处，得看你的需求。

简单的来说，JavaScript的类是依靠原型链来实现的，类的原型方法都放在prototype对象里面，这样做的好处是显而易见的，所有的实例调用的其实是同一个方法，只是this不同罢了。

把方法定义在构造函数中，这也就意味着每创建一个新的实例，同样也就新创建了一个这个方法，每个实例调用这个函数的时候，虽然函数的名字内容全都是一样的，但是其实它们并不是同一个函数。这么做的好处是可以模拟私有变量，JavaScript并没有私有变量的概念，通过这样闭包的方式是现在唯一比较完美的解决方案。但是这样做相比上面的做法来说，会浪费部分内存。