活字体3.7の主な機能を説明しました
3.7は、いくつかの重要な特徴を持っているため、バージョン3.7にアップグレードするTsの理由は、開発効率を向上させることができます
オプションのチェーン
以下のための使用？。演算子オプションの属性のアクセス
let x = foo?.bar.baz();FOO、計算foo.bar.baz（）を定義した場合、fooがnullまたは未定義の場合、プログラムは停止してのみ不定戻ります。以下の文言上の同等のコード：
let x = (foo === null || foo === undefined) ?
undefined :
foo.bar.baz();バーがnullまたは未定義の場合はバズにアクセスする際に、我々のコードはまだエラーになることに注意してください。バズがnullまたは未定義の場合、我々が呼ぶとき同様、関数がエラーになります。？。左側のみにその値をチェックし、後続のプロパティをチェックせず、nullまたは未定義です。
あなたはまた、コードが多くの中間的な性質を使用しています？使用できる&&オペレータが行うチェック。
// 之前
if (foo && foo.bar && foo.bar.baz) {
// ...
}
// 之后
if (foo?.bar?.baz) {
// ...
}鎖は、任意に他の二つの操作を含みます。最初のオプション属性のアクセスのように作用する任意の要素へのアクセスが、私たちは非識別子属性（例えば、任意の文字列、数字、記号）へのアクセスを可能にします。
/**
* 当我们有一个数组时，返回它的第一个元素
* 否则返回 undefined。
*/
function tryGetFirstElement<T>(arr?: T[]) {
return arr?.[0];
// 等效：
// return (arr === null || arr === undefined) ?
// undefined :
// arr[0];
}別の方法としては、式がnullまたはundefinedでない場合、我々は条件付きでそれらを呼び出すことができます、と呼ばれています。
async function makeRequest(url: string, log?: (msg: string) => void) {
log?.(`Request started at ${new Date().toISOString()}`);
// 等效：
// if (log !== null && log !== undefined) {
// log(`Request started at ${new Date().toISOString()}`);
// }
const result = (await fetch(url)).json();
log?.(`Request finished at at ${new Date().toISOString()}`);
return result;
}ヌル合併
??はnull合体演算子として使用します
例えば：
let x = foo ?? bar();この新しいアプローチは、「現在」値FOOを表すために使用されている、それがある場合、それはnullに計算又はその位置バーに定義されていません（）。
同様に、上記のコードは、次の文言と等価です。
let x = (foo !== null && foo !== undefined) ?
foo :
bar();デフォルト値を使用しようとすると、オペレータは?? ||を交換することができます。例えば、次のコード断片の試みは、最後の（これまでに保存した場合）、ローカルストレージに保存されたボリューム値を得るために、それは||を使用するため、エラーからです。
function initializeAudio() {
let volume = localStorage.volume || 0.5
// ...
}LocalStorage.volume 0に設定し、ページ0.5への予期せぬボリューム。?? 0は、NaN、および「いくつかの予期しない動作」を避けることができます偽の値として扱われます。
特別な注意
3.7.2 typescriptですが導入されて以来、報告します/要素-UI /種類/ cascader.d.ts A node_modules型チェック
のファイルを見つけ、ファイル内のエラーを、
import { CascaderOption, CascaderProps, CascaderNode } from './cascader-panel';前の行を追加します。
// @ts-ignore