对象原型 原型链 原型继承 constructor属性
原型:
每个构造函数身上都有一个prototype原型 原型身上有一个对象
被称为原型对象 (构造函数的this和原型上的this都指向实例化对象)
<body>
<script>
function Star() {}
Star.prototype.sing = function () {
console.log("哈哈哈");
};
// 原型对象
console.log(Star.prototype);
const ldh = new Star();
console.log(ldh);
// __proto__
// 所有的实例化对象都有__proto__属性指向构造函数的原型对象
console.log(ldh.__proto__ === Star.prototype); // true
</script>
</body>
原型链:
(构造函数通过new实例化 每个实例化身上都有一个prototype这个原型)
每个原型对象身上都有一个 __proto__这个原型 而这个对象身上也有原型对象
这个对象身上有一个consturct属性 这个属性指向构造函数 ,
构造函数身上也有__proto__这个原型 这个原型身上也有原型对象 就这样一层层
形成链式结构被称为原型链
// function Father() {
// this.sing = function () {
// console.log("我是父级");
// };
// }
// Object原型对象
// Object.prototype.sing = function () {
// console.log("我和我的祖国");
// };
// Father.prototype.sing = function () {
// console.log("青花瓷");
// };
// const zjl = new Father();
// zjl.sing(); //实例化后调用方法
// 先自己原型上找到我是父级 =>青花瓷=>我和我的祖国
// console.log(Object.prototype); //construct属性一系列
// console.log(Object.prototype.__proto__); //null
总结:访问原型: 访问原型上的的方法时 先访问自己的原型上的
如果没有则向外层找 原型上也找不到就返回null
原型继承:
1.可以简单理解为 一个公共的原型方法 如果想要继承 就需要将原型对象的实例化对象
(也可以理解为父级的实例化对象)给到自己的原型对象
2.再将construct重新指向自己的构造函数
继承父元素
// function Father(money, car, house) {
// this.money = money;
// this.car = car;
// this.house = house;
// }
// Father.prototype.hight = function () {
// // console.log("183");
// };
// let res = new Father("10000000", "保时捷711", "别墅"); //进行实例化
// console.log(res);
// res.hight();
// // Son的构造函数
// function Son() {}
// let res1 = new Son();
// // 原型继承
// Son.prototype = new Father();
// console.log(Son.prototype); //{money: undefined, car: undefined, house: undefined}会被父级实例化对象覆盖
// new Son().hight(); //183
// // 把构造函数从新指向自己
// Son.prototype.constructor = Son;
// console.log(Son.prototype); //此时父级中的constructor属性上会 f son()这个构造函数(constructor用于判断原型上的属性上是否包含某个构造函数 多用于区分)
constructor属性 (construtor这个属性指向构造函数)
<body>
<script>
// constructor 单词 构造函数
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.sing = function () {
console.log("唱歌");
};
const lw = new Person("哄哄", 3);
lw.sing();
console.log(Person.prototype.constructor);
//
function Pig(one, two) {
this.one = one;
this.two = two;
}
Pig.prototype.sing = function () {
console.log("哼哼");
};
const zz = new Pig("闹闹", 7);
zz.sing();
console.log(Pig.prototype.constructor);
console.log(Pig.prototype.constructor === Pig);
// 如果有多个构造函数 打印它的原型 则分不出那个是自己的属性(Person.prototype)
// 总结 所有的原型对象都有一个属性 constructor 这个属性指向构造函数 由此找到构造函数 可以进行区分
</script>
</body>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 25岁的心里话
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现