テンプレートリテラルの展開時のエラーについて調べてみた

JavaScript で、テンプレートリテラルからエラーが投入される状況を確認してみました。

基本は、Node.js 8.10 LTS を使用しましたが、一部ChromeのJavaScriptでも確認しています。

結果として確認できたのは、下記2点。

定義済みオブジェクトの未定義キーを参照してもエラーにならない。
未定義変数や未定義オブジェクト（=undefined）のキーを参照するとエラー。

上記動作はJavaScript的に普通の動き。strictモードでも非strictモードでも同様です。「テンプレートリテラルだから」と特別なことはないようです。

以降、それぞれのケースを確認した結果です。

定義済みオブジェクトの未定義キーを参照する

定義済みオブジェクトの未定義キーを参照しても、エラーは投入されずundefinedと評価されます。

"use strict";
try {
    let foo = { bar:0 };
    console.log(`${foo.baz}`);//bazは未定義
    //出力＞undefined
} catch(err) {
    console.error(`${err.name}: ${err.message}`);
}

未定義変数を参照する

未定義の変数を参照すると、実行時エラーReferenceErrorが投入されます。

try {
    console.log(`${foo}`);//fooは未定義
} catch(err) {
    console.error(`${err.name}: ${err.message}`);
    //出力＞ReferenceError: foo is not defined
}

※ ブラウザでは以下のようにすればエラーになりません。ブラウザのJavaScriptのグローバル変数は window オブジェクトのキーとして定義されるためですね。

    console.log(`${window.foo}`);
    //出力＞undefined

未定義オブジェクトのキーを（無理やり）参照

未定義オブジェクト(=undefined)のキーを参照しようとするとTypeErrorが投入されます。

try {
    let foo = {};
    console.log(`${foo.bar.baz}`);//barが未定義
} catch(err) {
    console.error(`${err.name}: ${err.message}`);
    //出力＞TypeError: Cannot read property 'baz' of undefined
}

未定義の関数を呼び出す

定義済みオブジェクトの未定義のキーを関数呼び出しするとTypeErrorが投入されます。

try {
    let foo = { bar:0 };
    console.log(`${foo.baz()}`);//bazは未定義
} catch(err) {
    console.error(`${err.name}: ${err.message}`);
    //出力＞TypeError: foo.baz is not a function
}

関数以外を関数呼び出し

定義済みオブジェクトの関数でないメンバを呼び出そうとすると、TypeErrorが投入されます。

try {
    let foo = { bar:0 };
    console.log(`${foo.bar()}`);//barは関数ではない
} catch(err) {
    console.error(`${err.name}: ${err.message}`);
    //出力＞TypeError: foo.bar is not a function
}

KZ-WORKS