关于前端:typescript-小记

以前看ts就像天书,毕竟是习惯js的人,看ts的写法几乎有点过分,这是人干的事吗?
当初看ts, 真香. 变量谬误就会有提醒,函数谬误有提醒,值有谬误还有提醒,还不必刷新界面

来吧,一起入坑

首先,ts是须要下载才能够应用的
npm install -g typescript
文件名是ts结尾的,比方index.ts, 在react中组件文件会写成component.tsx
如果你想看index.ts编译后的js文件,执行 tsc index.ts,就会生成同名js文件,如果编辑器提醒变量反复的谬误,别怕, 删除生成的js文件即可. 因为编辑器同时辨认ts和js,就当成变量反复了

接下来 就开始欢快的嗒嗒嗒吧
我对ts的初步意识就是,这玩意就是在js的根底上给js加类型判断. 所有能加的中央都加, 申明变量能够加,申明函数能够加,函数的参数还能够加,函数的返回值也能加,类也能加,类的属性还能加. 只有你想不到,没有我加不了,来看几个简略的例子

let person:string = 'ren'
let howMany: number = 10
function hitPerson(x: string, y:number):void {
    console.log(x, y);
    
}
interface Ren {
    eye: number;
}
class You implements Ren{
    beatiful: boolean;
    eye: number;
}

在react的函数组件中应用(能够先本人查一下React.FC,此处不做介绍):

import React from 'react'

const Component: React.FC = () => {
    return (
        <>

        </>
    )
}

export default Component

看到这里,你根本就曾经能够用ts写代码了, 入门就是这么简略