JavaScript怎么创建多个对象?详解四种方法

javascript怎么创建多个对象?javascript面向对象创建多个对象的方法,哪个最好用?字面量?工厂模式方法?构造函数方法?原型方法?原型加构造函数方法?进来一看便知。

JavaScript怎么创建多个对象?详解四种方法

在开发过程中我们经常会遇到需要创建很多个相似的对象,很可能有很多相同的属性或方法,那我们创建多个对象的方法都有哪些呢?最好的方法有又是哪个呢?一起来来看看吧!

1、创建多个对象——字面量方法

对象的字面量方方式是创建对象最常用的方式之一,以字面量方式创建的对象属性默认是可写的、可枚举、可配置。

如下代码展示了使用字面量方式创建多个对象:

立即学习“Java免费学习笔记(深入)”;

// 字面量方式创建多个对象var person1 = {    name: 'jam',    age: 18,    address: '上海市',    eating: function () {        console.log(this.name + '在吃饭')    }}var person2 = {    name: 'tom',    age: 20,    address: '北京市',    eating: function () {        console.log(this.name + '在吃饭')    }}var person3 = {    name: 'liming',    age: 19,    address: '天津市',    eating: function () {        console.log(this.name + '在吃饭')    }}

经过上述示例代码我们可以看出,仅仅创建了3个对象就用了24行,可以看出字面量方式的弊端:创建同样的对象时,需要编写重复的代码太多。

2、创建多个对象——工厂模式方法

工厂模式其实是一种常见的设计模式;
通常我们会有一个工厂方法,通过该工厂方法我们可以产生想要的对象;

如下代码展示了使用工厂模式方法创建多个对象的操作:

// 工厂函数方式创建多个对象function createPerson (name, age, address) {    var p = {}    p.name = name    p.age = age    p.address = address    p.eating = function () {        console.log(name + '在吃饭')    }    return p}var p1 = createPerson('jam', 19, '上海市')var p2 = createPerson('tom', 14, '北京市')var p3 = createPerson('li', 13, '天津市')p3.eating() // li在吃饭

可以看出使用工厂模式方法创建了三个对象使用的代码明显比字面量少了好多行,but这就是最好的方式了吗?NO! NO! NO!
工厂模式方法的**弊端**就在于:以上述示例代码为例。当我们打印p1,p2,p3后,获取不到对象最真实的类型,比如p1是人还是动物还是工具

3、创建多个对象——构造函数方法

构造函数相信大家并不陌生。所谓构造函数,就是提供一个生成对象的模板,并描述对象的基本结构的函数。一个构造函数,可以生成多个对象,每个对象都有相同的结构。

四维时代AI开放平台 四维时代AI开放平台

四维时代AI开放平台

四维时代AI开放平台 66 查看详情 四维时代AI开放平台

如下代码展示了使用构造函数方法创建多个对象:

// 约定俗成的规范,构造函数名字首字母大写function Person (name, age, address) {    this.name = name    this.age = age    this.address = address    this.eating = function () {        console.log(this.name + '在吃饭')    }    this.running = function () {        console.log(this.name + '在跑步')    }}var p1 = new Person('jam', 20, '北京市')var p2 = new Person('tom', 14, '上海市')var p3 = new Person('li', 13, '天津市')console.log(p1)// 输出结果//  Person {//     name: 'jam',       //     age: 20,//     address: '北京市', //     eating: [Function],//     running: [Function]//   }p1.eating()  // jam在吃饭

构造函数有个不成文的规范,那就是构造函数的名字首字母大写或者驼峰。
构造函数方式并不是最完美的创建多个对象的方式,也是有缺点的。
缺点:每个方法都要在每个实例上重新创建一遍,比如同样的eating方法和running方法都需要在p1,p2,p3的实例上去创建一遍,浪费很多的内存空间

4、创建多个对象——原型加构造函数方式

二者的组合模式即在构造函数上定义实例属性,那么在创建对象上只需要传入这些参数。在原型对象用于定义方法和共享属性。

如下代码展示了使用原型加构造函数方式创建多个对象:

function Person (name, age, address) {    this.name = name    this.age = age    this.address = address    this.eating =        this.running = function () {            console.log(this.name + '在跑步')        }}// 将eating方法和running方法加在原型上,就不需要每次创建一个对象都去在内存中加一遍一样的方法Person.prototype.eating = function () {    console.log(this.name + '在吃饭')}Person.prototype.running = function () {    console.log(this.name + '在跑步')}var p1 = new Person('jam', 20, '北京市')var p2 = new Person('tom', 14, '上海市')var p3 = new Person('li', 13, '天津市')console.log(p1)// 输出结果://  Person {//     name: 'jam',       //     age: 20,//     address: '北京市', //     eating: [Function],//     running: [Function]//   }p1.eating()  // jam在吃饭

最后的当然是压轴的呀,这种原型和构造函数方式是目前在ECMAScript中使用得最广泛、认同度最高的一种创建对象的方法。

看完之后是不是感觉创建多个对象也没有那么复杂,利用原型加构造函数的方法分分钟创建好了。

【相关推荐:javascript视频教程、web前端】

以上就是JavaScript怎么创建多个对象?详解四种方法的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/549679.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年11月9日 19:22:35
下一篇 2025年11月9日 19:27:34

相关推荐

  • 使用 Gradio 中的自定义 JavaScript 事件处理程序

    本文介绍了如何在 Gradio 应用中使用自定义 JavaScript 事件处理程序与 Python 代码进行交互。通过在 Gradio 应用中嵌入 JavaScript 代码,监听特定事件,并将事件数据传递回 Python 函数,实现更灵活的前后端交互。本文提供了一个具体示例,展示了如何监听图像点…

    2025年12月14日
    000
  • Python爬虫应对反爬机制:从requests到Selenium的进阶策略

    本文探讨Python爬虫在面对反爬机制,特别是Cloudflare等防护时,requests库可能遇到的访问障碍。教程将详细介绍如何利用selenium模拟真实浏览器行为,有效绕过此类限制,成功抓取动态渲染的网页内容,并提供实用的代码示例和注意事项,帮助开发者构建更健壮的爬虫系统。 1. 理解传统H…

    2025年12月14日
    000
  • Python网络爬虫应对复杂反爬机制:使用Selenium模拟浏览器行为

    本教程旨在解决Python requests库无法访问受Cloudflare等高级反爬机制保护的网站问题。我们将深入探讨传统请求失败的原因,并提供一个基于Selenium的解决方案,通过模拟真实浏览器行为来成功抓取内容,确保即使面对JavaScript挑战也能高效爬取。 传统HTTP请求的局限性 在…

    2025年12月14日
    000
  • Selenium Headless Chrome 页面空白问题解决方案

    在使用 Selenium Headless Chrome 时,开发者可能会遇到一个令人困扰的问题:尽管浏览器成功启动,但通过 driver.page_source 获取到的页面源代码却为空,显示为 html> 以上就是Selenium Headless Chrome 页面空白问题解决方案的详细…

    2025年12月14日
    000
  • 使用Selenium与CSS选择器:动态网页数据提取实战指南

    本教程旨在详细阐述如何利用Selenium WebDriver结合CSS选择器高效地从JavaScript驱动的动态网页中提取结构化数据。文章将涵盖Selenium环境配置、元素定位核心方法、动态内容加载(如“加载更多”按钮)的处理策略,并通过一个实际案例演示如何抓取产品标题、URL、图片URL、价…

    2025年12月14日
    000
  • Python verify-email库:正确处理邮件验证结果而非捕获异常

    本文旨在阐明Python verify-email库的正确使用方式,特别是在处理邮件地址验证结果时。许多开发者可能误以为该库会在验证失败时抛出VerifyEmailError异常,但实际上,它通过返回布尔值True或False来指示验证结果。理解这一设计有助于避免AttributeError,并能以…

    2025年12月14日
    000
  • 解决Flask中Axios POST请求CORS错误的终极指南

    本文旨在帮助开发者解决在使用Flask作为后端,React前端通过Axios发送POST请求时遇到的CORS(跨域资源共享)问题。文章将深入分析问题原因,并提供详细的解决方案,包括后端配置和前端请求的正确姿势,以及使用FastAPI的替代方案。 CORS错误排查与解决 CORS (Cross-Ori…

    2025年12月14日
    000
  • 如何使用map, filter, reduce函数?

    map用于转换元素,filter用于筛选元素,reduce用于归约数组;三者以声明式方式操作数组,提升代码可读性与简洁性,支持链式调用并优于传统循环。 简而言之, map 用于转换数组中的每个元素, filter 用于筛选数组中的元素, reduce 用于将数组归约为单个值。它们都是强大的工具,可以…

    2025年12月14日
    000
  • 如何用Python读写JSON/CSV/Excel文件?

    Python处理JSON、CSV和Excel文件需根据数据格式特性和需求选择合适库:JSON用内置json模块实现序列化与反序列化;CSV可用csv模块或pandas进行读写,后者更适用于表格数据操作;Excel文件通常用pandas(结合openpyxl引擎)高效处理多工作表和复杂结构,或用ope…

    2025年12月14日
    000
  • 如何获取一个对象的所有属性和方法?

    答案:获取对象所有属性和方法需结合Reflect.ownKeys()和for…in。Reflect.ownKeys()返回对象自身所有键(包括字符串和Symbol,可枚举与不可枚举),而for…in可遍历原型链上的可枚举属性,配合hasOwnProperty()可区分自身与继…

    2025年12月14日
    000
  • 如何用Python解析HTML(BeautifulSoup/lxml)?

    答案是BeautifulSoup和lxml各有优势,适用于不同场景。BeautifulSoup容错性强、API直观,适合处理不规范HTML和快速开发;lxml基于C实现,解析速度快,适合处理大规模数据和高性能需求。两者可结合使用,兼顾易用性与性能。 用Python解析HTML,我们主要依赖像Beau…

    2025年12月14日
    000
  • 如何应对反爬虫策略?IP 代理与用户代理池

    IP代理与用户代理池协同工作可有效应对反爬虫,通过模拟多样化真实用户行为,结合高质量代理管理、请求头一致性、无头浏览器及Cookie会话控制等策略,提升爬虫隐蔽性与稳定性。 应对反爬虫策略,尤其是那些复杂的、动态变化的检测机制,IP代理和用户代理池无疑是构建健壮爬虫系统的两大基石。它们的核心思想是模…

    2025年12月14日
    000
  • 如何用Python实现一个简单的爬虫?

    答案:使用Python实现简单爬虫最直接的方式是结合requests和BeautifulSoup库。首先通过requests发送HTTP请求获取网页HTML内容,并设置headers、超时和编码;然后利用BeautifulSoup解析HTML,通过CSS选择器提取目标数据,如文章标题和链接;为避免被…

    2025年12月14日
    000
  • 使用 Selenium 进行动态网页抓取

    Selenium能执行JavaScript并模拟用户行为,适用于抓取动态渲染的网页内容。它通过启动真实浏览器实例,获取完整DOM结构,支持等待异步加载、点击按钮、滚动页面等交互操作,可应对单页应用、无限滚动、登录交互等复杂场景。相比requests+BeautifulSoup仅能获取静态HTML,S…

    2025年12月14日
    000
  • 如何序列化和反序列化一个Python对象(pickle)?

    pickle能序列化几乎所有Python对象,包括自定义类实例、函数等,但无法处理文件句柄、网络连接等外部资源,且存在跨版本兼容性问题;其反序列化过程可执行任意代码,因此不适用于不信任的数据源,易导致安全风险;相比JSON,pickle支持更丰富的Python类型且性能更高,但缺乏跨语言兼容性和安全…

    2025年12月14日
    000
  • 如何保证Python代码的安全性?

    Python代码安全需贯穿开发全流程,涵盖安全编码、依赖管理、敏感数据保护、错误处理与持续审计。 保证Python代码的安全性,在我看来,这从来就不是一个一劳永逸的任务,而是一个需要贯穿整个开发生命周期、持续投入精力的过程。它涉及从编写代码的每一个字符开始,到管理依赖、部署环境,再到后期的监控与审计…

    2025年12月14日
    000
  • 如何高效地连接多个字符串?

    答案是使用StringBuilder或join等方法可高效拼接字符串。Python推荐str.join(),Java和C#使用StringBuilder,JavaScript推荐Array.prototype.join()或模板字面量,核心是减少内存分配与对象创建,同时需权衡可读性、数据量、线程安全…

    2025年12月14日
    000
  • 如何实现数据的序列化和反序列化?

    序列化是将内存数据转为可存储或传输的格式,反序列化是将其还原。它解决数据持久化、跨系统通信、异构环境互操作等痛点。常见格式包括JSON(易读、通用)、XML(严谨、冗余)、Protobuf(高效、二进制)、YAML(简洁、配置友好)及语言特定格式如pickle(功能强但不安全)。选择需权衡可读性、性…

    2025年12月14日
    000
  • 如何理解Python的“一切皆对象”?

    Python中“一切皆对象”意味着所有数据都是某个类的实例,拥有属性和方法,包括数字、函数、类和模块,变量通过引用指向对象,带来统一的API、动态类型和引用语义,但也需注意可变对象共享、默认参数陷阱及性能开销。 理解Python的“一切皆对象”其实很简单:在Python的世界里,你所接触到的一切——…

    2025年12月14日
    000
  • 如何部署一个机器学习模型到生产环境?

    部署机器学习模型需先序列化存储模型,再通过API服务暴露预测接口,接着容器化应用并部署至云平台或服务器,同时建立监控、日志和CI/CD体系,确保模型可扩展、可观测且可持续更新。 部署机器学习模型到生产环境,简单来说,就是让你的模型真正开始“干活”,为实际用户提供预测或决策支持。这并非只是把模型文件复…

    2025年12月14日
    000

发表回复

登录后才能评论
关注微信