您的位置：首页 > Web前端 > JavaScript
javascript基础之八（原型揭秘）

2015-10-23 20:57 579 查看
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>8-JavaScript原型揭秘</title>
</head>
<script>
var obj={
func:function(){
console.info("hello");
}
};
//对象的原型
console.info(obj.toString());
console.info(obj.__proto__);
console.info(obj.__proto__===Object.prototype);//true
//对象原型总结
//使用对象字面量(或者使用new Object()，再添加成员）创建对象时，每个对象都包含一个原型对象（prototype object），通过一个__proto__可以引用到这个原型对象，特别地，这个原型对象与Object引用的原型对象Object.prototype时同一个

//自定义函数的原型
console.info(obj.func.__proto__);
console.info(obj.func.__proto__===Function.prototype);//true

console.info(obj.func.prototype);
console.info(obj.func.prototype.__proto__===Object.prototype);//true
console.info(obj.func.prototype.constructor===obj.func);//true
console.info(obj.func.prototype.constructor.toString());
//自定义函数的原型小结
/*自定义函数的原型prototype属性应用的是一个对象，其prototype属性引用的又引用了这个函数对象，当函数作为对象的构造函数的时候，则构造出来的对象的prototype属性引用的对象就是原构造函数对象；构造函数的__proto__属性引用一个Empty（）对象(也就是Function.prototype)*/

//构造函数的原型
var Myobject=function(){
this.info="通过构造函数创建对象";
};
var myObj=new Myobject();
console.info(myObj.prototype);//undefined
console.info(myObj.__proto__);//Myobject
console.info(myObj.__proto__.constructor.toString());
console.info(myObj.__proto__.constructor==Myobject);
console.info(myObj.__proto__===Myobject.prototype);
console.info(Myobject.prototype);

//通过原型构造对象
console.info("通过原型构造对象");
function MyObject(name){
this.name=name;
}
var obj= new MyObject("object1");
for(var proName in obj){//遍历obj中所有的属性
console.info("obj[\"" +proName+"\"]："+obj[proName]);
}
//修改原型，向它添加成员
MyObject.prototype.value=100;
MyObject.prototype.print=function(){
console.info(this.name,this.value);
};
console.info("修改原型后");
for(var protoName in obj){
console.info("obj[\"" +proName+"\"]："+obj[proName]);//修改原型后，原型中的成员将自动加入到构造出来的对象之中
}
obj.name="newname";//这些属性同样可以使用
obj.value++;
obj.print();
//原型和原型中定义的方法，被所有对象共享
var obj2=new MyObject("object2");
console.info(obj.prototype===obj2.prototype);//ture
console.info(obj.print===obj2.print);//ture

//原型的小结
/*
每个对象都连接到一个原型对象(通过__proto__),这个原型对象要要么是Object.prototype,或者是它构造函数所对应的原型对象
如果我们天界一个新的属性到原型中，该属性立即成为所有对象的属性，不管是已经创建的还是新创建的
原型和原型中定义的属性以及方法，被所有对象共享
*/
/*
通过原型和构造函数添加的属性和方法的区别：
通过原型添加，新加的属性和方法为所有对象共享，每个对象对应属性值相同
通过构造函数添加，新加的属性和方法仅归于单个对象，每个对象的属性值不同
*/

//当有同名变量时候
function Person(){};
Person.prototype.name="PersonName";
Person.prototype.age=26;
Person.prototype.sayName=function(){console.info(this.name);};
var p1=new Person();
p1.name="张三";
var p2=new Person();
console.info(p1.name);//张三：优先访问自己定义的属性，prototype为其原型
console.info(p2.name);//PersonName:次值来自原型对象

//对象创建推荐的方式
function Myperson(name,age,job){
this.name=name;
this.age=age;
this.job=job;
this.friends=[];//构造函数中定义的成员在每个对象中是私有的（值不同）
}
Myperson.prototype={//定义原型，原型中的成员所有创建的对象共享（值相同）
constructor:Person,
sayName:function(){
console.info(this.name);
}
}
</script>
<body>
</body>
</html>
4000
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理
标签：
相关文章推荐
新的分享
章节导航