<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//写一个构造函数,用来创建学生对象
//属性:姓名 年龄 身高 体重
//行为:学习 吃饭 看片 把妹
function studyMethod(){
console.log("我叫"+ this.name +"Good Good Study Day Day Up");
}
function Student(stuName) {
this.name = stuName;
this.study = studyMethod;
//方法* 8*10^20
}
//如果构造函数没有参数,那么在调用的时候 小括号 可以省略
var stu = new Student("geng");
stu.study();
var stu1 = new Student("li");
stu1.study();
//如果在构造函数中定义函数,那么每次创建对象,都会重新创建该函数
//但是函数内部代码完全相同,就造成了资源浪费
//为了处理这个问题,我们要让所有的对象共用一个方法
//在构造函数外部定义好该函数,将该函数赋值给构造函数内的方法
//使用这种方式写好的方法中的this指向的就是调用该方法的对象
//this 谁调用就是谁
//******使用这种方式存在的问题********
//1.全局变量增多,造成污染
//2.代码结构混乱,不易维护
//---------------解决办法:用原型,简单介绍一下:------------------------------
function Person(name, status) {
this.name = name;
this.status = status;
this.act = function () {
console.log("演戏");
};
this.exercise = function () {
console.log("就不强身健体");
}
}
var p = new Person("xyz","single");
//p.exercise();
//原型是个什么玩意儿?
//在构造函数创建出来的时候,系统会默认的帮构造函数创建并关联一个神秘的对象,这个对象就是原型
//原型默认的是一个空的对象
//原型的作用
//原型中的属性和方法 可以被使用该构造函数创建出来的对象 使用
//如何访问构造函数的原型
// 构造函数.prototype
console.log(Person.prototype);
console.log(p.prototype); //注意 prototype是构造函数的属性,跟对象没有关系
//如何给原型对象添加属性和方法?
//使用对象的动态特性
Person.prototype.exercise = function () {
console.log("强身健体,保卫祖国");
}
p.exercise();
//当使用对象去访问属性和方法的时候
//会首先在对象自己内部进行查找,如果找到了,就直接使用
//如果没有找到,就去原型中查找,查找到之后,使用
//如果原型中还没有, 如果是属性,就是Undefined
//如果是方法,就报错
//p.sing(); //本身和原型中都没有 就报错
// -----------------------用原型的办法构造函数---------------------------------
function Person(name, age, gender) {
this.name = name;
this.age = age;
this.gender = gender;
// this.sayHello = function () {
// console.log("你好我是" + this.name);
// }
}
var p =new Person("张学友",18,"male");
var p1 = new Person("刘德华",19,"male");
Person.prototype.sayHello = function () {
console.log("你好我是" + this.name);
}
Person.prototype["sing"] = function () {
console.log("一千个伤心的母牛");
}
p.sayHello();
p1.sayHello();
p.sing();
p1.sing();
//如何使用原型来解决构造函数存在的问题?
//构造函数的原型对象中的成员,可以被该构造函数创建出来的所有对象访问
//而且,所有的对象共享该对象
//所以,我们可以将构造函数中需要创建的函数,放到原型对象中存储
//这样就解决 全局变量污染的问题 以及 代码结构混乱的问题();
</script>
</head>
<body>
</body>
</html>
传统构造函数存在的问题以及解决方法(原型)
最新推荐文章于 2023-11-20 18:18:32 发布