JavaScript 原型对象（ Prototype ）

什么是原型（ Prototype ）？

Javascript规定，每一个函数都有一个 prototype 对象属性，指向另一个对象（原型链上面的）。

什么叫原型链？

顺着原型对象寻找对象的一条“链子”就叫做原型链：

function Person(name,age){
  this.name = name
  this.age = age;
}
let me = new Person("chao","9");
console.log(me.toString());

me.toStirng 是怎么来的呢？

在 me 里找 toString 方法
me 中显然没有，那么就去 me.__prote__ 里找
me.__proto__ 也没有，那就去 me.__proto__.__proto__里找
而 me.__proto__.__proto__下就有个 toString

可以看下 me 的结构

捕获.PNG

整个过程都围绕着 __proto__ 对象进行，所以叫原型链了（如果 num.__proto__.__proto 还没有，它将继续找到下一级的 __proto__ 直至找到 toString ）。

①__proto__ 属性是对象所独有的

② prototype 属性是函数所独有的（函数也是对象，所以也有 __proto__ ）。

不同其他编程语言，JavaScript 可以通过原型对象使得每个对象实例拥有共同的对象（方法、属性）。

我们用两种方法给一个对象添加方法：

构造函数添加：

function Person(name,age){
  this.name = name
  this.age = age;
  this.sayHello = ()=> console.log("Hello,my name is " + this.name);
}
let me = new Person("chao",9);
let tom = new Person("Tom",32);
console.log(tom.sayHello == me.sayHello);

原型添加：

function Person(name,age){
  this.name = name
  this.age = age;
}
//lambda 表达式获取不了 this （上面的例子中的 this 来自父作用域）
Person.prototype.sayHello = function(){console.log("Hello,my name is " + this.name)};
let me = new Person("chao",9);
let tom = new Person("Tom",32);
me.sayHello();

利用构造函数添加的输出 False 而原型添加的却是 True。可以推测，利用原型添加的对象于每个实例中都是相同的。

原型是 JavaScript 特有及优越之处。它可以有效地优化对象所占用的内存，因为每个方法都是共有的。

未标题-1.png

Prototype 中可以添加任何对象，然后通过 obj.any 访问该对象：

function Person(name,age){
  this.name = name
  this.age = age;
}
//添加 gender 属性
Person.prototype.gender = "未知";
//添加 sayHello 构造方法
Person.prototype.sayHello = (name) => console.log("Hello,my name is " + name);
//添加 Person 构造函数
Person.prototype.Constructor = Person;

let me = new Person("chao",9);

me.gender = "男";
console.log(me.gender);
me.sayHello(me.name);
let son = new me.Constructor("son","0");
console.log(son.name);

输出：

 男
 Hello,my name is chao
 son

感觉向 prototype 添加对象时应该设计成一个方法，如：Add(obj)。obj.prototype.any = o 有点不好理解。

当然，也许是我层次低了，哈哈哈😂

努力学习！✊