弄懂js中的原型对象

首先有哪些知识点?

__proto__     对象的原型对象

prototype      返回函数的原型对象

constructor   返回创建此对象的数组函数的引用

instanceof     判断是不是函数的实例

getPrototypeOf()    返回对象的原型对象

setPrototypeOf()   设置对象的原型对象

Object.create()    创建一个新对象,传入的参数作为新创建对象的原型对象;

论证

例子一:

var obj = {};
var fn = function () {};
console.log(obj.prototype);
console.log(fn.prototype);

总结:只有函数才有能使用prototype

例子二:

function Fn () {};
var fn1 = new Fn();
console.log(fn1.__proto__ === Fn.prototype);//true
console.log(Fn.prototype.constructor === Fn);//true

总结:构造函数的实例(fn1)的原型指向构造函数的原型对象(Fn.prototype)

例子三:

内置对象

console.log(String.__proto__===Function.prototype);//true
console.log(Number.__proto__===Function.prototype);//true
console.log(Array.__proto__===Function.prototype);//true
console.log(Object.__proto__===Function.prototype);//true
console.log(Function.__proto__===Function.prototype);//true
console.log(String.__proto__.__proto__===Object.prototype);//true
console.log(Number.__proto__.__proto__===Object.prototype);//true
console.log(Array.__proto__.__proto__===Object.prototype);//true
console.log(Object.__proto__.__proto__===Object.prototype);//true
console.log(Function.__proto__.__proto__===Object.prototype);//true
console.log(Object.prototype.__proto__===Object.prototype)//false
console.log(Object.prototype.__proto__)//null

总结: 1.所有的内置函数都是由Function()实例化的,包括它自己,即Function=new Function();

         2.万物皆对象,所有的内置函数都是对象,所有的对象的原型链终点都是Object.prototype;

例子四:

改变原型对象

function Fn () {};
var fn1 = new Fn();
var fn2 = new Fn();
var fn3 = new Fn();
//将fn2的原型对象设置为fn1
fn2 = Object.create(fn1);
//将fn3的原型对象设置为fn1
Object.setPrototypeOf(fn3, fn1);

console.log(Object.getPrototypeOf(fn1) === Fn.prototype);//true
console.log(Object.getPrototypeOf(fn2) === fn1);//true
console.log(Object.getPrototypeOf(fn3) === fn1);//true

//改变构造函数的原型对象
function Fn2 () {};
var obj = {};
//改变Fn2的原型对象
Fn2.prototype = obj;
var fn4 = new Fn2();
console.log(fn4.__proto__ === obj);//true;

总结: 1.改变对象的原型对象可以使用Object.setPrototypeOf。不推荐使用__proto__

          2.改变函数的原型对象使用prototype