Prototype and inheritance and class

Objects have properties (professional point called static properties) and methods (professional point called static methods) prototype and prototype properties and methods

image.png

In addition to the system comes with it millions of objects, write our own objects created in the js, custom objects, all from the object constructor, a function used to construct the object, called constructors, es6 the class is constructed function is a syntactic sugar, still incomplete syntactic sugar

// 写一个完整的构造函数
// 构造函数的name一般首字母大写,为了好认
function User(name){
   // 静态属性
   this.name = name;
   // 静态方法
   this.say = function(){ ... }
}
// 原型对象
User.prototype = {
   //原型属性
   prototypeName: "proName",
   //原型方法
   prototypeSay: function(){ ... }
}
// 构造函数的私有属性
User.aa = "aa"
// 构造函数的私有方法
User.bb= function(){ ... }
class User{
  constructor(name) {
    //原型属性
    this.name = name;
    //原型方法
    this.say = function(){ ... }
  }
  //原型方法,没有原型属性
  prototypeSay(){ ... },
  // 构造函数的私有属性
  static aa = "aa"
  // 构造函数的私有方法
  static bb = function(){ ... }
}

The constructor method of properties in order to be able to produce large quantities of the same, only different parameters pass through a few different properties of an object is constructed and the birth of the factory, and can be delivered or unlimited rewrite the constructor is the essence of the method through inheritance

Native inheritance There are six

image.png

But the front five have their own defects, directly on the code is the perfect way of inheritance parasitic combination
of several other search themselves, not to be confused

// 父函数SuperType
function SuperType(country) {
  this.country = country; 
  this.sayCountry = function() {
     console.log(this.country);
  }
}
// 父函数SuperType的原型方法
SuperType.prototype.proSay = function() {
  console.log(this.country);
}
// 子函数SuperType
function SubType(country,age) {
  SuperType.call(this,country);
  this.age = age;
}
// 核心代码,继承
function inheritPrototype(subType,SuperType) {
  var prototype = Object(SuperType); // 创建对象
  prototype.constructor = subType; // 增强对象
  subType.prototype = prototype; // 指定对象
}
// 继承方法执行,参数是(子,父) 
inheritPrototype(SubType,SuperType); 

// 继承完成后
// 子函数添加原型对象
SubType.prototype.sayAge = function() {   
  console.log(this.age);
}
var a = new SuperType("中国")
var b = new SubType("中华",18)

class syntactic sugar

class SuperType{
  constructor(country) {
    this.country = country;
    this.sayCountry = function(){}
  }
  proSay(){  },
}

class SubType extend SuperType{
  constructor(age) {
    super();
    this.age = age;
  }
  sayAge(){  },
}
var a = new SuperType("中国")
var b = new SubType("中华",18)

== inheritance success is that the new method is a method Functions parent function, no parent function == Functions of
the above two written printed below, the requirements are in line to inherit

image.png

Prototype chain to
first on a map, no answer regarding succession on the map, this map can be seen year

image.png

Analysis is not to say, you need to understand yourself, talk about a few theories
of an object __proto__ property equal prototype object constructor object of
the above said, this property / object, his constructorproperty and constructor pointing to the ability
of all of the function __proto__ point prototype Function, including Function themselves, this is a ring

A face questions
asked:
C constructor inherited constructors B, B constructor inherited constructor A, ask how come the prototype chain C null
answer:
prototype prototype of the prototype of the successor of the time ... until the prototype is underfind described function prototypes to the end, to the Object layer i.e., time taken __proto __ (i.e. the __proto__ Object of the prototype), then take __proto__ layer is null (end)

First, the chicken-and-egg
this is new there are function-or-object problem, functions are objects, objects by function new out, this is a nested relationship, but the program is definitely an end, and that in the end is the first the chicken or the egg

I found two answers to
answer a
the conventional Object.prototype, Object.prototype constructed Function.prototype, then Function.prototype construct Object and Function.
Object.prototype chicken, Object, and Function are eggs.

The second was
a function function is the object, all functions are constructed of Function This function object. Function is the top of the constructors. It is configured in the system for all the objects, including user-defined object, the system built-in objects, even including its own. This also shows that have held Function Self (own ability to construct your own). It also indirectly determines the same Function of the call and constructor logic. Each object has a constructor property that points to create a function object is the same.

I also believe that the second answer

new principles, a new simulation

function new(func) {
   let target = new Object();
   target.__proto__ = func.prototype;
   let res = func.call(target);
   if (res && typeof(res) == "object" || typeof(res) == "function") {
    return res;
   }
   return target;
}

Guess you like

Origin www.cnblogs.com/pengdt/p/12037973.html