TypeScript中的问号 ? 与感叹号 ! 的含义
<h1><span style="font-size: 14pt; color: rgba(255, 0, 0, 1)">一、？（问号）操作符</span></h1><p><span style="font-size: 16px"> 在TypeScript里面，有4个地方会出现问号操作符，他们分别是：</span></p>
<h1><span style="font-size: 18px; color: rgba(255, 0, 255, 1)">1、三元运算符</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 当 isNumber(input) 为 True 是返回 ? : 之间的部分； isNumber(input) 为 False 时，返回 : ; 之间的部分</span>
const a = isNumber(input) ? input : String(input);</pre>
</div>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">2、参数</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 这里的 ？表示这个参数 field 是一个可选参数</span>
<span style="color: rgba(0, 0, 255, 1)">function</span> getUser(user: string, field?<span style="color: rgba(0, 0, 0, 1)">: string) { }</span></pre>
</div>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">3、成员</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 这里的？表示这个name属性有可能不存在</span>
<span style="color: rgba(0, 0, 0, 1)">class A {
name</span>?<span style="color: rgba(0, 0, 0, 1)">: string
}
interface B {
name</span>?<span style="color: rgba(0, 0, 0, 1)">: string
}</span></pre>
</div>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">4、安全链式调用</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 这里 Error对象定义的stack是可选参数，如果这样写的话编译器会提示</span><span style="color: rgba(0, 128, 0, 1)">
//</span><span style="color: rgba(0, 128, 0, 1)"> 出错 TS2532: Object is possibly 'undefined'.</span>
<span style="color: rgba(0, 0, 255, 1)">return</span> <span style="color: rgba(0, 0, 255, 1)">new</span> Error().stack.split('\n'<span style="color: rgba(0, 0, 0, 1)">);
</span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 我们可以添加?操作符，当stack属性存在时，调用 stack.split。若stack不存在，则返回空</span>
<span style="color: rgba(0, 0, 255, 1)">return</span> <span style="color: rgba(0, 0, 255, 1)">new</span> Error().stack?.split('\n'<span style="color: rgba(0, 0, 0, 1)">);
</span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 以上代码等同以下代码</span>
const err = <span style="color: rgba(0, 0, 255, 1)">new</span><span style="color: rgba(0, 0, 0, 1)"> Error();
</span><span style="color: rgba(0, 0, 255, 1)">return</span> err.stack && err.stack.split('\n');</pre>
</div>
<h1><span style="color: rgba(255, 0, 0, 1); font-size: 14pt">二、！（感叹号）操作符</span></h1>
<p><span style="font-size: 16px"> 在TypeScript里面有3个地方会出现感叹号操作符，他们分别是：</span></p>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">1、一元运算符</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> ! 就是将之后的结果取反，比如：</span><span style="color: rgba(0, 128, 0, 1)">
//</span><span style="color: rgba(0, 128, 0, 1)"> 当 isNumber(input) 为 True 时返回 False； isNumber(input) 为 False 时返回True</span>
const a = !isNumber(input);</pre>
</div>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">2、成员</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 因为接口B里面name被定义为可空的值，但是实际情况是不为空的，那么我们就可以</span><span style="color: rgba(0, 128, 0, 1)">
//</span><span style="color: rgba(0, 128, 0, 1)"> 通过在class里面使用！，重新强调了name这个不为空值</span>
<span style="color: rgba(0, 0, 0, 1)">class A implemented B {
name</span>!<span style="color: rgba(0, 0, 0, 1)">: string
}
interface B {
name</span>?<span style="color: rgba(0, 0, 0, 1)">: string
}</span></pre>
</div>
<h1><span style="color: rgba(255, 0, 255, 1); font-size: 18px">3、强制链式调用</span></h1>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 这里 Error对象定义的stack是可选参数，如果这样写的话编译器会提示</span><span style="color: rgba(0, 128, 0, 1)">
//</span><span style="color: rgba(0, 128, 0, 1)"> 出错 TS2532: Object is possibly 'undefined'.</span>
<span style="color: rgba(0, 0, 255, 1)">new</span> Error().stack.split('\n'<span style="color: rgba(0, 0, 0, 1)">);
</span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 我们确信这个字段100%出现，那么就可以添加！，强调这个字段一定存在</span>
<span style="color: rgba(0, 0, 255, 1)">new</span> Error().stack!.split('\n');</pre>
</div>
<p> </p><br><br>
来源：https://www.cnblogs.com/gg-qq/p/14649871.html
頁:
[1]