使用TypeScript中的模塊進(jìn)行導(dǎo)入和導(dǎo)出并調(diào)用
在JavaScript新標(biāo)準(zhǔn)ES6中,我們已經(jīng)了解到了模塊的相關(guān)用法。在TypeScript中也有類似的模塊系統(tǒng),可以使用`export`將一個(gè)文件的參數(shù)和變量導(dǎo)出,在另一個(gè)文件中使用`import`
在JavaScript新標(biāo)準(zhǔn)ES6中,我們已經(jīng)了解到了模塊的相關(guān)用法。在TypeScript中也有類似的模塊系統(tǒng),可以使用`export`將一個(gè)文件的參數(shù)和變量導(dǎo)出,在另一個(gè)文件中使用`import`來(lái)引用這些導(dǎo)出的內(nèi)容。
示例操作步驟
1. 首先,在HBuilderX工具中創(chuàng)建一個(gè)新的TypeScript文件。在該文件中,使用`export default`導(dǎo)出一個(gè)字符串。示例代碼如下:
```typescript
export default 'Hello, world!';
```
2. 保存代碼,并使用TypeScript插件命令進(jìn)行編譯,生成對(duì)應(yīng)的JavaScript文件。示例代碼如下:
```shell
tsc yourfile.ts
```
3. 接下來(lái),在另一個(gè)TypeScript文件中,使用`import`導(dǎo)入第一步中導(dǎo)出的字符串,并打印它的值。示例代碼如下:
```typescript
import myString from './yourfile';
console.log(myString);
```
4. 再次保存代碼,并使用TypeScript命令進(jìn)行編譯。你將會(huì)看到生成的JavaScript文件。示例代碼如下:
```shell
tsc yourfile2.ts
```
5. 將生成的JavaScript文件引入到一個(gè)頁(yè)面中,然后在瀏覽器控制臺(tái)查看打印結(jié)果。示例代碼如下:
```html
```
6. 最后,在TypeScript中定義一個(gè)類`User`,并在其中定義一個(gè)構(gòu)造函數(shù)。然后,將這個(gè)類導(dǎo)出。示例代碼如下:
```typescript
export class User {
constructor(private name: string, private age: number) {}
getName(): string {
return ;
}
getAge(): number {
return ;
}
}
```
以上就是使用TypeScript中的模塊進(jìn)行導(dǎo)入和導(dǎo)出并調(diào)用的示例操作。通過(guò)這些步驟,你可以更好地理解并應(yīng)用TypeScript中的模塊功能。