[解決済み] ES6構文とBabelでJavascriptのエラーを拡張する
2022-06-03 16:49:03
質問
ES6とBabelでErrorを拡張しようとしています。それはうまくいきません。
class MyError extends Error {
constructor(m) {
super(m);
}
}
var error = new Error("ll");
var myerror = new MyError("ll");
console.log(error.message) //shows up correctly
console.log(myerror.message) //shows empty string
Errorオブジェクトは正しいメッセージが設定されることはありません。
さて、SOでいくつかの解決策を見かけました( たとえば、ここで ) が、それらはすべて非常にES6的でないように見えます。どうすれば、ES6的な方法でそれを行うことができるでしょうか?(それはBabelで動作しています)
どのように解決するのですか?
Karel Bílekの回答に基づいて、私なら小さな変更を
constructor
:
class ExtendableError extends Error {
constructor(message) {
super(message);
this.name = this.constructor.name;
if (typeof Error.captureStackTrace === 'function') {
Error.captureStackTrace(this, this.constructor);
} else {
this.stack = (new Error(message)).stack;
}
}
}
// now I can extend
class MyError extends ExtendableError {}
var myerror = new MyError("ll");
console.log(myerror.message);
console.log(myerror instanceof Error);
console.log(myerror.name);
console.log(myerror.stack);
これは、以下のように表示されます。
MyError
をスタックに表示し、一般的な
Error
.
また、Karel の例にはなかったエラーメッセージをスタックトレースに追加します。
また、この例では
captureStackTrace
も使用します。
Babel 6 では transform-builtin-extend ( npm ) で動作します。
関連
-
Javascript Bootstrapのグリッドシステム、ナビゲーションバー、ローテーションの説明
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptで要素のクラスを変更するにはどうすればよいですか?
-
[解決済み] 私のJavaScriptコードは "No 'Access-Control-Allow-Origin' header is present on requested resource "というエラーを受け取りますが、Postmanはそうならないのはなぜですか?
-
[解決済み] JavaScriptで2つの日付を比較する
-
[解決済み] JavaScriptでカンマを桁区切りにして数値を表示する方法
-
[解決済み] オブジェクトをメンバーとして、プレーンなJavaScriptオブジェクトをループさせる方法
-
[解決済み] jQueryでフォームデータをJavaScriptオブジェクトに変換する
-
[解決済み] テキストボックスのEnterキーで、JavaScriptでボタンクリックをトリガーする
-
[解決済み] JavaScript ES6クラスにおけるプライベートプロパティ
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vueの要素ツリーコントロールに破線を追加する説明
-
JSアレイループと効率解析の比較
-
vueディレクティブv-bindの使用と注意点
-
Vueの一般的な組み込みディレクティブの説明
-
[解決済み】Node.jsで "Cannot find module "エラーを解決するには?
-
[解決済み] 期待される代入または関数呼び出し: 未使用式なし ReactJS
-
[解決済み] TypeError: $.ajax(...) is not a function?
-
[解決済み】ReactJSでエラー発生 Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。
-
[解決済み】JavaScriptでカスタムErrorを作成する方法は?
-
[解決済み] ECMAScript 6 には抽象クラスに関する規約がありますか?重複