JavaScript原型 prototype

JavaScript原型

1. 原型对象：我们所创建的每一个函数，解析器都会向函数中添加一个属性prototype，这个属性对应着一个对象，这个对象就是我们所谓的原型对象。

function Myclass(){
}
var mc = new Myclass();
console.log(Myclass.prototype);

2. 如果函数作为普通函数调用prototype没有任何作用，当函数以构造函数的形式调用时，它所创建的对象中都会有一个隐含的属性，指向该构造函数的原型对象，我们可以通过__proto__来访问该属性。

function MyClass() {
}
var mc = new Myclass();
// console.log( Myclass.prototype);
// Myclass.prototype === mc.__proto__
console. log(mc.__proto__);

3. 原型对象就相当于一个公共的区域，所有同一个类的实例都可以访问到这个原型对象，我们可以将对象中共有的内容，统一设置到原型对象中。
   
4. 当我们访问对象的一个属性或方法时，它会先在对象自身中寻找，如果有则直接使用，如果没有则会去原型对象中寻找，如果找到则直接使用。
5. 以后我们创建构造函数时，可以将这些对象共有的属性和方法，统一添加到构造函数的原型对象中，这样不用分别为每一个对象添加，也不会影响到全局作用域，就可以使每个对象都具有这些属性和方法了。
6. 向原型对象中添加属性或方法。

//向MyClass的原型中添加属性a
MyClass.prototype.a = 123;
 //向MyClass的原型中添加一个方法
MyClass.prototype.sayHello = function() {
	alert("hel1o");
};
// 方法的调用
mc.sayHello();

7. 检测对象中是否包含某属性, in 和 hasOwnProperty()

//创建一个构造函数
function Myclass() {
}
//向MyClass的原型中添加一个name属性
MyClass.prototype.name =“我是原型中的名字";
var mc = new Myclass();
// console.log(mc.name) ;
// 使用in检查对象中是否含有某个属性时，如果对象中没有但是原型中有，也会返回trueconsole.1og( "name" in mc );
// 可以使用对象的hasOwnProperty()来检查对象自身中是否含有i//使用该方法只有当对象自身中含有属性时，才会返回true
console.log(mc.hasOwnProperty( "age"));

8. 原型对象也是对象,所以它也有原型，当我们使用一个对象的属性或方法时，会现在自身中寻找，自身中如果有，则直接使用，如果没有则去原型对象中寻找，如果原型对象中有则使用，如果没有则去原型的原型中寻找，直到找到Object对象的原型。

console.log(mc.__proto__.hasOwnProperty( "hasOwnProperty"));
console.log(mc.__proto__.__proto__.hasOwnProperty("hasOwnProperty")；
console.log(mc. __proto__.__proto__.__proto __);

9. 0bject对象的原型没有原型，如果在Object中依然没有找到，则返回undefined

---

注意：

1. 很多情况下,我们需要手动的利用constructor这个属性指回原来的构造函数 。
2. 如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必领手动的利用constructor指回原来的构造函数。

// 很多情况下,我们需要手动的利用constructor这个属性指回原来的构造函数 
// Star.prototype.sing= function() {
// console.log("我会唱歌");
// };
// Star.prototype.movie = function() { // console.log( '我会演电影");
// }
Star.prototype = {
	//如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必领手动的利用constructor指回原来的构造函数
	constructor: Star,
	sing: function() {
		console.log('我会唱歌");
	},
	movie: function() {
		console.log("我会演电影');
	}
}
var ldh = new Star("刘德华", 18);
var zxy = new star(张学友", 19);

---

原型链

---

JavaScript的成员查找机制(规则)

1. 当访问一个对象的属性(包括方法)时，首先查找这个对象自身有没有该属性。
2. 如果没有就查找它的原型（也就是__proto__指向的prototype原型对象)。
3. 如果还没有就查找原型对象的原型( Object的原型对象)。
4. 依此类推一直找到Object为止(null) 。
   公

// 原型对象的应用扩展内置对象方法console.log(Array.prototype);
Array.prototype.sum = function() {
	var sum = 0;
	for (var i = 0; i < this.length; i++) {
		sum += this[i];
	}
	return sum;
}
var arr = [1，2，3];
console.log(arr.sum());

---

扩展内置对象

• 可以通过原型对象，对原来的内置对象进行扩展自定义的方法。比如给数组增加自定义求偶数和的功能。
• 注意∶数组和字符串内置对象不能给原型对象覆盖操作Array.prototype = {}，只能是Aray.prototype.ox = function(){}的方式.

function fn(x,y) {
	console.log("我想喝手磨咖啡');
	console.log(this);
	console.log(x + y);
}

var o = {
	name: 'andy';
}
// fn();
// 1. call()可以调用函数
// fn.call();
// 2. call()可以改变这个函数的this指向,此时这个函数的this 就指向了o这个对象。
fn.call(o，1，2);

---

补充：

function Person(name, age) {
     this.name = name;
     this.age = age;
 }
 var per = new Person();

• 函数 都有 prototype 属性，实例对象 都有 构造函数
• 实例对象 中的 __proto__ 指向 原型对象 ，也就是 构造函数 的 prototype

console.log(Person.prototype === per.__proto__); // true

• 函数的 原型 的 构造函数 等于自身

console.log(Person.prototype.constructor === Person); // true

• 实例对象 中的 __proto__ 就是该对象中 构造函数 的 prototype

console.log(per.__proto__ === per.constructor.prototype); // true

---

JavaScript中的 类class 其实就是封装的一个 语法糖，其本质和构造函数一样，类中也包含 prototype，其实力对象中包含 __proto__ ，其原理和 构造函数创建实例 的过程 等价。

---

原型链中的指向关系