プロトタイプチェーン(ノート)の引継ぎ

2929 ワード

JavaScriptオブジェクトはダイナミックな属性の「バッグ」です.JavaScriptオブジェクトにはプロトタイプのオブジェクトを指すチェーンがあります.オブジェクトの属性にアクセスしようとすると、そのオブジェクトだけでなく、オブジェクトのプロトタイプや、オブジェクトのプロトタイプのプロトタイプを検索して、名前にマッチする属性を見つけたり、プロトタイプチェーンの末尾に到達したりするまで順次上に検索します.
継承の方法
JavaScriptには他に類に基づく言語で定義された「方法」がありません.JavaScriptでは、どの関数もオブジェクトとしての属性に追加できます.関数の継承は、他の属性の継承とは異なりません.上記の「プロパティーカバー」を含めます.継承された関数が呼び出されると、thisは継承されている関数の元のオブジェクトではなく、現在のオブジェクトを指します.
var o = {
  a: 2,
  m: function(){
    return this.a + 1;
  }
};
console.log(o.m()); // 3
//     o.m  ,'this'   o.

var p = Object.create(o);
// p     , p.__proto__ o.

p.a = 12; //    p      a.
console.log(p.m()); // 13
//    p.m  , 'this'   p. 
//     p    o   m   
//    'this.a'   p.a,  p       'a'
普通の文法を使ってオブジェクトを作成します.
var o = {a: 1};

// o       Object.prototype       
//          o.hasOwnProperty('a').
// hasOwnProperty  Object.prototype     。
// Object.prototype    null。
//      :
// o ---> Object.prototype ---> null

var a = ["yo", "whadup", "?"];

//       Array.prototype 
// (indexOf, forEach           ).
//      :
// a ---> Array.prototype ---> Object.prototype ---> null

function f(){
  return 2;
}

//       Function.prototype
// (call, bind           ):
// f ---> Function.prototype ---> Object.prototype ---> null
コンストラクタを使ってオブジェクトを作成します.
JavaScriptでは、コンストラクタは実は普通の関数です.この関数がnewオペレータを用いて作用すると,構造法(構造関数)と呼ばれることができる.
function Graph() {
  this.vertices = [];
  this.edges = [];
}

Graph.prototype = {
  addVertex: function(v){
    this.vertices.push(v);
  }
};

var g = new Graph();
// g      ,       'vertices' 'edges'.
//  g     ,g.__proto__   Graph.prototype.
Object.creatを使ってオブジェクトを作成します.
ECMAScript 5には、Object.creat()という新しい方法が導入されています.この方法を呼び出して新しいオブジェクトを作成できます.新しいオブジェクトのプロトタイプは、createメソッドを呼び出した時に入ってきた最初のパラメータです.
var a = {a: 1}; 
// a ---> Object.prototype ---> null

var b = Object.create(a);
// b ---> a ---> Object.prototype ---> null
console.log(b.a); // 1 (    )

var c = Object.create(b);
// c ---> b ---> a ---> Object.prototype ---> null

var d = Object.create(null);
// d ---> null
console.log(d.hasOwnProperty); // undefined,   d    Object.prototype
クラスのキーワードを使う
ECMAScript 6はclassを実現するために新しいキーワードを導入しました.これらの構造については、クラス言語に基づいた開発者が熟知していますが、違います.JavaScriptはまだ原型に基づいています.これらの新しいキーワードはclass、constructor、static、extensとsuperを含みます.
"use strict";

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

class Square extends Polygon {
  constructor(sideLength) {
    super(sideLength, sideLength);
  }
  get area() {
    return this.height * this.width;
  }
  set sideLength(newLength) {
    this.height = newLength;
    this.width = newLength;
  }
}

var square = new Square(2);