js での Object.create インスタンスの使用法の詳細な説明

js での Object.create インスタンスの使用法の詳細な説明

1. Object.create() メソッドを使用して新しいオブジェクトを作成し、既存のオブジェクトを使用して新しいオブジェクトの proto を提供します。

2. 2 つのパラメータを指定します。1 つ目は新しく作成されたプロトタイプ オブジェクトであり、2 つ目は新しく作成されたオブジェクトにプロパティを追加するオブジェクトです。

// 父オブジェクト let father = {
    名前: 「父」
    友人: ['アビー', 'ボブ']
}
 
// 新しいインスタンスオブジェクトchild1を生成する
子1 = Object.create(父) とします。
 
// 値タイプ属性を変更する child1.name = '変更された名前'
console.log(child1.name) // 変更された名前
 
// 参照型の値を変更する child1.friend.push('chely')
console.log(child1.friend) //[ 'アビー', 'ボブ', 'チェリー' ]
 
// 新しいインスタンスオブジェクトchild2を生成する
child2 = Object.create(father) とします。
console.log(child2.name) //父親
console.log(child2.friend) //[ 'アビー', 'ボブ', 'チェリー' ]

知識ポイントの拡張:

Object.create()はメソッドインスタンスを作成する

定数人 = {
  isHuman: 偽、
  printIntroduction: 関数() {
    console.log(`私の名前は${this.name}です。私は人間ですか? ${this.isHuman}`);
  }
};

const me = Object.create(人);

me.name = 'Matthew'; // "name" は "me" に設定されているプロパティですが、"person" には設定されていません
me.isHuman = true; // 継承されたプロパティは上書きできます

me.printIntroduction();
// 期待される出力: "私の名前はマシューです。私は人間ですか? true"

運用結果

> 「私の名前はマシューです。私は人間ですか?本当ですか?」

js の Object.create インスタンスの詳細な使用法に関するこの記事はこれで終わりです。js の Object.create メソッドの詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript オブジェクトを作成する新しい方法: Object.create()
  • JavaScript で Object.create() を使用してオブジェクトを作成する方法の紹介
  • JavaScript デザイン パターン プロトタイプ パターン (Object.create と prototype) の紹介

<<:  MySQL の遅いクエリを見つける方法

>>:  nginx proxy_pass 設定で URL が / で終わる場合と / なしで終わる場合の違いの詳細な説明

推薦する

MySQLでカーソルトリガーを使用する方法

カーソル選択クエリによって返される行のセットは、結果セットと呼ばれます。結果セット内の行は、入力した...

数千万のMySQLデータ量を素早くページ分割する方法

序文バックエンド開発では、一度に大量のデータがロードされ、メモリやディスク IO のオーバーヘッドが...

VMware ESXi 6.0 および仮想マシンのインストール チュートリアルの展開 (画像とテキスト)

社内には以前からアイドル状態だった、構成の整ったサーバーがあったので、EXSI 6.0 を使って複数...

MySQL ステートメントに一重引用符またはバックスラッシュを含む値を挿入する方法

序文この記事では主に、シングルクォートやバックスラッシュを含む値を挿入するMySQLステートメントに...

Angular 依存性注入の説明

目次概要1. 依存性注入2. Angularの依存性注入フレームワーク概要依存性注入: デザインパタ...

HTML フォーム コントロールの無効な属性の読み取り専用と無効の概要

HTML でフォームの送信を無効にする方法は 2 つあります。 1. コントロールタグにreadon...

基本的なウェブページパフォーマンス最適化ルールの簡単な概要

ブラウザのウェブページを最適化するためのいくつかのルールページの最適化静的リソース圧縮ビルド ツール...

MySQLの認可コマンド grant の使い方のまとめ

MySQL 認証コマンド grant の使用方法:この記事の例は MySQL 5.0 以降で実行され...

CSS の :focus-within の楽しさについて簡単に説明します

Bステーションでパスワードを入力するときに目を覆っているこの画像を見たことがある人もいると思いますこ...

MySQL がデフォルトの分離レベルとして繰り返し読み取りを選択する理由

目次Oracle 分離​​レベルMySQL 分離レベル要約する多くの読者は、MySQL のトランザク...

MySQLの比較演算子正規表現マッチングREGEXPの使用の詳細な説明

1. データを初期化する `test_01` が存在する場合はテーブルを削除します。 テーブル「te...

Vue3を使用してjsで呼び出せるコンポーネントを実装する

目次序文1. 従来のVueコンポーネント1. メインコンポーネントコード: 2. 使用方法3. 成果...

JS で async と await を使用する方法

目次1. 非同期2. 待つ: 3. 包括的なアプリケーション1. 非同期async 、非同期コードが...

MySQL 5.7.24 のインストールと設定方法のグラフィックチュートリアル

MySQL は最も人気のあるリレーショナル データベース管理システムです。WEB アプリケーションに...

Dockerでイメージ情報を表示する方法

この記事では、Dockerでイメージ情報を表示する方法を学ぶ必要があります。 1. imagesコマ...