当前位置：首页 > news >正文

对象、函数、原型之间的关系

news 来源：原创 2025/6/8 2:25:52

在 JavaScript 中，对象、函数和原型是三者紧密联系的核心概念。它们共同构成了 JavaScript 中面向对象编程的基石，并通过原型链实现了继承与代码复用。本文将从对象、函数、原型的基础概念到它们之间的关系进行详细的讲解，帮助你理解 JavaScript 的底层机制。

1. 什么是对象？

在 JavaScript 中，一切皆对象。对象是包含属性和方法的容器。属性可以是基本数据类型，如字符串、数字等；方法则是一个可以执行的函数。

var person = {name: "浮游",age: 20,greet: function() {console.log("Hello, I am " + this.name);}
};console.log(person.name);  // 浮游
person.greet();  // Hello, I am 浮游

上面的 person 是一个对象，它包含了两个属性 name 和 age，以及一个方法 greet。

2. 什么是函数？

JavaScript 中的函数实际上也是对象。与其他对象不同的是，函数对象可以被调用。此外，每个函数在创建时都会自动拥有两个属性：prototype 和 __proto__。

function Foo() {}
console.log(typeof Foo); // function
console.log(Foo instanceof Object); // true

可以看出，函数本质上是对象，具有对象的一些特性。同时，它们也有特殊的属性，方便实现继承与原型链机制。

函数的两大属性：

prototype：每个函数都有的属性，指向函数的原型对象，用于继承。
__proto__：指向创建该对象的构造函数的原型。

3. 什么是原型？

原型是实现继承的核心概念。每个 JavaScript 对象都有一个隐藏的属性 [[Prototype]]，可以通过 __proto__ 来访问。原型是一个对象，它用于实现对象之间的属性和方法的共享。

3.1 原型对象 (`prototype`)

每个函数对象在创建时都会有一个 prototype 属性，该属性指向原型对象，而这个原型对象中包含了通过该函数创建的实例所共享的属性和方法。

function Person(name, age) {this.name = name;this.age = age;
}// 向原型对象中添加方法
Person.prototype.greet = function() {console.log("Hello, I am " + this.name);
};var person1 = new Person("浮游", 20);
var person2 = new Person("熠星", 24);person1.greet();  // Hello, I am 浮游
person2.greet();  // Hello, I am 熠星

在上面的例子中，Person 函数有一个 prototype 属性，所有通过 Person 创建的对象 (person1 和 person2) 都共享 prototype 中的 greet 方法。

3.2 隐式原型 (`proto`)

每个 JavaScript 对象都有一个 __proto__ 属性，指向其构造函数的原型。通过这个属性，对象可以继承构造函数原型上的属性和方法。__proto__ 是对象与原型之间的链接，形成了原型链。

console.log(person1.__proto__ === Person.prototype); // true
console.log(Person.prototype.__proto__ === Object.prototype); // true
console.log(Object.prototype.__proto__); // null, 原型链的顶端

person1 通过 __proto__ 链接到 Person.prototype，Person.prototype 又通过 __proto__ 链接到 Object.prototype，这就是 JavaScript 原型链的基础。

4. 对象、函数与原型的关系

JavaScript 是基于原型的语言，这意味着每个对象都从一个“原型”对象继承属性和方法。

函数是对象：函数本身是一个对象，有 __proto__ 属性，它指向 Function.prototype。
对象有原型：每个对象都有一个 __proto__ 属性，它指向它的构造函数的 prototype。
原型链：通过 __proto__ 属性，对象可以访问其原型对象上的属性和方法。如果在自身对象中找不到某个属性，它会沿着原型链向上查找。

4.1 构造函数与实例对象的关系

function Car(model) {this.model = model;
}Car.prototype.drive = function() {console.log(this.model + " is driving");
};var car1 = new Car("Toyota");
var car2 = new Car("Honda");car1.drive();  // Toyota is driving
car2.drive();  // Honda is drivingconsole.log(car1.__proto__ === Car.prototype);  // true
console.log(Car.prototype.constructor === Car);  // true

car1 和 car2 是由构造函数 Car 创建的实例对象。
它们的 __proto__ 属性都指向 Car.prototype。
Car.prototype.constructor 指向 Car 构造函数本身。

4.2 原型链的查找机制

当你访问一个对象的属性时，JavaScript 引擎首先会在对象本身的属性中查找。如果找不到，它会沿着原型链在其原型对象上查找。这个过程会持续到原型链的顶端——Object.prototype。

console.log(car1.toString()); // [object Object]

car1 并没有 toString 方法，但是它沿着原型链找到了 Object.prototype.toString，因此可以调用它。

5. 原型链

原型链是指对象通过 __proto__ 一直向上查找，直到找到 Object.prototype 为止。如果在整个原型链中没有找到该属性，则返回 undefined。

console.log(car1.__proto__); // Car.prototype
console.log(car1.__proto__.__proto__); // Object.prototype
console.log(car1.__proto__.__proto__.__proto__); // null, 原型链的顶端

6. 总结

对象：JavaScript 中的任何实体都是对象，它们可以有属性和方法。
函数：JavaScript 中的函数也是对象，它们有额外的 prototype 属性，用于支持原型链和继承。
原型：原型是对象的共享属性和方法的容器，通过原型链实现继承。每个对象都有一个 __proto__ 属性，指向它的构造函数的 prototype。

对象、函数与原型的关系：

对象 --通过 __proto__ --> 构造函数的 prototype --通过 constructor--> 构造函数

通过这个关系，JavaScript 实现了灵活的继承机制，使得我们能够通过原型链实现对象的扩展和代码的复用。

7. 关键要点

原型链是 JavaScript 继承机制的核心，通过它可以实现属性和方法的查找。
每个函数都有一个 prototype 属性，指向它的原型对象，原型对象上的属性和方法可以被该构造函数的实例对象共享。
每个对象都有一个 __proto__ 属性，指向它的构造函数的原型对象。
原型链的终点是 Object.prototype，它是所有对象的最终原型。

对象、函数、原型之间的关系

在 JavaScript 中，对象、函数和原型是三者紧密联系的核心概念。它们共同构成了 JavaScript 中面向对象编程的基石，并通过原型链实现了继承与代码复用。本文将从对象、函数、原型的基础概念到它们之间的关系进行详细的讲解，帮助你理解 Java…...

编程日记 2025/5/28 19:55:00

Showrunner AI技术浅析（二）：大型语言模型

1. GPT-3模型架构详解 GPT-3是基于Transformer架构的预训练语言模型，由OpenAI开发。其核心思想是通过自注意力机制（Self-Attention）处理输入序列，并生成自然语言文本。 1.1 Transformer架构基础 Transformer架构由Vaswani等人在…...

编程日记 2025/6/4 2:43:15

Web安全攻防入门教程——hvv行动详解

Web安全攻防入门教程 Web安全攻防是指在Web应用程序的开发、部署和运行过程中，保护Web应用免受攻击和恶意行为的技术与策略。这个领域不仅涉及防御措施的实现，还包括通过渗透测试、漏洞挖掘和模拟攻击来识别潜在的安全问题。本教程将带你入门Web安全攻防…...

编程日记 2025/6/3 13:26:11

************* C 买卖股票问题合集 ************* Since I have finished some stocks problems. I wanna make a list of the stocks to figure out the similarities. Here is the storks topucs list, from easy to hard: 121. 买卖股票的最佳时机 - 力扣（L…...

编程日记 2025/6/1 3:57:57

gitlab window如何设置ssh

在GitLab中设置SSH需要以下步骤： 在GitLab账户中，导航到“用户设置”下的“SSH密钥”部分。生成SSH密钥对（如果你还没有的话）。在Windows上，你可以使用ssh-keygen命令来生成密钥。在命令提示符或PowerShell中运行以…...

编程日记 2025/5/29 6:09:49

go配置文件

https://github.com/spf13/viper viper golang中常用的配置文件工具为viper库，是一个第三方库。viper功能： 解析JSON、TOML、YAML、HCL等格式的配置文件。监听配置文件的变化(WatchConfig)，不需要重启程序就可以读到最新的值。...

编程日记 2025/6/4 1:58:10

深度学习之超分辨率算法——SRGAN

更新版本实现了生成对抗网络在超分辨率上的使用更新了损失函数，增加先验函数 SRresnet实现 import torch import torchvision from torch import nnclass ConvBlock(nn.Module):def __init__(self, kernel_size3, stride1, n_inchannels64):super(ConvBlock…...

编程日记 2025/6/4 16:30:57

GIT命令使用手册（详细实用版）

一、git常用操作参考第一次提交完整步骤： 1.git init; 2.git add . 3.git commit -m "初始化" 4.git remote add origin https://github.com/githubusername/demo.git 5.git pull origin master 6.git push -u origin master（使用-u选项可以将…...

编程日记 2025/5/30 13:51:33

数据分析实战—IMDB电影数据分析

1.实战内容 1.加载数据到movies_df，输出前5行，输出movies_df.info(),movies_df.describe() # （1）加载数据集，输出前5行 #导入库 import pandas as pd import numpy as np import matplotlib import matplotlib.pyplo…...

编程日记 2025/6/2 18:00:12

【SQL/MySQL 如何使用三种触发器】SQL语句实例演示

触发器介绍 – 触发器是与表有关的数据库对象，指在insert/update/delete之前(BEFORE)或之后(AFTER)，触发并执行触发器中定义的SQL语句集合。 – 使用别名OLD和NEW来引用触发器中发生变化的记录内容，这与其他的数据库是相似的。现在触发器还只…...

编程日记 2025/5/30 3:12:02

社区团购管理系统（源码+数据库）

355.基于SpringBoot的社区团购管理系统，系统包含两种角色：管理员、用户,系统分为前台和后台两大模块，主要功能如下二、项目技术编程语言：Java 数据库：MySQL 项目管理工具：Maven 前端技术：Vue …...

编程日记 2025/6/3 23:36:03

时钟分频模块

实现时钟的二分频，四分频 1.时钟分频模块： module clk_div(input clk, //50Mhzinput rst_n,input [15:0] lcd_id,output reg lcd_pclk);reg clk_25m; reg clk_12_5m; reg …...

编程日记 2025/6/3 1:32:03

linux ipmitool配置机器的BMC（服务器管理后台）

前置：mgnt口和网卡1连接入内网，并分配静态ip 1. 安装 ipmitool Debian/Ubuntu: sudo apt-get update sudo apt-get install ipmitool CentOS/RHEL: sudo yum install ipmitool2. 配置 BMC 的 IP 地址 #打印当前ipmi 地址配置信息。 ipmitool lan p…...

编程日记 2025/6/2 19:21:34

【Springboot知识】Redis基础-springboot集成redis相关配置

文章目录 1. 添加依赖2. 配置Redis连接3. 配置RedisTemplate（可选）4. 使用RedisTemplate或StringRedisTemplate5. 测试和验证集群配置在application.properties中配置在application.yml中配置主从配置1. 配置Redis服务器使用配置文件使用命令行 2. 配置…...

编程日记 2025/6/4 6:49:59

【数据结构】八大排序

目录一、直接插入排序二、希尔排序三、选择排序四、堆排序五、冒泡排序六、快速排序七、归并排序八、计数排序稳定性结论稳定性：排序后相同元素之间的相对顺序是否保持不变。一、直接插入排序基本思想：通过构建有序序列&#xff…...

编程日记 2025/6/2 21:11:05

mmdetection：图片推理以及将预测标签转换为YOLO格式标签

本文记录了使用 mmdetection 进行图片推理，并将推理结果坐标格式转换为yolo格式保存在txt中的代码。文章目录一、图片推理二、批量处理一、图片推理一个图片推理的demo。 import os import mmcv from mmdet.apis import init_detector, inference_detector fr…...

编程日记 2025/5/31 10:33:56

CV-OCR经典论文解读|An Empirical Study of Scaling Law for OCR/OCR 缩放定律的实证研究

论文标题 An Empirical Study of Scaling Law for OCR OCR 缩放定律的实证研究论文链接： An Empirical Study of Scaling Law for OCR论文下载论文作者 Miao Rang, Zhenni Bi, Chuanjian Liu, Yunhe Wang, Kai Han 内容简介本论文在光学字符识别&#xf…...

编程日记 2025/6/3 0:06:47

从混沌到秩序：Python的依赖管理工具分析

Python 的依赖管理工具一直没有标准化，原因主要包括： 历史发展的随意性：Python发展早期对于依赖管理的重视程度不足，缺乏从一开始就进行统一规划和设计的意识社区的分散性：Python社区庞大且分散，众多开发…...

编程日记 2025/6/2 14:11:45

【系统】Windows11更新解决办法，一键暂停

最近的windows更新整的我是措不及防，干啥都要关注一下更新的问题，有的时候还关不掉，我的强迫症就来了，非得关了你不可！ 经过了九九八十一难的研究之后，终于找到了一个算是比较靠谱的暂停更新的方法&#x…...

编程日记 2025/6/4 7:18:08

小红书关键词搜索采集 | AI改写 | 无水印下载 | 多维表格 | 采集同步飞书

小红书关键词搜索采集 | AI改写 | 无水印下载 | 多维表格 | 采集同步飞书一、下载影刀： https://www.winrobot360.com/share/activity?inviteUserUuid595634970300317698 二、加入应用市场 https://www.yingdao.com/share/accede/?inviteKeyb2d3f22a-fd6c-4a…...

编程日记 2025/5/31 6:34:39

【原生js案例】前端封装ajax请求及node连接 MySQL获取真实数据

上篇文章，我们封装了ajax方法来请求后端数据，这篇文章将介绍如何使用 Node.js 来连接 MySQL，并对数据库进行操作。实现效果代码实现后端接口处理 const express require("express"); const connection require("../da…...

编程日记 2025/6/3 4:59:26

Ubuntu将深度学习环境配置移植到新电脑

这里默认新电脑已经安装好了conda、CUDA这些，可以直接创建新的虚拟环境。参考链接： https://blog.csdn.net/Chujun123528/article/details/143788565https://blog.csdn.net/qq_41779275/article/details/122868946https://blog.csdn.net/YajunLin/art…...

编程日记 2025/6/2 23:26:17

vue基础作业实验十

vue基础作业实验十实验要求案例要点：代码以及思考style部分Vue.js 部分Vue 实例部分这段代码是一个基于 Vue.js 的静态页面，功能包括商品品牌的添加、删除和搜索。实验要求一、实验的基本内容 （1）Vue模板语法。 &#xff08…...

编程日记 2025/6/4 6:02:21

冒泡排序（JAVA）

package com.guangyunl.f_array;import java.util.Random; import java.util.Scanner;// 数组的冒泡排序 // 冒泡排序法是采用数组中相邻元素进行比较换位 public class Demo02Bubble {public static void main(String[] args) {Demo02Bubble demo02Bubble new Demo02Bubble()…...

编程日记 2025/6/1 5:55:16

如何测量分辨率

一、什么是分辨率？ 分辨率指的是分清物体细节的能力。分辨率是一个成像系统还原空间频率的能力。一些人只是简单的用分辨率去描述极限分辨率，但是相机在在不同的对比度的情况下还原低，中和高频率的能力，也可以显示全面综合的信息。…...

编程日记 2025/6/1 15:46:46

【Mysql索引优化】索引优化的最佳实现

文章目录【Mysql优化】索引优化的最佳实现1. 全值匹配：索引的最佳使用方式2. 最左前缀法则3. 尽量使用覆盖索引：优化查询性能。减少 select \* 语句4. 范围查询优化5. 不在索引列上做任何操作（计算、函数、（自动or手动&#xff0…...

编程日记 2025/6/3 1:48:39

centos使用mkisofs构建无人值守镜像（附官方学习文档）

安装mkisofs yum install -y mkisofs 挂载镜像并确认并拷贝文件(/mnt 为我们的工作目录) 1.3 准备自动应答文件(保存为 ins.ks) 修改系统引导实际上就是添加inst.ks 这个引导参数传递应答文件传统模式引导 UEFI模式引导打包镜像通用选项 -v：启用详细模式&a…...

编程日记 2025/6/3 0:21:51

Python获取当前系统中可用的串口设备

import serial.tools.list_portsdef checkDevice(self):port_data []for port in serial.tools.list_ports.comports():port_data.append(port.description)if port_data:for devInfo in port_data:self.toolLogPrinting(可用设备 devInfo)RET Trueelse:self.toolLogPrinti…...

编程日记 2025/6/1 1:00:21