1. クラスクラスはオブジェクトを作成するためのテンプレートです。 関数 Point(x, y) { this.x = x; y = y; } Point.prototype.toString = 関数 () { '(' + this.x + ', ' + this.y + ')' を返します。 }; var p = 新しいポイント(1, 1);
次のように: クラス Point { コンストラクタ(x, y) { this.x = x; y = y; } 文字列を渡す '(' + this.x + ', ' + this.y + ')' を返します。 } } クラスのデータ型は関数であり、それ自体は関数を指すコンストラクターです。 // ES5 関数宣言 function Point() { //... } // ES6 クラス宣言 class Point { //.... コンストラクタ() { } } typeof Point // "関数" Point === Point.prototype.constructor // true クラスで定義されたメソッドは クラス Point { コンストラクタ(x, y) { this.x = x; y = y; } 文字列を渡す '(' + this.x + ', ' + this.y + ')' を返します。 } } ポイント.プロトタイプ = { //.... 文字列を変換する() } var p = 新しいポイント(1, 1); p.toString() // (1,1) クラスを定義する別の方法はクラス式を使うことである。 // 名前のない/匿名クラス let Point = class { コンストラクタ(x, y) { this.x = x; y = y; } }; Point.name // ポイント 関数宣言とクラス宣言には重要な違いがあります。関数宣言はホイストされますが、クラス宣言はホイストされません。 > let p = new Point(); // 昇格してもエラーは報告されません> function Point() {} > > let p = new Point(); // エラー、ReferenceError > クラス Point {} > 1.1 コンストラクタ() クラスには クラス Point { } // クラス Point を自動的に追加します { コンストラクタ() {} } 1.2 ゲッターとセッター
クラスユーザー{ コンストラクタ(名前) { this.name = 名前; } 名前を取得する() { this.name を返します。 } 名前(値)を設定する{ this.name = 値; } } 1.3 これクラス メソッド内の クラスユーザー{ コンストラクタ(名前) { this.name = 名前; } プリント名(){ console.log('名前は' + this.nameです) } } 定数ユーザー = 新しいユーザー('jack') user.printName() // 名前はjackです const { printName } = ユーザー; printName() // エラー 未定義のプロパティを読み取ることができません (読み取り 'name') エラーなしで個別に呼び出す場合、1 つの方法はコンストラクターで クラスユーザー{ コンストラクタ(名前) { this.name = 名前; this.printName = this.printName.bind(this); } プリント名(){ console.log('名前は' + this.nameです) } } 定数ユーザー = 新しいユーザー('jack') const { printName } = ユーザー; printName() // 名前はジャック
さらに、矢印関数内の this は常にそれが定義されているオブジェクトを参照するため、矢印関数を使用することもできます。 クラスユーザー{ コンストラクタ(名前) { this.name = 名前; } プリント名 = () => { console.log('名前は' + this.nameです) } } 定数ユーザー = 新しいユーザー('jack') const { printName } = ユーザー; printName() // 名前はジャック 1.4 静的プロパティ静的プロパティは、インスタンス オブジェクト クラスユーザー{ } ユーザー.prop = 1; ユーザー.prop // 1 1.5 静的メソッドクラス内に静的メソッドを定義できます。メソッドはオブジェクト インスタンスによって継承されず、クラスを通じて直接呼び出されます。 クラス Utils { 静的printInfo() { this.info(); } 静的情報() { コンソールにログ出力します。 } } Utils.printInfo() // こんにちは メソッドの呼び出しスコープの制限(private や public など)については、 2. 継承
継承する場合、サブクラスは クラスPoint3DはPointを拡張します{ コンストラクタ(x, y, z) { super(x, y); // 親クラスのコンストラクター(x, y)を呼び出す this.z = z; } 文字列を渡す return super.toString() + ' ' + this.z; // 親クラスのtoString()を呼び出す } } 親クラスの静的メソッドは子クラスにも継承されます。 クラス親{ 静的情報() { console.log('こんにちは世界'); } } クラスChildはParentを拡張します{ } Child.info() // こんにちは世界 2.1 スーパーキーワード
クラス 親 {} クラスChildはParentを拡張します{ コンストラクタ() { 素晴らしい(); } } サブクラスの通常のメソッドで クラス親{ コンストラクタ() { 1.x = 1; を出力します。 これ.y = 10 } 親を印刷する(){ コンソールにログ出力します。 } 印刷(){ コンソールにログ出力します。 } } クラスChildはParentを拡張します{ コンストラクタ() { 素晴らしい(); 2 を 0 にします。 } m() { スーパープリント(); } } c = new Child(); c.printParent() // 10 センチメートル() // 2 2.2 _proto_ とプロトタイプ初めて
以下はプロトタイプを持つ組み込みオブジェクトの一部です。 上記の説明に従って、次のコードを見てください var obj = {} // var obj = new Object() と同等 // obj.__proto__ は Object コンストラクタのプロトタイプを指します obj.__proto__ === Object.prototype // true // obj.toString は Object.prototype から継承されたメソッドを呼び出します obj.toString === obj.__proto__.toString // true // 配列 var arr = [] arr.__proto__ === Array.prototype // true
関数 Foo(){} var f = new Foo(); f.__proto__ === Foo.prototype // 真 Foo.__proto__ === Function.prototype // true 2.3 継承における__proto__コンストラクター関数の構文糖衣として、クラスには
クラス親{ } クラスChildはParentを拡張します{ } Child.__proto__ === Parent // true Child.prototype.__proto__ === Parent.prototype // true 2.4 継承されたインスタンス内の__proto__サブクラス インスタンスの サブクラス インスタンスの クラス親{ } クラスChildはParentを拡張します{ } var p = 新しい親(); var c = 新しい子(); c.__proto__ === p.__proto__ // 偽 c.__proto__ === Child.prototype // true c.__proto__.__proto__ === p.__proto__ // 真 3. まとめフロントエンド 以下もご興味があるかもしれません:
|
<<: docker を使用して Redis マスター/スレーブを構築する方法
序文MySQL 8.0.13 では、インデックス スキップ スキャン (インデックス ジャンプ スキ...
一般的な演算子と JavaScript の演算子の概要カテゴリオペレーター算術演算子+、–、*、/、...
序文リアルタイムのデータベース バックアップの必要性は非常に一般的です。MySQL 自体はレプリケー...
目次1. グローバルガード1.1 グローバルフロントガード1.2 グローバルポストルートガード1.3...
今回は、コンピューターや携帯電話用の rtmp ライブ ブロードキャスト サーバーを設定し、ライブ ...
最近、Linux に Aphace、mysql、php をインストールするときに多くの問題に遭遇しま...
目次新しいユーザーを作成する新規ユーザーを承認する新規ユーザーのSSHキーログインを有効にする他のS...
MySQL の多くのテーブルには、NULL が列のデフォルト属性であるため、アプリケーションが NU...
Docker をインストールし、Docker コアとインストールを通じて簡単な操作を実行できます。 ...
目次1. ユーザーが作成したスクリプト2. 単語当てゲーム3. ネットワークカードのトラフィック監視...
一般的な提案は、WHERE 条件のインデックスを作成することですが、これは実際には一方的です。インデ...
最近、次のデータ型のデータベースに遭遇しました:decimal(14,4)発生した問題は次のとおりで...
Keepalived のインストール: cd <keepalived_sourcecode_p...
1. Ubuntu Server 18.04.5 LTS システムのインストールUbuntuはデスク...
1. システム環境[root@localhost ホーム]# cat /etc/redhat-re...