[解決済み] javascriptでクラスを継承する方法は?
2022-12-26 10:35:33
質問
PHP/Javaで、こんなことができます。
class Sub extends Base
{
}
そして、自動的にスーパークラスのすべてのパブリック/プロテクトされたメソッド、プロパティ、フィールドなどがサブクラスの一部となり、必要に応じてオーバーライドすることができます。
Javascriptでそれに相当するものは何ですか?
どのように解決するのですか?
私は今、この方法を変更しました。コンストラクタ関数とその
prototype
プロパティを使用しないようにしていますが、2010年からの古い回答はまだ一番下にあります。私は現在
Object.create()
.
Object.create
は、すべてのモダンブラウザで利用可能です。
注意すべきは
Object.create
は通常
より遅い
を使うより
new
を関数コンストラクタで使うよりも遅いです。
//The prototype is just an object when you use `Object.create()`
var Base = {};
//This is how you create an instance:
var baseInstance = Object.create(Base);
//If you want to inherit from "Base":
var subInstance = Object.create(Object.create(Base));
//Detect if subInstance is an instance of Base:
console.log(Base.isPrototypeOf(subInstance)); //True
Object.createを使う大きなメリットの1つは、オブジェクトに defineProperties 引数を渡すことができることです。これにより、クラスのプロパティにアクセスし、列挙する方法を大幅に制御できます。また、私はインスタンスを作成するために関数を使用していますが、これらはインスタンスを返すだけでなく、最後に初期化を行うことができるので、ある意味でコンストラクタとして役に立ちます。
var Base = {};
function createBase() {
return Object.create(Base, {
doSomething: {
value: function () {
console.log("Doing something");
},
},
});
}
var Sub = createBase();
function createSub() {
return Object.create(Sub, {
doSomethingElse: {
value: function () {
console.log("Doing something else");
},
},
});
}
var subInstance = createSub();
subInstance.doSomething(); //Logs "Doing something"
subInstance.doSomethingElse(); //Logs "Doing something else"
console.log(Base.isPrototypeOf(subInstance)); //Logs "true"
console.log(Sub.isPrototypeOf(subInstance)); //Logs "true
これは2010年の私のオリジナルの解答です。
function Base ( ) {
this.color = "blue";
}
function Sub ( ) {
}
Sub.prototype = new Base( );
Sub.prototype.showColor = function ( ) {
console.log( this.color );
}
var instance = new Sub ( );
instance.showColor( ); //"blue"
関連
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptで文字列が部分文字列を含むかどうかを確認する方法は?
-
[解決済み] あるJavaScriptファイルを他のJavaScriptファイルにインクルードするにはどうすればよいですか?
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み] なぜList<T>を継承しないのですか?
-
[解決済み] インターフェースと抽象クラス(一般的なOO)
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
-
[解決済み] Javascriptで動的に命名されたメソッドを呼び出すにはどうすればよいですか?
-
[解決済み] Fetch: ステータスがOKでない場合、プロミスを拒否し、エラーをキャッチするか?
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] JavaScriptにおける多重継承とプロトタイプ
-
[解決済み] プロトタイプ継承 - 執筆中 [重複].
-
[解決済み] 配列からオブジェクトを生成する
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] URL/アドレスバーからJavascriptの関数を呼び出す
-
[解決済み] AngularJS - ngRepeatフィルタリングされた結果の参照を取得する方法
-
[解決済み] Chromeの拡張機能開発にWebStormを使用するにはどうすればよいですか?
-
[解決済み] Prototypeを使ってtextareaを自動サイズ調整するには?
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
[解決済み] JavaScriptの文字列プリミティブとStringオブジェクトの違いは何ですか?