TypeScript中参数装饰器应用时为何参数顺序反转？

云上老周

2026-7-6

为什么第二个构造函数参数的装饰器先于第一个执行？

编者注：本问题与Decorator Composition无关。Decorator Evaluation章节提及了该问题，但未给出解答。

我编写了如下代码：

const decorate = (log: string): ParameterDecorator => () => {
    console.log(log)
}

class Thing {
    constructor(
        @decorate('Outer first')
        @decorate('Inner first')
        c0: string,

        @decorate('Outer second')
        @decorate('Inner second')
        c1: string,
    ) {
        console.log(c0)
        console.log(c1)
    }
}

new Thing('Hello!', 'World!')

运行上述代码后，日志输出顺序为：

Inner second
Outer second

Inner first
Outer first

Hello!
World!

我理解为何"Inner …"先于"Outer …"输出，但疑惑为何"… second"先于"… first"输出？即为什么第二个构造函数参数的装饰器日志会先于第一个输出？

这是因为TypeScript中构造函数的参数装饰器会按照参数列表从右到左的顺序执行，也就是先处理最后一个参数的装饰器，再依次向前处理前面的参数。

具体到你的代码：

首先处理第二个参数c1的装饰器：先执行靠近参数的@decorate('Inner second')，再执行外层的@decorate('Outer second')，所以输出Inner second和Outer second；
接着处理第一个参数c0的装饰器：同样先执行内层的@decorate('Inner first')，再执行外层的@decorate('Outer first')，输出Inner first和Outer first；
最后才执行构造函数内部的代码，输出Hello!和World!。