Javascript设计模式之装饰者模式的示例分析(javascript,装饰者模式,设计模式,web开发)

ConcreteDecoratorClass函数中的this指向new出来的ConcreteDecoratorClass对象（也就是和decorator1指向同一个对象）；

AbstractDecorator函数里面的this关键是看哪个对象来调用这个函数，this就指向哪个对象（从代码 “this.base = AbstractDecorator; this.base(decorated);” 中我们可以看出是new出来的ConcreteDecoratorClass对象在调用AbstractDecorator函数），所以AbstractDecorator函数里面的this指向new出来的ConcreteDecoratorClass对象（也和decorator1指向同一个对象）。

总结下来，我们会发现，在上面的代码中，不管是ConcreteDecoratorClass函数里面的this，还是AbstractDecorator函数里面的this，都指向new出来的ConcreteDecoratorClass对象。

所以，当我们执行decorator1.performTask()时，它会继续执行匿名函数中的代码（decorated.performTask();），匿名函数中的decorated形参指向new出来的ConcreteClass对象，并执行该对象的performTask方法。

最后看看实例3：

实例3看起来很复杂，实际上分析逻辑还是和前面两个实例一样，我们可以看出实例3中一共声明了5个函数表达式。我们重点分析下下面的代码：

分析到这里，就不难知道最后的输出结果了。