优秀装饰器源码学习（一）：time

function defaultValue(str:string){
    return function(target,property){
        target[property] = str
    }
}

class User {

    @defaultValue('666')
    private _name: string | undefined
    constructor(name?:string) {
        if(name){
            this._name = name
        }
    }
    get name(){
        return this._name
    }
}

const a = new User()

console.log(a.name); // 666

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

ts-node first.ts

1

import { time } from './../index'
class Test {
    @time()
    sayHello() {
        let i = 0
        while (i < 100000) {
            i++
        }
        console.log('success');
    }
}

const t = new Test()
t.sayHello()

1
2
3
4
5
6
7
8
9
10
11
12
13
14

console.time('label')
// ...code 
console.timeEnd('label') // 即可打印出执行耗时

1
2
3

const labels = {}

// 替代console.time
const myTime = (label) => {
    // 记录开始时间
    labels[label] = new Date().getTime()
}

// 替代console.timeEnd
const myTimeEnd = (label) => {
    const timeNow = new Date().getTime();
    // 当前时间与开始时间做差
    const timeTaken = timeNow - labels[label];
    // 删除无用的标志
    delete labels[label];
    // 打印耗时
    console.log(`${label}: ${timeTaken}ms`);
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

// 首先是console.time的polyfill
// 当没定义time与timeEnd的时候，利用labels变量实现类似的效果
const defaultConsole = {
    time: console.time ? console.time.bind(console) : myTime,
    timeEnd: console.timeEnd ? console.timeEnd.bind(console) : myTimeEnd
}
// 用于label生成
let count = 0

export default function time(prefix: null | string = null, console = defaultConsole) {
    return function (target, key, descriptor) {
        
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14

let count = 0
export default function time(prefix: null | string = null, console = defaultConsole) {
    return function (target, key, descriptor) {
        const fn = descriptor.value
        // 如果没有传参
        // 使用构造函数的名称与装饰对象的属性名作为key
        if (prefix === null) {
            prefix = `${target.constructor.name}.${key}`;
        }

        // 校验装饰对象是否为函数
        if (typeof fn !== 'function') {
            throw new SyntaxError(`@time can only be used on functions, not: ${fn}`);
        }

        return {
            ...descriptor,
            value() {
                const label = `${prefix}-${count}`
                count++
                console.time(label)
                try {
                    return fn.apply(this, arguments)
                } finally {
                    console.timeEnd(label)
                }
            }
        }
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

粥里有勺糖

Choose mode

优秀装饰器源码学习（一）：time

优秀装饰器源码学习（一）：time

# 优秀装饰器源码学习（一）：time

# 前言

# 准备工作

# 搭建测试环境

# 源码目录

# time

# 使用示例

# 执行效果

# console.time实现

# 函数结构

# 最终实现

# 未完待续