JS基础_05—原型与原型链

一、原型

​ 1. JavaScript对象有一个叫做「原型」的公共属性，属性名是 prototype ，这个原型属性是对另一个对象的引用，通过这个原型属性我们就可以访问另个对象的属性和方法。

​ 2. 无论何时，只要创建了一个函数，就会根据一组特定的规则为该函数创建一个prototype属性，这个属性指向该函数的原型对象，所有原型对象都会获得一个constructor属性，这个属性包含一个指向prototype属性所在函数的指针。

// 创建构造函数
function Test (name, age) {
  console.log(this);
  this.name = name;
  this.age = age;
  this.sayName = function () {
    console.log(this.name);
  }
}
// 创建实例
const test1 = new Test('a', 8);
const test2 = new Test('b', 29);

​ 3. test1和test2都是构造函数Test()的实例对象，test1.__proto__指向了Test函数的原型对象prototype，而Test.prototype.constructor又指向Test函数。

​ Test的每一个实例对象，都含有一个内部属性__proto__，该属性指向Test.prototype。

console.log(Test.prototype.constructor === Test); // true
console.log(test1.__proto__ === Test.prototype); // true
console.log(test2.__proto__ === Test.prototype); // true

使用hasOwnProperty()方法可以检测一个属性是存在于实例还是存在于原型中，这个方法只有给定属性存在于对象实例中才会返回true。

function Test(){
}
Test.prototype.name = 'zzx';
Test.prototype.age = 22;
Test.prototype.job = 'Programmer';
Test.prototype.sayName = function(){
    console.log(this.name);
}
var test1 = new Test();
console.log(test1.hasOwnProperty('name')); //false
test1.name = 'yzy';
console.log(test1.hasOwnProperty('name')); //true
delete test1.name;
console.log(test1.hasOwnProperty('name')); //false

二、原型链

1. Object.setPrototypeOf：为现有对象设置原型，返回一个新对象

   • 接收两个参数：第一个是现有对象，第二是原型对象。

2. 当访问对象上的属性时，会首先查找该对象上是否含有该属性，而当这个对象上没有这个属性时就会访问**__proto__** 索引看看它的原型对象上面有没有，如果还没有就继续沿着**__proto__**原型向上寻找，

   直至找到或遍历结束返回undefined。这就是原型链。

   function one(){ };
   one.prototype.myname = "one";
   
   function two(){ };
   two.prototype.myname = "two";
   Object.setPrototypeOf(two.prototype,one.prototype);
   
   function three(){ };
   three.prototype.myname = "three";
   Object.setPrototypeOf(three.prototype,two.prototype);
   
   function four(){ };
   four.prototype.myname = "four";
   Object.setPrototypeOf(four.prototype,three.prototype);
   
   let temp = new four();
   
   console.log(temp)
   

   如果想让two的原型指向one，就需要使用

two.prototype = one.prototype