js面向对象中的原型链

责编:menVScode 2017-09-07 22:45 阅读(827)

原型链例子分析

    当实例对象mvc调用song(),若实例对象自身没有song这个方法,就会去自身的原型对象上去找有没有song方法,若还是没有的话,就会去与Person关联的原型对象(本身也是Obeject的实例对象)的Object构造函数的原型对象上去找。

//父类
function Person(name,age){
	this.name=name;
	this.age=age;
}

Person.prototype={
	song:function(){
		console.log(this.name+'正在唱歌...')
	}
}
Person.prototype.constructor = Person;

var menvscode = new Person('menvscode.com',18);//1创建实例   2:调用
menvscode.eat();

//子类
function Student(name,age){
	//继承了父类的属性
	Person.call(this,name,age);//将this指向Student的实例,本来是window
}
//利用原型链的方式
Student.prototype = new Person();

Student.prototype.school = function(){
	console.log(this.name+'正在上学...');
}

var mvc = new Student('MVC',15);
mvc.song();
//当实例对象mvc调用song(),若实例对象自身没有song这个方法,就会去自身的原型对象上去找有没有song方法,若还是没有的话,就会去与Person关联的原型对象(本身也是Obeject的实例对象)的Object构造函数的原型对象上去找。

console.log(Person.prototype.constructor);
Object.prototype.work=function(){
	console.log('working....')
}
mvc.work();
console.log(Object.prototype.constructor);//functoin Object() { [native code]

        Object做javascript语言中作为一个基类(父类)的存在,String、Number、Function,Array等等作为Object

的派生类(子类)出现的。也就是说在Object原型对象上扩展的方法,最终会使得String、Number等等享有。

Object.prototype.work=function(){
	console.log('menvscode....')
}
function fn(){}
fn.work();//menvscode....
var str = 'mvc';
str.work();//menvscode....

        prototype:函数对象的属性;

        __proto__:每一个对象拥有的属性,指向的是当前对象自身构造函数关联的原型对象;

var obj = {};
console.log(obj.__proto__);//Object 

function fn(){}
console.log(fn.prototype);//构造函数  原型对象
console.log(fn.__proto__);//函数对象  function
console.log(Object.__proto__);// 函数对象Function  function
console.log(Object.prototype);//构造函数  Object	
console.log(Object.__proto__==fn.__proto__);//true


Object.prototype.a=function(){
	alert(1);
}
Function.prototype.b=function(){ //Function构造函数在其原型对象上扩展一个方法
	alert(2);
}
function fn(){
	
}
fn.a();// 1  fn作为函数对象的一个实例存在
fn.b();// 2

var f = new fn(); // f是fn的实例对象出现
f.b();// f.b is not a function
f.a();// 1
前端交流群: MVC前端网(menvscode.com)-qq交流群:551903636

邮箱快速注册

忘记密码