原型与原型链

面向对象的两个基本概念

  1. : 是对象的类型模板 , 是一种抽象 , 并不表示实体
  2. 实例 : 是根据类创建的对象 , 表示某个具体的事物

类和实例是大多数面向对象编程语言的基本概念。

不过,在JavaScript中,这个概念需要改一改。JavaScript不区分类和实例的概念,而是通过原型(prototype)来实现面向对象编程。

既然没有类的概念 , 我们就需要用某个对象来模拟一个类了

var person = {
	name : "Unnamed",
	run : function(){
		console.log(this.name + "is running...");
	}
};
//现在我们可以把person来当做一个原型对象, 来创建一个具体的"人"
var xiaoming = {
	name : "小明"
};
xiaoming.__proto__ = person;

JavaScript当中的原型链 , 既可以模拟由类创建实例的关系
也可以模拟继承的关系
原型对象本身也可以有原型对象 , 从而构成原型链
默认原型对象是Object
当然在运行中也可以随时改变某个对象的原型对象

以上代码主要用于表示原型链的实际关系 , 实际编程当中最好不要直接去修改对象的__proto__
Object.create()方法可以传入一个原型对象 , 用来构造出一个新对象

var xiaoming = Object.create(person);
xiaoming.name = "小明";
//验证原型对象
xiaoming.__proto__ === person; //true

当我们访问某个对象的属性时 , 例如obj.xxx
js引擎会先在该对象上查找该属性 , 如果没找到 , 就会到原型对象上去找 , 也就是顺着原型链一直向上回溯 , 直到Object.prototype对象 , 如果还没有 , 那么就是undefined

除此之外 , 也可以使用构造函数来创建对象
构造函数本身和普通的函数没什么区别 , 只是用new关键字来调用 , 就会返回一个需要构建的对象

function Student(){
	this.name = "sookie";
	this.age = 18;
	this.say = function(){
		alert("Hello");
	}
}
var stu = new Student();
stu.say();

如果按照普通函数的调用方式执行调用 , 其中的this就表示window对象
那么其中代码的效果就是定义了几个全局属性
如果使用 new 来调用该函数 , 那么它绑定的this就指向新创建的对象
并默认返回this ( 不需要写return )

使用这种方式创建的对象还从原型上获得了一个 constructor 属性
指向这个构造函数本身

—> 另外这个对象中有一个 say 属性 , 它是一个函数
在这种情况下 , 这个函数是属于stu对象的 , 并不属于该对象的原型
如果使用原型创建了多个对象 , 其中就会有很多重复的函数
所以可以把这个函数放入到Student的prototype当中

function Student(){
	this.name = "sookie";
	this.age = 18;
}
Student.prototype.say = function(){
	alert("Hello");
}
var stu1 = new Student();
var stu2 = new Student();
console.log(stu1.say == stu2.say)
//true

原文地址:https://www.cnblogs.com/programInit/p/6798240.html