Typescript1-基本语法

最新推荐文章于 2024-11-02 14:16:19 发布

2401_84152308

最新推荐文章于 2024-11-02 14:16:19 发布

阅读量237

点赞数 3

分类专栏：程序员文章标签： ubuntu linux 运维

本文链接：https://blog.csdn.net/2401_84152308/article/details/138483701

版权

程序员专栏收录该内容

186 篇文章 0 订阅

订阅专栏

let msg='typescript'

console.log(greeter(msg))

})()




1.  输出为hello typescript

2.  TypeScript 里的类型注解是一种轻量级的为函数或变量添加约束的方式

3.  在这个例子里，我们希望 greeter 函数接收一个字符串参数,如果是其他的会报错error TS2345: Argument of type ‘number\[\]’ is not assignable to parameter of type ‘string’



[]( )接口

---------------------------------------------------------------------



1.  接口是对象的状态(属性)和行为(方法)的抽象(描述)

2.  类的接口可理解为类型注解的集合

3.  类的接口可以理解为是一种能力一种约束

*类的接口是一种能力一种约束

( () => {

interface IPerson {

    fistName: String

    lastName: string

}

function showName(Person: IPerson){

    return Person.fistName + "_" + Person.lastName

}

const Person = {

    fistName: "东方",

    lastName: "不败"

}

console.log(showName(Person))

})()

//先编译后执行输出东方_不败




4.  接口属性



*   可选属性: ?

*   只读属性: readonly

interface IPerson{

readonly id: number

name: string

age?: number

}

class Person{

constructor(obj) {

    console.log(obj)

}

}

const person1: IPerson={

id: 1,

name:"jack",

age:20

}

const person2: IPerson={

id: 1,

name:"rose"

}

const p1 = new Person(person1)

// console.log(p1.id) 应为是只读所以不能操作

const p2 = new Person(person2)

输出
{ id: 1, name: ‘jack’, age: 20 }
{ id: 1, name: ‘rose’ }




[]( )类

====================================================================

(() => {

class User{

    firstName: string

    lastName: string

    showNmae: string

    constructor(firstName: string,lastName: string) {

        this.firstName=firstName

        this.lastName=lastName

        this.showNmae=this.firstName + " " + this.lastName

    }

}

interface Person{

    fistName:string

    lastName:string

}

function greeter (person: Person) {

return 'Hello, ' + person.firstName + ' ' + person.lastName

}

let user=new User("西门","吹雪")

console.log(greeter(user))

// hello，西门 吹雪

})()




1.  输出为西门-吹雪

2.  TypeScript 里的类只是一个语法糖，本质上还是 JavaScript 函数的实现



[]( )语法

=====================================================================



[]( )基本数据类型

-------------------------------------------------------------------------



1.  语法 let 变量名：数据类型 = 值

2.  布尔值

let isDone: boolean = false;

console.log(isDone = true)

// false




3.  数字JavaScript 一样，TypeScript 里的所有数字都是浮点数

let a1: number = 10 // 十进制

let a2: number = 0b1010 // 二进制

let a3: number = 0o12 // 八进制

let a4: number = 0xa // 十六进制




4.  字符串我们使用 string 表示文本数据类型。 和 JavaScript 一样，可以使用双引号（"）或单引号（'）表示字符串

let name:string = ‘tom’

name = ‘jack’

// name = 12 // error

let age:number = 12

const info = My name is ${name}, I am ${age} years old!

/*My name is jack, I am 12 years old!

*遵顼JS语法，可以和其他类型拼接




5.  undefined 和 null  

    这两个可以作为其他类型子类型，也就是说可以将他们赋给其他类型

let num: number = 100

num = null

console.log(num)

*输出null

*但注意得关闭严格模式，不然编译会报错 “strict”: false




6.  数组



*   在元素类型后面接上\[\]，表示由此类型元素组成的一个数组

let arr1: number[]=[1,4]




*   使用数组泛型，Array<元素类型>

let arr2: Array=[4,1]




7.  元组 Tuple



*   元组类型允许表示一个已知元素数量和类型的数组，各元素的类型不必相同

*   在定义数组的时候，类型和数据个数就确定了，注意位置顺序要保持一致

let t1: [string, number]

t1 = [‘hello’, 10]

console.log(t1[0].substring(0,2))

//he




8.  枚举



*   enum 类型是对 JavaScript 标准数据类型的一个补充

*   枚举类型中每一个数据值都可以叫做元素，每个元素都有自己的编号，默认从0开始

enum Color{

Red,

blue,

pink

}

let mycolor: Color=Color.pink

console.log(mycolor,Color.Red,Color.blue)

//输出2,0,1

console.log(Color[3])

//输出pink




9.  any



*   当我们遇到不确定类型时，可以使用any来存储

*   也就是说any可以存储任意类型

const any1: any= 123

any1 = “sting”

console.log(any1)

//输出sting




10.  void



*   某种程度上来说，void 类型像是与 any 类型相反，它表示没有任何类型

*   当一个函数没有返回值时，你通常会见到其返回值类型是 void

function showstr(): void(){

console.log("测试信息")

}

showstr()




11.  object



*   object 表示非原始类型，也就是除 number，string，boolean之外的类型

*   使用 object 类型，就可以更好的表示像 Object.create 这样的 API

function getObj(obj: object): object{

console.log(obj)

return {

    name:"jack",

    age:20

}

}

console.log(getObj({name:‘rose’,age:20}))

输出

*{ name: ‘rose’, age: 20 }

*{ name: ‘jack’, age: 20 }

getObj(new String(“tom”))

输出
tom表示可以时子类型数据




12.  联合类型  

#  最后

**自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。**

**深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。**

**因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。**

![img](https://img-blog.csdnimg.cn/img_convert/e9e618f88d7c01949072e29460d69fbf.jpeg)

![](https://img-blog.csdnimg.cn/img_convert/7897f95e77a6fe65ac351429d4afff79.png)

![](https://img-blog.csdnimg.cn/img_convert/fcd5d05f9cb92c9badf361251d9ec7fa.png)

**既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！**

[**如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！**](https://bbs.csdn.net/topics/618191877)

**由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！**
初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。**

**因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。**

[外链图片转存中...(img-VDz7ntaZ-1714959558213)]

[外链图片转存中...(img-3ZJB7zrK-1714959558214)]

[外链图片转存中...(img-trI8ltSI-1714959558214)]

**既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！**

[**如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！**](https://bbs.csdn.net/topics/618191877)

**由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！**