Giải thích <Square>{} có nghĩa gì??? (ok)

https://stackoverflow.com/questions/38831342/what-does-enclosing-a-class-in-angle-brackets-mean-in-typescript

Ví dụ đã hoàn thành :) chú ý tôi thấy nó chạy tốt trong môi trường reactjs nhưng mội trường chỉ có typescript nó lỗi :(

These are the same:

let square = <Square>{};
let square = {} as Square;
Example:

interface Props {
    x: number;
    y: number;
    name: string;
}

let a = {};
a.x = 3; // error: Property 'x' does not exist on type `{}`
So you can do:

let a = {} as Props;
a.x = 3;
Or:

let a = <Props> {};
Which will do the same
Chạy: yarn ts-node -T index.tsx để kiểm tra chú ý tham số -T để bỏ qua lỗi biên dịch '--isolatedModules' 

interface Foo {
    bar: number;
    bas: string;
}
var foo = {} as Foo;
foo.bar = 123;
foo.bas = 'hello';
Hoặc 
interface Foo {
    bar: number;
    bas: string;
}
var foo = <Foo>{
    // the compiler will provide autocomplete for properties of Foo
    // But it is easy for the developer to forget adding all the properties
    // Also this code is likely to break if Foo gets refactored (e.g. a new property added)
};

Chú ý nếu nhìn thấy lỗi này khi biên dịch :)

index.tsx(1,1): error TS1208: 'index.tsx' cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' statement to make it a module.

Under the hood, ts-node takes your script, does some semantic checking to ensure your code is error-free, and then compiles your TypeScript into JavaScript.

This is the safest option. But if you’re not worried about TypeScript errors, you can pass in the -T or --transpileOnly flag. This flag tells ts-node to transpile down to JavaScript without checking for any TypeScript errors.

While it’s not always advisable to use this flag, there are scenarios where it makes sense. If you’re trying to run someone else’s script or if you’re confident that your editor and linter are catching everything, using the -T or --transpileOnly flag is appropriate.

npx ts-node -T reptile.ts

What does enclosing a class in angle brackets “<>” mean in TypeScript?

Ask QuestionAsked 4 years, 3 months agoActive 2 years, 7 months agoViewed 20k times5114

I am very new to TypeScript and I am loving it a lot, especially how easy it is to do OOP in Javascript. I am however stuck on trying to figure out the semantics when it comes to using angle brackets.

From their docs, I have seen several example like

interface Counter {
    (start: number): string;
    interval: number;
    reset(): void;
}

function getCounter(): Counter {
    let counter = <Counter>function (start: number) { };
    counter.interval = 123;
    counter.reset = function () { };
    return counter;
}

and

interface Square extends Shape, PenStroke {
    sideLength: number;
}

let square = <Square>{};

I am having trouble understanding what this exactly means or the way to think of/understand it.

Could someone please explain it to me?typescriptbracketsshare improve this question follow edited Aug 8 '16 at 14:07Nitzan Tomer110k3131 gold badges251251 silver badges251251 bronze badgesasked Aug 8 '16 at 14:04davejoem2,74233 gold badges1515 silver badges2727 bronze badges

• 1I found this question looking for a more comprehensive understanding of angle brackets in Typescript, and this question provides information on more uses for angle brackets: stackoverflow.com/a/37369249/6691051 – Toivo Säwén Dec 19 '19 at 11:16

add a comment

2 Answers

ActiveOldestVotes72

That's called Type Assertion or casting.

These are the same:

let square = <Square>{};
let square = {} as Square;

Example:

interface Props {
    x: number;
    y: number;
    name: string;
}

let a = {};
a.x = 3; // error: Property 'x' does not exist on type `{}`

So you can do:

let a = {} as Props;
a.x = 3;

Or:

let a = <Props> {};

Which will do the same