Constructor, prototype and inheritance

  • element.insertAdjacentHTML(position, text);
  • The tags can be read inside the string

Creating an Object

  • Literal creation
  • Constructor new Object ()
  • Custom Constructor

1, the constructor and prototype

  • Use declarative decision as a function of different constructor or an ordinary function
    • Declarative The constructor function used by the new
  • in the implementation of the new four things to do
    • Create a new empty object in memory.
    • Let this point to the new object.
    • Code inside the constructor is executed, the new object to add properties and methods.
    • Returns the new object (so inside the constructor does not need to return).

2, the constructor and prototype

  • A constructor is a special function, is mainly used to initialize the object, i.e. object member variables assigned an initial value, it is always used with new.

  • new made in the implementation of four things

      1. Open up a space in the memory space
      2. Let this point in this space
      3. The constructor is executed inside the code, to add a new object properties and methods
      4. Return the object

3, prototype prototype object constructor

  • It is a prototype object attribute is an attribute constructors, also referred to as the prototype prototype object
  • Role: sharing method, to save memory

4, object prototype proto

  • Read-only attribute

Each object has a prototype, it is to point to the prototype object prototype

5, constructor constructor

  • The main role may refer back to the original constructor

    // 使用对象方式添加方法要
    // 给设置一个指路的不然就都覆盖了,找不到构造函数了

6, the prototype chain

  • Role: provide a mechanism for members to find, or lookup rules

    • Each constructor has a property called prototype object, place the object in the prototype method, the constructor may generate a new new instance of the object, the prototype object has an instance, you may be directed to the object constructor prototype, the prototype object constructor directed by constructors while the prototype object can also be found on the prototype object level through the prototype, the largest is the Object prototype object, and then further on to find is null

    • When accessing an object's properties (including methods), first locate the object itself does not have this property.

      If you do not look for it on the prototype (ie prototype prototype object __proto__ points).

      If you do not find on the prototype object prototype (Object prototype object).

      Object and so on have been found so far (null).

      __Proto__ significance lies in the object prototype for the object members to find a mechanism to provide direction or route.

7, built-in object extension

Can be built to the original object by the method defined extends from the prototype object. For example, to add custom array of courtship and number of functions.

  • Array sum
  • Seeking maximum
  • Minimum
var arr = [1, 2, 3];
var arr1 = [23, 2, 5];
Array.prototype.sum = function (arr) {
  var sum = 0;
  arr.forEach(function (element, index) {
    sum += element;
  });
  return sum;
};

console.log(arr.sum);
console.log(arr.sum(arr));
console.log(arr1.sum(arr1));
console.log(Array.prototype);

8, inheritance

Before ES6 did not give us extends inheritance. + We can simulate inheritance through prototype object constructor is called inheritance combination.

  • Property inheritance

    • function Father(uname, age) {
        this.uname = uname;
        this.age = age;
      }
      function Son(uname, age, score) {
        Father.call(this, uname, age);
        this.score = score;
      }
      
      var obj = new Son('son', 18, 99);
      console.log(obj)
      console.log(obj.score);
      console.log(obj.uname);
  • call()

    • Call this function, and to modify this function is running point

    fun.call(thisArg, arg1, arg2, ...);

    • call the parent class is a subclass of this point

    • thisArg: the current call to an object of this function

    • arg1, arg2: Other parameters passed

Guess you like

Origin www.cnblogs.com/itxcr/p/11600181.html