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 が / で終わる場合と / なしで終わる場合の違いの詳細な説明

推薦する

layui をベースにしたログインページの実装

この記事の例では、ログインページを実装するためのlayuiの具体的なコードを参考までに共有しています...

mysql-5.7.21-winx64 無料インストール版のインストール - Windows チュートリアル詳細説明

1 ダウンロードアドレスは https://dev.mysql.com/downloads/mysq...

Elasticsearch を使用する際の一般的な問題の解決策

1. redis で使用すると Netty の起動競合が発生するため、***Application ...

TypeScript におけるジェネリックケースの詳細な説明

ジェネリックの定義 // 要件 1: ジェネリックは指定されていないデータ型をサポートできるため、渡...

W3C 検証に合格するにはどうすればいいですか?

W3C では、さまざまなタグの規定を設定するだけでなく、Web ページの作成者が実際に W3C 規...

Vue3 を使用してアップロード コンポーネントを実装するためのサンプル コード

目次一般的なアップロードコンポーネントの開発以下の機能を実装する必要がありますカスタムテンプレートサ...

JavaScriptの基礎を学ぶ

目次1. JavaScriptを記述する場所2. JavaScriptでよく使われる入力文と出力文1...

MySQL の組み込み関数 find_in_set を使用した効率的なあいまい検索の詳細な説明

一般的に使用される方法は次の 4 つです。 1.locate()メソッドを使用する一般的な使用法: ...

autoconfを使用してMakefileを生成し、プロジェクトをコンパイルする手順

序文Linux では、コンパイルとリンクには Makefile を使用する必要がありますが、適切な ...

js 正確な計算

var numA = 0.1; var numB = 0.2; アラート(numA + numB)...

異なるページ間のJavaScriptデータ転送(URLパラメータ取得)

Web ページでは、あるページに情報を入力すると、別のページにジャンプし、入力した情報が別のページ...

CentOS7でPHPスケジュールタスクを実行する方法

序文この記事は主に CentOS7 で PHP スケジュールタスクを実行することに関する関連コンテン...

Javascript クロージャの使用シナリオの原則の詳細

目次1. 終了2. クロージャの使用シナリオ1.タイムアウトを設定する2. コールバック3. 手ぶれ...

Baidu百科事典UIの開発動向について議論する

<br />百度百科事典の正式版がついにオンラインになりました。2年間の「テスト版」の帽...

見落としがちなVue.jsのAPIを詳しく解説

目次次のチェックv-model 構文シュガー.sync 修飾子$セット計算プロパティセット要約する次...