TypeScript再次结合* .js + * .d.ts？

Question

TypeScript tsc -d "declaration" of "compilerOptions" generates corresponding '.d.ts' file.

For instance, from:

tmp.ts

const log = (m: unknown) => {
    console.log((m)); 
    return m;
};

it generates:

tmp.js

const log = (m) => {
    console.log((m));
    return m;
};

and:

tmp.d.ts

declare const log: (m: unknown) => unknown;

I think this is quite interesting because it "devides" the TypeScript source code to a native JavaScript code and the extra type definition.

Then, here is my thought. After deviding the native code and type definition, is it easily possilbe to generate a valid TypeScript code by re-binding both codes.

For instance:

tmp-reunion.ts

declare const log1: (m: unknown) => unknown;

const log1 = m => {
    console.log((m)); 
    return m;
};

This code generates an errors:

[ts] Cannot redeclare block-scoped variable 'log1'.

for each statements.

Why am I doing this?

I'm motivated by facts:

1. In Algebra,

   (x^2 + 3x +2) = (x+1)(x+2) = (x^2 + 3x +2)

I want to confirm if the same thing is valid under TypeScript.

2. It's especially interesting TypeScript compiles a typed-source-code to a vanilla JavaScript code having the type information completely discarded as the output.

The fact makes me think, in a sense, the output of the vanilla JS code is type safe and valid with TypeScirpt, just without the *.d.ts file which is eventually appearently merely an extra helper functionality that TypeScript compiler takes advantage of. It's just a tool.

Accordingly, the type-safty of the vanilla JS code can be later, easily validated by TypeScript compiler with the helper functional tool, that is tmp.d.ts . That is what I want to confirm.

How can I make TypeScript combining *.js + *.d.ts again?

Thanks.

Answer 1

Accordingly, the type-safty of the vanilla JS code can be later, easily validated by TypeScript compiler with the helper functional tool, that is tmp.d.ts .

This is not true in general because you've lost any manual type annotations inside function bodies that were needed to validate those function bodies where TypeScript's type inference was insufficiently powerful. For an artificial example (assuming noImplicitAny of course):

function duplicateEach<T>(arr: T[]) { 
    let out: T[] = [];
    arr.forEach(t => { out.push(t); out.push(t); });
    return out;
}

If you remove the annotation on out , the code doesn't compile because TypeScript's evolving array type inference doesn't traverse into callbacks. If we look at the .d.ts and the .js , this annotation doesn't appear in either of them:

declare function duplicateEach<T>(arr: T[]): T[];

function duplicateEach(arr) {
    var out = [];
    arr.forEach(function (t) { out.push(t); out.push(t); });
    return out;
}

For more realistic examples, look at any nontrivial TypeScript codebase.