原型链-prototype
2019-04-24 本文已影响7人
樊小勇
一、什么是原型
1.原型
1.每个object类型都有一个原型,原始的型态
2.函数的原型是 function.prototype
3.对象的原型是:
object.__proto__ 也就是function的原型是function.prototype,而object的原型是object.__proto__
4.function函数new一个对象object,最终它的Object.prototype的原型是null
2. 构造函数
原型离不开构造函数,最初的构造函数的原型是null
function A(name,color) {
this.name = name;
this.color = color;
}
函数A的原型是 A.prototype
用构造函数A生成(new)一个对象
var B = new A();
对象B的原型是 B.__proto__
而函数A和对象B的原型是相等的
consle.log(A.prototype===__proto__);
结果是true
3. new
- new我们经常用,无论是创建一个数字还是对象和函数都有用到
创建函数的几种方法
var A = new function();
function A(){ }
A:function(){ }
var A = function(){ }
- new的本质,大致原理
1、在函数里面创建一个对象obj
2、将函数里面的this指向创建的那个对象obj
3、返回这个obj对象
function F(name,age){
var obj = {}
this = obj
this.name = name
this.age = age
return obj
}
- 函数、对象的原型
函数的原型 : function.prototype
对象的原型 : object.__proto__
二、什么是原型链
1.原型链图片
![](https://img.haomeiwen.com/i15701103/89e74b32632727fd.png)
2.原型链理解
var F = function () {};
Object.prototype.a = function () {
console.log("aa");
};
Function.prototype.b = function () {
console.log("bb");
};
var f = new F();
F.a(); //aa
F.b(); //bb
f.a(); //aa
// f.b(); // 抱错,f.b is not a function
function A() {
this.name = 'a'
this.color = ['green', 'yellow']
}
function B() {}
B.prototype = new A()
var b1 = new B()
var b2 = new B()
b1.name = 'change'
b1.color.push('black')
console.log(b1.name); // change
console.log(b2.name) // a
console.log(b2.color) // green yellow black
原型链诸多原型组成了一条关系链
原型链的终点止步于最后的Object类型的原型,再访问原型是null
3.用我自己开玩笑似的语言总结为
object是儿子,function是爸爸,而function.prototypr是爷爷
爸爸通过new得到了儿子,儿子和爸爸都可以访问爷爷,儿子通过proto得到爷爷的东西,爸爸通过prototype的到爷爷的东西,爷爷可以用constructor管爸爸但是管不了无法无天的儿子,爸爸也管不了这个调皮的儿子,而爷爷上面也有长辈,也是一个道理来得到长辈的东西,最后的长辈由于没有长辈了到头来只能一场空null。
三、原型链是怎么形成的
- 原型链的要素
1.函数
2.对象
3.new
4.之间存在数据传递的关系
四、原型链有什么用
- 原型链的应用场景
原始JS,构造函数和对象之间的联系处理一些数据 - 原型链的作用
可以实现继承