利用原型共享数据
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 什么样的数据是需要写在原型中的?
// 需要共享的数据就可以写在原型中
// 原型的作用之一:数据共享
// 属性需要共享,方法也需要共享
// 不需要共享的数据写在构造函数中,需要共享的数据就可以写在原型中
// 构造函数
function Student(name,age,sex){
this.name = name;
this.age = age;
this.sex = sex;
}
// 所有学生的身高都是188,所有人的体重都是55
// 所有学生都要每天写500行代码
// 所有学生每天都要吃一个10斤的西瓜
// 原型对象
Student.prototype.height = "188";
Student.prototype.weight = "55kg";
Student.prototype.study = function(){
console.log("学习,写500行代码");
};
Student.prototype.eat = function(){
console.log("吃一个10斤的西瓜");
};
// 实例化对象,并初始化
var stu = new Student("晨光",29,"女");
console.dir(Student);
console.dir(stu);
// stu.eat();
// stu.study();
</script>
</head>
<body>
</body>
</html>原型简单的语法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// 构造函数
function Student(name,age,sex){
this.name = name;
this.age = age;
this.sex = sex;
}
// 简单的原型写法
Student.prototype = {
// 手动修改构造器的指向
constructor:Student,
height:"188",
weight:"55kg",
study:function(){
console.log("学习好开心啊");
},
eat:function(){
console.log("我要吃好吃的");
}
};
var stu = new Student("段飞",20,"男");
stu.eat();
stu.study();
console.dir(Student);
console.dir(stu);
// 原型对象
// Student.prototype.height = "188";
// Student.prototype.weight = "55kg";
// Student.prototype.study = function(){
// console.log("学习,写500行代码");
// };
// Student.prototype.eat = function(){
// console.log("吃一个10斤的西瓜");
// };
// // 实例化对象,并初始化
// var stu = new Student("晨光",29,"女");
// console.dir(Student);
// console.dir(stu);
// stu.eat();
// stu.study();
</script>
</head>
<body>
</body>
</html>原型中的方法是可以相互访问的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
// function Person(age){
// this.age = age;
// this.sayHi = function(){
// console.log("hello");
// // 打招呼的同时,直接调用吃的方法
// // this.eat();
// };
// this.eat = function(){
// console.log("吃东西啦");
// this.sayHi();
// };
// }
// // 实例对象的方法,是可以相互调用的
// // 实例化对象,并初始化
// var per = new Person(20);
// // 调用方法
// // per.sayHi();
// per.eat();
</script>
<script>
// 原型中的方法,是可以相互访问的
function Animal(name,age){
this.name = name;
this.age = age;
}
// 原型中添加方法
Animal.prototype.eat = function(){
console.log("动物吃东西");
this.play();
};
Animal.prototype.play = function(){
console.log("玩球");
this.sleep();
};
Animal.prototype.sleep = function(){
console.log("睡觉了");
};
var dog = new Animal("小苏",20);
dog.eat();
// 原型对象中的方法,可以相互调用
</script>
</head>
<body>
</body>
</html>实例对象使用属性和方法层层搜索
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
function Person(age,sex){
// 年龄
this.age = age;
// 性别
this.sex = sex;
this.eat = function(){
console.log("构造函数中的吃");
};
}
Person.prototype.sex = "女";
Person.prototype.eat = function(){
console.log("原型对象中的吃");
};
var per = new Person(20,"男");
// 男
console.log(per.sex);
per.eat();
console.dir(per);
/**
* 实例对象使用的属性或者方法,先在实例中查找,找到了则直接使用
* 找不到则去实例对象的__proto__指向的原型对象prototype中找,找到了则使用
* 找不到则报错
*/
</script>
</head>
<body>
</body>
</html>