プロトタイプ、__ proto__、コンストラクター、およびそれらのチェーンを写真で扱います
JavaScriptコードがあります:
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
var A = function ( ) { } ; A. prototype . b = 100 ; var a = new A ( ) ; A. prototype . c = 101 ; a. c = - 100 ; A. prototype = { } ; A. prototype . b = 536 ; /* 1 */ console. log ( a.__proto__. constructor . prototype . b === 536 ) ; var b = new A ( ) ; /* 2 */ console. log ( a.__proto__.__proto__. constructor === a.__proto__. constructor . prototype . constructor ) ; /* 3 */ console. log ( b instanceof A ) ; /* 4 */ console. log ( ! ( a instanceof Object ) ) ;
質問 式1〜4は何を返し、その理由は何ですか
答えるのが難しい?
次に、カットの下に行く必要があります;-)(次の600 Kbの
大きな画像)
そのため、このトピックに興味のある多くの人がjavascriptのマニュアルやスマートブックを一度も読んだことがあると思いますが、頭の中では、言語の疑似OO(つまりプロトタイプベース)部分の基本を無視することはできません。 この記事では、乾燥した事実やマニュアルは見つかりません。レビューを
読んだ後、すべてがシンプルで明確になります。
どんな回路?図の右側は現在実行されているコードで、左側はオブジェクトの状態です。 黒い矢印-オブジェクトへのリンク。 矢印上のキャプション-参照によるプロパティの名前。 灰色の矢印-暗黙のプロパティ-プロトタイプのプロパティへのリンク。 グローバルjavascriptオブジェクトは赤でマークされています。 青い変数。 緑のローカルオブジェクト。 console.logsはすべてtrueを返します。
すべての画像はクリック可能です。リーフスルーすることはできませんが、ソース(png + bmml)をダウンロードします:
http ://narod.ru/disk/400270001/javascript_prototype.zip.html
スライド1

スライド2

スライド3

スライド4

スライド5

ソース(png + bmml):
http ://narod.ru/disk/400270001/javascript_prototype.zip.html
ソースコード:
pastebin.com/wBchEpxq私の記事がお役に立てば幸いです。また、図は明確です:)
PS __proto__プロパティはJavaScript 1.8.1から非推奨になりましたが、代わりにObject.getPrototypeOf(オブジェクト)を使用する価値がありますが、Crashが書いたように、CrockfordはgetPrototypeOfを使用しないように求めます。
Source: https://habr.com/ru/post/J108915/
All Articles