vue3.0 + typescript 变量基本类型及使用介绍
基本类型布尔值let a: boolean = false // 也只能将boolean类型的值赋值给a数字let a: number = 1// 也只能将number 类型的值赋值给a// 和JavaScript一样,TypeScript里的所有数字都是浮点数。 这些浮点数的类型是 number。// 除了支持十进制和十六进制字面量,TypeScript还支持ECMAScript 2015中引入
·
基本类型
布尔值
let a: boolean = false // 也只能将boolean类型的值赋值给a
数字
let a: number = 1 // 也只能将number 类型的值赋值给a
// 和JavaScript一样,TypeScript里的所有数字都是浮点数。 这些浮点数的类型是 number。
// 除了支持十进制和十六进制字面量,TypeScript还支持ECMAScript 2015中引入的二进制和八进制字面量。
let b: number = 6;
let c: number = 0xf00d;
let d: number = 0b1010;
let e: number = 0o744;
// 当然js有一句万物皆对象,这里也可以,官网介绍,但我在vue中用不了,估计时严格模式或者其他吧
let f: object = 555
字符串
let a: string = 'a'
let b: string = 'a' + 'b'
let c: string = `${b} good` // 也支持模板字符串写法
数组
let arr: number[] = [1, 2, 3] // 里面只能含有数字
let arr1: Array<number> = [1, 2, 3] // 同上
let arr2: [string, number] = ['1', 1] // 固定内容格式
// let arr2: [string, number] = ['1', 1, 0] ,这种方式其中严格按照[]内的格式来,多了少了不行
// 这样有时就会用起来不是很方便,所以在不确定其中的内容格式时用any定义可以随便写
let arr3:any [] = [{ a: 1, b: 'b' }] // 其他方式换成any即可
object
let a: object = { b: 1 }
// 在vue的函数内只能对a进行赋值,其中的属性时不能用的
change () {
console.log(this.a.b) //这里会提示报错,读取不到a中的属性b
}
// 但是在标签上时可以用的,正常显示
<span>{{ a.b }}</span>
any
// any可定义任何类型,任何类型的值也可以赋值给any
let a: any = 2
let b: any = '3'
a = b;(a : '3')
void:
// 类型为void时只能设置为undefinde,官网说的还以为null,我试了不行
// 并且其他类型的值也不能赋给a8(除了any类型)
let a1: number = 2
let a2: any = 0
let a8: void = undefined
a8 = a1;(error)
a8 = a2;(a8 : 0)
示例
<script lang='ts'>
import { Vue } from 'vue-class-component'
export default class Installation extends Vue {
// arr: Array<number> = [1, 2, 3]
arr: number[] = [1, 2, 3]
arr1: Array<number> = [1, 2, 3]
arr2: [string, number] = ['1', 1]
a2 : number = 0
a3: boolean = false
a4: string = 'a4'
a5: object = {
b: 1,
c: '2',
d: false,
e: null
}
a6: null = null
a7: undefined = undefined
// 类型为void时只能设置为undefinde,官网说的还以为null,我试了不行
// 并且其他类型的值也不能赋给a8(除了any类型),例:this.a8 = '1'
a8: void = undefined
a9: any = '123'
a10: number = (this.a9 as string).length
a11: number = (<string>this.a4).length
install () :void {
// this.a2 = this.a5.b
for (let i in this.a5) {
console.log(this.a5[i]) // 这种循环是可以取到a5 中的属性的
}
this.a5.c = 5
console.warn('very good')
this.a5 = { d: 2}
// console.log(this.a5.b),这里会报错this.a5中没有b属性
}
}
</script>
更多推荐
已为社区贡献8条内容
所有评论(0)