实训前端部分（day1）

最新推荐文章于 2024-06-15 11:46:27 发布

Fo_Pluto

最新推荐文章于 2024-06-15 11:46:27 发布

阅读量67

点赞数 1

文章标签：前端

本文链接：https://blog.csdn.net/Fo_Pluto/article/details/131967377

版权

@[toc]燕山大学企业实训第一天笔记

JavaScript面向对象编程----原型链和原型对象

构造函数和原型对象（原型链）的操作

构造函数的声明和普通函数一样，但调用方式不同，返回的结果及内存结构也不同，执行构造函数将会返回一个该构造函数对应的对象。

一般来说，普通函数首字母不大写，构造函数的首字母大写：

/* 普通函数定义 */
function func(a, b) {
	console.log("a = " + a + ", b = " + b);
}
/* 构造函数定义 */
function Person(){
    this.name = "张三";
    console.log("Person的构造函数被定义了");
}
/* 对象实例化 */
var person = new Person();

直接调用构造函数是可以的，就是当做普通函数使用：

// 直接调用函数。是可以的，直接当做普通函数使用
Person();

构造函数初始化过程：

创建了一个obj空对象
空对象的原型链（__proto__）指向了函数原型对象prototype对象。
修改函数对象的this指针为新创建的对象引用。
执行函数体。

有如下代码：

/* 构造函数定义 */
function Person(){
    this.name = "张三";
    console.log("Person的构造函数被定义了");
}
/* 对象实例化 */
var person = new Person();

如下方法可以查看对象的原型链和函数的原型对象：

console.log("person的proto："); // 原型链
console.log(person.__proto__);
console.log("person函数的prototype："); // 原型对象
console.log(Person.prototype);

在JavaScript中，可以通过==（不严格）符号和===（严格）符号判断相等，下面判断对象的原型链和构造函数的原型对象是否严格相等：

console.log("person的__proto__是否和Person函数的prototype相等？");
console.log("严格");
console.log(person.__proto__ === Person.prototype);
console.log("不严格：");
console.log(person.__proto__ == Person.prototype);
// === 严格判断相等，数据类型和数据值必须都相等返回True
// ==  不严格相等，数据类型可以不一样，但是数据值相等才能返回True

结果输出如下：

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-MyncGPvo-1690458468720)(C:\Users\HUAWEI\AppData\Roaming\Typora\typora-user-images\image-20230727192417932.png)]

说明对象的原型链是指向构造函数的原型对象的。而对象的原型链不可修改（修改不报错但无效），构造函数的原型对象是可以修改的，修改后构造的对象原型链会随之变化。

// js对象通过原型链继承。原型链不能被修改
// 尝试修改,修改不报错
console.log(person.__proto__);
person.__proto__ = "?????";
console.log(person.__proto__);
console.log("====================================");
// 原型对象的值可以修改：
// 尝试修改
console.log(Person.prototype);
Person.prototype = "{?????}";
console.log(Person.prototype);

输出结果：

原型链与原型对象

概念

原型对象**(prototype)：是函数对象**（当且仅当函数对象，如：new Function()，function fun1(){}）的一个内部属性，值是一个普通的对象，用户可以访问、操作该对象。
原型链(__proto__)：是每个对象都具有的不可访问的内部属性**（指针）**，该指针指向构造函数对应的原型对象。

原型链的作用

可以使用原型链模拟类的功能
可以使用原型链实现继承关系

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-hx4DUMuO-1690458468723)(C:\Users\HUAWEI\AppData\Roaming\Typora\typora-user-images\image-20230727193421329.png)]

原型链的特点

原型链的终点是Object对象的prototype属性，该属性的__proto__为null，所有连接构成原型链。

对象可以调用原型链上的所有属性以及函数。

原型链指针（proto）的特点

不可访问性：在IE等浏览器中proto属性不可访问。
不可操作性：不能修改原型链指针的指向。
多元性：所有对象类型都包含原型链指针。
连接性：对象的原型链指针默认指向构造他的构造函数的原型对象prototype对象。

但是prototype对象中也有**__proto__指针链指针，这个指针也会作为原型链的一部分直到链接到Object类的prototype**对象