Vue3+TypeScript从入门到精通系列之：接口

最笨的羊羊

已于 2022-02-10 21:52:29 修改

阅读量609

点赞数

分类专栏：日常分享专栏文章标签： typescript javascript 前端 Vue3 接口

于 2022-02-10 11:17:52 首次发布

本文链接：https://blog.csdn.net/zhengzaifeidelushang/article/details/122856829

版权

日常分享专栏专栏收录该内容

454 篇文章 74 订阅

订阅专栏

Vue3+TypeScript从入门到精通系列之：接口

一、TypeScript接口代码
二、TypeScript接口代码转化为Js代码
三、index.html引入js文件

一、TypeScript接口代码

(() => {
//定义一个接口
interface IPerson{
  firstName: string  //姓氏
  lastName: string   //名字
}

//输出姓名
function showFullName(Person: IPerson){
  return person.firstName + '_' + person.lastName
}

//定义一个对象
const person = {
  firstName: '东方'
  lastName: '不败'
}

console.log(showFullName(person)

})()

二、TypeScript接口代码转化为Js代码

(function () {
    //输出姓名
    function showFullName(Person) {
        return person.firstName + '_' + person.lastName;
    }
    //定义一个对象
    var person = {
        firstName: '东方',
        lastName: '不败'
    };
    console.log(showFullName(person));
})();

三、index.html引入js文件

<!--vue.html-->
<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>helloVuejs</title>
</head>
<body>
  <script src="./接口.js"></script>
</body>
</html>

最笨的羊羊

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
Vue3+TypeScript从入门到精通系列之：接口

Vue3+Typescript从入门到精通系列之：接口一、Typescript接口代码二、Typescript接口代码转化为Js代码三、index.html引入js文件一、Typescript接口代码(() => {//定义一个接口interface IPerson{ firstName: string //姓氏 lastName: string //名字}//输出姓名function showFullName(Person: IPerson){ return per
复制链接

扫一扫