首页 > 软件开发 > JavaScript >

如何在TypeScript中定义接口并进行调用打印结果

来源:互联网 2023-03-16 23:59:03 版权归原作者所有,如有侵权,请联系我们

跟JavaScript ES6一样,TypeScript也有接口,使用关键字interface定义。在接口中,可以定义多个属性变量,变量:数据类型。下面利用实例说明如何定义接口,操作如下:mIV办公区 - 实用经验教程分享!

如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

工具/原料

  • TypeScript
  • JavaScript
  • HBuilder
  • HTML5
  • 浏览器
  • 截图工具

方法/步骤

  • 1

    第一步,打开HBuilder工具,新建一个TypeScript文件,并使用interface创建接口,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 2

    第二步,再在接口下方,定义函数searchInfo,传入user对象,打印user对象属性值,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 3

    第三步,使用let关键字定义变量obj,有name、age和sex属性,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 4

    第四步,然后调用第二步中的searchInfo方法,查看对应的打印结果,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 5

    第五步,运行这个TypeScript文件,结果生成一个同名的js文件,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 5本页面未经授权抓取自百度经验
  • 6

    第六步,将生成的js文件引入到刚刚创建的HTML5静态页面中,然后在浏览器查看打印结果,如下图所示:mIV办公区 - 实用经验教程分享!

    如何在TypeScript中定义接口并进行调用打印结果mIV办公区 - 实用经验教程分享!

  • 注意事项

    • 注意如何在TypeScript中定义接口的方法
    • 注意TypeScript定义变量的方法

    以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!mIV办公区 - 实用经验教程分享!


    标签: JAVASCRIPT

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号