ホームページ ウェブフロントエンド jsチュートリアル JSプロトタイプ継承とクラス継承を簡単に分析_基礎知識

JSプロトタイプ継承とクラス継承を簡単に分析_基礎知識

May 16, 2016 pm 03:06 PM
js 親切 継承する

まず JS クラスの継承を見てみましょう

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
    <title>JS类的继承</title>
</head>

<body>
  /* -- 类式继承 -- */
  <script type="text/javascript">
  //先声明一个超类
  var Animal = function(name) {
      this.name = name;
    }
    //给这个超类的原型对象上添加方法
  Animal.prototype.Eat = function() {
    console.log(this.name + " Eat");
  };
  //实例化这个超
  var a = new Animal("Animal");

  //再创建构造函数对象类
  var Cat = function(name, sex) {
      //这个类中要调用超类Animal的构造函数,并将参数name传给它
      Animal.call(this, name);
      this.sex = sex;
    }
    //这个子类的原型对象等于超类的实例
  Cat.prototype = new Animal();
  //因为子类的原型对象等于超类的实例,所以prototype.constructor这个方法也等于超类构造函数

  console.log(Cat.prototype.constructor);
  //这个是Animal超类的引用,所以要从新赋值为自己本身
  Cat.prototype.constructor = Cat;
  console.log(Cat.prototype.constructor);
  //子类本身添加了getSex 方法
  Cat.prototype.getSex = function() {
      return this.sex;
    }
    //实例化这个子类
  var _m = new Cat('cat', 'male');
  //自身的方法
  console.log(_m.getSex()); //male
  //继承超类的方法
  console.log(_m.Eat()); //cat
  </script>
</body>

</html>
ログイン後にコピー

JS プロトタイプの継承を見てみましょう

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <title>JS原型继承</title>
</head>

<body>
  <!--原型继承-->
  <script type="text/javascript">
  //clone()函数用来创建新的类Person对象
  var clone = function(obj) {
    var _f = function() {};
    //这句是原型式继承最核心的地方,函数的原型对象为对象字面量
    _f.prototype = obj;
    return new _f;
  }

  //先声明一个对象字面量
  var Animal = {
      somthing: 'apple',
      eat: function() {
        console.log("eat " + this.somthing);
      }
    }
    //不需要定义一个Person的子类,只要执行一次克隆即可
  var Cat = clone(Animal);
  //可以直接获得Person提供的默认值,也可以添加或者修改属性和方法
  console.log(Cat.eat());
  Cat.somthing = 'orange';
  console.log(Cat.eat());

  //声明子类,执行一次克隆即可
  var Someone = clone(Cat);
  </script>
</body>

</html>
ログイン後にコピー

JS クラスの継承 Children.constructor==father は true を返しますが、プロトタイプの継承 Children.constructor==father は false;

上記の JS プロトタイプ継承とクラス継承の簡単な分析は、エディターが共有したすべての内容です。参考にしていただければ幸いです。また、Script Home をさらにサポートしていただければ幸いです。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

C++関数継承の詳しい解説:継承で「基底クラスポインタ」と「派生クラスポインタ」を使うには? C++関数継承の詳しい解説:継承で「基底クラスポインタ」と「派生クラスポインタ」を使うには? May 01, 2024 pm 10:27 PM

関数の継承では、「基底クラス ポインター」と「派生クラス ポインター」を使用して継承メカニズムを理解します。基底クラス ポインターが派生クラス オブジェクトを指す場合、上方変換が実行され、基底クラスのメンバーのみにアクセスされます。派生クラス ポインターが基本クラス オブジェクトを指す場合、下向きキャストが実行される (安全ではない) ため、注意して使用する必要があります。

推奨: 優れた JS オープンソースの顔検出および認識プロジェクト 推奨: 優れた JS オープンソースの顔検出および認識プロジェクト Apr 03, 2024 am 11:55 AM

顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネット アプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワーク インタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザー エクスペリエンスが向上することが挙げられます。欠点としては、モデル サイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピューター ビジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。

継承とポリモーフィズムは C++ のクラス結合にどのような影響を与えますか? 継承とポリモーフィズムは C++ のクラス結合にどのような影響を与えますか? Jun 05, 2024 pm 02:33 PM

継承とポリモーフィズムはクラスの結合に影響します。派生クラスは基本クラスに依存するため、継承により結合が増加します。ポリモーフィズムにより、オブジェクトは仮想関数と基本クラス ポインターを通じて一貫した方法でメッセージに応答できるため、結合が軽減されます。ベスト プラクティスには、継承を控えめに使用すること、パブリック インターフェイスを定義すること、基本クラスへのデータ メンバーの追加を回避すること、依存関係の注入を通じてクラスを分離することが含まれます。ポリモーフィズムと依存性注入を使用して銀行口座アプリケーションの結合を軽減する方法を示す実践的な例。

C++ 関数の継承の詳細な説明: 継承のエラーをデバッグするには? C++ 関数の継承の詳細な説明: 継承のエラーをデバッグするには? May 02, 2024 am 09:54 AM

継承エラーのデバッグのヒント: 正しい継承関係を確認します。デバッガーを使用してコードをステップ実行し、変数値を調べます。仮想修飾子を正しく使用してください。隠れた相続によって引き起こされる相続ダイアモンド問題を調べてください。抽象クラスに実装されていない純粋仮想関数がないか確認します。

jsとvueの関係 jsとvueの関係 Mar 11, 2024 pm 05:21 PM

js と vue の関係: 1. Web 開発の基礎としての JS、2. フロントエンド フレームワークとしての Vue.js の台頭、3. JS と Vue の補完関係、4. JS と Vue の実用化ビュー。

C++ 関数の継承の説明: 継承を使用すべきでないのはどのような場合ですか? C++ 関数の継承の説明: 継承を使用すべきでないのはどのような場合ですか? May 04, 2024 pm 12:18 PM

C++ 関数の継承は、次の状況では使用しないでください。 派生クラスが異なる実装を必要とする場合、異なる実装を持つ新しい関数を作成する必要があります。派生クラスが関数を必要としない場合は、空のクラスとして宣言するか、プライベートの未実装の基本クラス メンバー関数を使用して関数の継承を無効にする必要があります。関数が継承を必要としない場合は、コードの再利用を実現するために他のメカニズム (テンプレートなど) を使用する必要があります。

JSのAI時代が到来! JSのAI時代が到来! Apr 08, 2024 am 09:10 AM

JS-Torch の概要 JS-Torch は、構文が PyTorch に非常に似ている深層学習 JavaScript ライブラリです。これには、完全に機能するテンソル オブジェクト (追跡された勾配で使用可能)、深層学習レイヤーと関数、および自動微分エンジンが含まれています。 JS-Torch は JavaScript での深層学習の研究に適しており、深層学習の開発を加速するための便利なツールや機能を多数提供します。 Image PyTorch は、Meta の研究チームによって開発および保守されているオープンソースの深層学習フレームワークです。ニューラル ネットワーク モデルを構築およびトレーニングするための豊富なツールとライブラリのセットを提供します。 PyTorch は、シンプル、柔軟、そして使いやすいように設計されており、その動的な計算グラフ機能により、

C++ 関数の継承の詳細な説明: 継承における 'is-a' と 'has-a' の関係を理解するには? C++ 関数の継承の詳細な説明: 継承における 'is-a' と 'has-a' の関係を理解するには? May 02, 2024 am 08:18 AM

C++の関数継承を詳しく解説:「is-a」と「has-a」の関係をマスターしよう 関数継承とは?関数の継承は、派生クラスで定義されたメソッドを基本クラスで定義されたメソッドに関連付ける C++ の手法です。これにより、派生クラスが基本クラスのメソッドにアクセスしてオーバーライドできるようになり、基本クラスの機能が拡張されます。 「is-a」および「has-a」関係 関数継承では、「is-a」関係は、派生クラスが基本クラスのサブタイプであること、つまり、派生クラスが基本クラスの特性と動作を「継承」することを意味します。基本クラス。 「has-a」関係は、派生クラスに基本クラス オブジェクトへの参照またはポインターが含まれていること、つまり、派生クラスが基本クラス オブジェクトを「所有」していることを意味します。構文関数継承を実装する方法の構文は次のとおりです: classDerivedClass:pu

See all articles