【typescript】特殊符号用法(?:)(??)(?.)(!)(!!)

一. 问号+冒号（?:）

1.可以作为对象类型的可选属性，如：

interface Person{
    name : string;
    age?: number;
}

const person1 : Person = {name:"zien"}
const person2 : Person = {name:"sad", age:18}
console.log("person1 = ", person1.name, person1.age)
console.log("person2 = ", person2.name, person2.age)

2.可以作为函数参数列表中的可选参数，如：

function persionFun(name : string, age ?: number){
    console.log("persionFun = ", name, age)
}

persionFun("clz", 13)
persionFun("sad")

上面两个例子的输出结果如下：

二.两个问号(??)

        判断变量是否为空，如果变量为空，用后面的默认值初始化对象。

const v1 = null
const v2 = 2

const v3 = v1 ?? 3
const v4 = v2 ?? 4

console.log("v3 = ", v3)
console.log("v4 = ", v4)

因为V1为空，所以用了默认值3来初始化对象V3
因为V2不为空，所以用V2的值2来初始化V4

3.问号+点(?.)

        对象不为空才调用对象的属性。如果对象为空则返回undefined。

function persion(data: any){
    console.log("persion = ", data?.name?.age)

    // 其实类似这种写法，判断了data和data.name有值才继续执行下去
    // if(data && data.name){
    //     console.log("persion = ", data?.name?.age)
    // }
}

输出结果undefined~ 如果把问号去掉，就会因为报错而导致程序终止执行了。

4.问好+冒号，分开（a?b:c）

其实就是普通的三目运算符。

const v1 = 1
const v2 = 2

const value = v1 > v2 ? "greater" : "less"

console.log("value = ", value)

5.感叹号（!）

        这个就是简单的对值取反，不详细说了……

6.两个感叹号(!!)

        把对象类型强行转换为布尔型。

const v1 = 0
const v2 = 1
console.log("v1 = ", !!v1)
console.log("v2 = ", !!v2)