1. 介绍

原型模式（Prototype Pattern）不是指的 JS 的原型，它是 clone 自己，生成一个新对象的操作。因为 new 一个新对象的时候开销会比较大，或者由于其他原因不合适，所以采用这种方式创建一个一模一样的对象。

Java 默认有 clone 接口，不用自己实现。JS 中有一个比较像的实现就是 Object.create 方法。

2. 原型模式的通用实现​

// 一个对象（作为原型）
const prototype = {
  getName: function() {
    return this.first + '' + this.last;
  },
  say: function() {
    console.log('hello world');
  }
}

// 基于原型创建 x
let x = Object.create(prototype);
x.first = 'A';
x.last = 'B';
console.log(x.getName());
x.say();

// 基于原型创建 y
let y = Object.create(prototype);
y.first = 'C';
y.last = 'D';
console.log(y.getName());
y.say();

3. JavaScript中的原型​

3.1 函数和对象​

• 函数是一种对象
• 对象都是通过函数创建的

//函数是一种对象
function Person() {}
console.log(Person instanceof Object);

//对象都是通过函数创建的
let p1=new Person();
let obj1={name: 'zfpx'}
let obj=new Object();
obj2.name='zfpx';

3.2 原型对象prototype​

• 每个函数都有一个属性叫做prototype，prototype的属性值是一个对象即原型对象
• 原型对象默认的只有一个叫做constructor的属性，指向这个函数本身
• 每个实例对象都有一个隐藏的属性__proto__,这个属性引用了创建这个对象的函数的prototype

• 自定义函数的prototype是由Object创建，所以它的proto指向的就是Object.prototype
• Object.prototype的proto指向的是null

• 自定义函数Foo.__proto__指向Function.prototype
• Object.__proto__指向Function.prototype
• Function.__proto__指向Function.prototype

let sum = new Function('a','b','return a+b');

• Function.prototype的proto也指向Object.prototype

• JS 中的 prototype 可以理解为 ES6 class 的一种底层原理
• 上面用到的 Object.create 方法也是基于原型 prototype 的
• 而 class 是实现面向对象的基础，并不是服务于某个模式
• 若干年后 ES6 全面普及，大家可能会忽略掉 prototype，但是 Object.create 却会长久存在

3.3 instanceof​

• Instanceof运算符的第一个变量是一个对象，暂时称为A；第二个变量一般是一个函数，暂时称为B
• Instanceof的判断规则是：沿着A的proto这条线来找，同时沿着B的prototype这条线来找，如果两条线能找到同一个引用，即同一个对象，那么就返回true。如果找到终点还未重合，则返回false。

console.log(Object instanceof Function);
console.log(Function instanceof Object);
console.log(Function instanceof Function);

3.4 原型链​

• 访问一个对象的属性时，先在基本属性中查找，如果没有，再沿着proto这条链向上找，这就是原型链
• hasOwnProperty可以区分一个属性到底是自己的还是从原型中找到

function Foo(){
    this.a = 10;
}
Foo.prototype.b = 20;

let f1  = new Foo();
console.log(f1.a);
console.log(f1.b);

3.5 原型优势​

• 可以随意扩展
• 可以重写继承的方法

let obj = {};
console.log(obj.toString());


let arr = [1,2,3];
// Array继承Object
// Array原型上的的方法对Object原型上的方法进行了重写
console.log(arr.toString());
// Object原型上的方法
console.log(Object.prototype.toString.call(arr));

4. 场景​