JS基础知识整理 —— 原型

原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。

//Person.prototype  ---- 原型
//Person.prototype = {} 在Person初始创建时就有了，是Person创建对象的祖先，里面的属性和方法可以供后代继承

Person.prototype.name = 'hehe';
function Person() {
    
}

var person = new Person();       
var person1 = new Person();       
// person ==> Person(){}
person.name; //'hehe';
person1.name; //'hehe';
--------------------------------------
Person.prototype.LastName = 'Liu';
Person.prototype.say = function () {
    console.log('hehe');
}
function Person(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
var person = new Person('zz', 1, 'male');
person.name; //zz
person.LastName; //Liu

Car.prototype.carName = 'BMW';
Car.prototype.height = 1400;
function Car(color, owner) {
    this.color = color;
    this.owner = owner;
}
var car = new Car('red', 'zz');
var car1 = new Car('green', 'xx');
或：
Car.prototype = {
    carName :  'BMW',
    height:  1400
}
function Car(color, owner) {
    this.color = color;
    this.owner = owner;
}
var car = new Car('red', 'zz');
var car1 = new Car('green', 'xx');

Person.prototype.xx = xxxx;（增、改）
Person.prototype.xx（查）
delete Person.prototype.xx（删），通过子孙是不能删除的，只能通过自己删

function Car() {}
var car = new Car();
car.__proto__; //返回的就是跟原型prototype一样，即等价于Car.prototype

__proto__属性哪里来的呢？
实际上是构造函数三段式里面，第一步定义var this = {}里面隐式添加的，即
var this = {
    __proto__: Car.prototype
}
所以__proto__是构造函数Person里面隐式定义的属性，属性值其实就是原型Car.prototype

当查找对象car的属性xx时，如果自己没有xx，就会沿着__proto__这个属性去找原型里面是否有xx属性

通过__proto__查找原型，但是也是可以被修改的，如下：
Person.prototype.name = 'xx';
function Person() {
    // var this = {
    //     __proto__ : Person.prototype
    // }
}
var obj = {
    name: 'aa'
};
var person = new Person();
person.name; //xx
person.__proto__ = obj;
person.name; //aa;

function Car() {}
var car = new Car();
car.constructor; //function Car(){}，constructor会返回构造car对象的这个构造函数，即function Car(){}。而constructor不是自己的属性，而是原型prototype的属性
Car.prototype; // 打印出来，其中有一个属性就是隐式给出的constructor，但是我们可以手动更改，就跟原型的修改一样的

function Person() {}
function Car() {}
var car = new Car();
Car.prototype = {
    constructor : Person
}
car.constructor; //function Car() {}
上面Car.prototype里面的constructor写在下面的时候，是修改了，但是car.constructor访问的时候还是function Car(){}
如果换下编写的顺序，换成下面的执行就会不一样
function Person() {}
Car.prototype = {
    constructor : Person
}
function Car() {}
var car = new Car();
car.constructor; //function Car() {}

Person.prototype.name = 'sunny';
function Person() {}
var person = new Person();
Person.prototype.name = 'cherry';
person.name;  //cherry，自己没有name，访问的是它原型上面的name，而prototype.name经过修改了，所以访问的是改变后的name，即cherry


Person.prototype.name = 'sunny';
function Person() {}
Person.prototype.name = 'cherry';
var person = new Person();
person.name;  //cherry，自己没有name，访问的是它原型上面的name，而prototype.name经过修改了，不论放在前面都是一样的。所以访问的是改变后的name，即cherry


Person.prototype.name = 'sunny';
function Person() {}
var person = new Person();
Person.prototype = {
    name: 'cherry'
}
person.name; //sunny，访问的时候自己没有name，就会沿着__proto__查找原型，最开始函数构造时，即new的时候才是构造函数开始，第一步如下：

var this = {
    __proto__: Person.prototype
}
初始Person.prototype的name是sunny，只是后来他自己修改了，换成了cherry，但是__proto__指向的name还是sunny
所以访问person.name时，返回的是sunny


Person.prototype.name = 'sunny';
function Person() {}
Person.prototype = {
    name: 'cherry'
}
var person = new Person();
person.name; //cherry，在函数构造之前prototype的name已经修改了，所以此时返回的就是修改后的cherry