实训前端部分(day1)

文章详细介绍了JavaScript中的面向对象编程,特别是原型链和原型对象的概念。构造函数用于创建对象,其实例的__proto__属性指向构造函数的prototype对象。原型链允许对象间共享属性和方法,实现继承。虽然对象的原型链不可修改,但构造函数的prototype可以修改,影响已构造对象的原型链。
摘要由CSDN通过智能技术生成

@[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);

输出结果:

原型链与原型对象

概念
  1. 原型对象**(prototype):是函数对象**(当且仅当函数对象,如:new Function()function fun1(){})的一个内部属性,值是一个普通的对象,用户可以访问、操作该对象。
  2. 原型链(__proto__):是每个对象都具有的不可访问的内部属性**(指针)**,该指针指向构造函数对应的原型对象。
原型链的作用
  1. 可以使用原型链模拟类的功能
  2. 可以使用原型链实现继承关系

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(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**对象

认指向构造他的构造函数的原型对象prototype对象。

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

  • 通用性:原型链所有prototype对象的属性和函数都可以访问。使得一个对象可以访问到其他很多对象的属性和方法。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值