在ts文件中引入js模块编写声明文件的写法示例

 更新时间:2023年08月29日 09:25:29   作者:z1625000762  
这篇文章主要给大家介绍了关于在ts文件中引入js模块编写声明文件的写法示例,TypeScript是JavaScript的超集,TypeScript会进类型检查,需要的朋友可以参考下

 一、声明文件的作用

在ts文件中引入js文件,由于js代码中没有类型约束,所以ts无法获得js代码的类型信息,进而会隐式推断js中类型为any,失去了ts代码类型推断和约束的作用,声明文件就是将一个js模块中所有对外暴露的变量、函数、类使用ts语法进行类型声明,进而让ts编译器在检测到该声明文件之后(只要被检测到写在哪都可以)就可以获取js文件中对应变量、函数、类的类型信息

二、声明文件的写法

1、需要导入的*.js代码

/*test.js*/
//导出变量
export const test1 = '变量'
//导出函数
export function test2(name){
    return name
}
//导出类
export class Test3{
    name='类'
    constructor(){
        console.log(this.name);
    }
}

2、js代码的*.d.ts声明代码

/*test.d.ts*/
//声明模块(被匹配的文件都属于该模块)
declare module '*/test.js'{
    //声明变量类型
    export const test1:string
    //声明函数类型
    export function test2(name:string):string
    //声明class接口
    interface Tests{
        name:string
        //new()代表构造函数
        new():Tests
    }
    //声明class类型
    export const Test:Tests;
}

3、引入ts文件

/*test.ts*/
import { test1,test2,Test } from './test.js'
console.log(test1);
console.log(test2('函数'));
new Test()

4、运行结果

三、声明文件的配置

声明文件必须被ts检索到,如果声明文件不生效需要到tsconfig.json文件中添加

{
  "include": ["*/*.ts"] //需要检索的文件位置
}

详细内容:
介绍 · 声明文件 · TypeScript中文网 · TypeScript——JavaScript的超集 

总结

到此这篇关于在ts文件中引入js模块编写声明文件的文章就介绍到这了,更多相关ts引入js模块编写声明文件内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 前端JS可视化学习利用向量判断多边形边界

    前端JS可视化学习利用向量判断多边形边界

    这篇文章主要为大家介绍了前端JS可视化学习利用向量判断多边形边界示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-12-12
  • JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面

    JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面

    这篇文章主要介绍了JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面的代码,代码比较简单,好理解,需要的朋友可以参考下
    2016-08-08
  • js中replace的用法总结

    js中replace的用法总结

    本篇文章主要是对js中replace的用法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 详解MVC如何使用开源分页插件(shenniu.pager.js)

    详解MVC如何使用开源分页插件(shenniu.pager.js)

    本文主要分享了shenniu.pager.js整个插件内容,不多且清晰。具有很好的参考价值,需要的朋友一起来看下吧
    2016-12-12
  • 解读Bootstrap v4 sass设计

    解读Bootstrap v4 sass设计

    这篇文章主要介绍了Bootstrap v4 sass设计的相关资料,需要的朋友可以参考下
    2016-05-05
  • Javascript中的Callback方法浅析

    Javascript中的Callback方法浅析

    这篇文章主要介绍了Javascript中的Callback方法浅析,本文讲解了什么是callback、Javscript Callback、Callback是什么、Callback实例等内容,需要的朋友可以参考下
    2015-03-03
  • js中的事件捕捉模型与冒泡模型实例分析

    js中的事件捕捉模型与冒泡模型实例分析

    这篇文章主要介绍了js中的事件捕捉模型与冒泡模型,实例分析了js事件的执行顺序与冒泡模型的原理,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • 用JavaScript获取页面文档内容的实现代码

    用JavaScript获取页面文档内容的实现代码

    下面小编就为大家带来一篇用JavaScript获取页面文档内容的实现代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 小程序实现简单语音聊天的示例代码

    小程序实现简单语音聊天的示例代码

    这篇文章主要介绍了小程序实现简单语音聊天的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-07-07
  • 图文详解Javascript中的上下文和作用域

    图文详解Javascript中的上下文和作用域

    这篇文章通过图文详细的给大家介绍了关于Javascript中的上下文与作用域背后的机制,主要涉及到执行上下文(execution context)、作用域链(scope chain)、闭包(closure)、this等概念。需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-02-02

最新评论