JavaScript——对象的创建

目录

任务描述

相关知识

对象的定义

对象字面量

通过关键字new创建对象

通过工厂方法创建对象

使用构造函数创建对象

使用原型(prototype)创建对象

编程要求

任务描述

本关任务:创建你的第一个 JavaScript 对象。

相关知识

JavaScript 是一种基于对象(Object-based)的语言,在 JavaScript 中,对象的创建和 Java 不同,既有 Java 使用的构造函数方式,也有其他方法。

对象的定义

JavaScript 中的一切都是对象,这是该语言一个很大的特点。像字符串、数组等已经定义的对象叫做内置对象。用户自己也可以定义对象,叫做自定义对象。本实训讲的对象特指自定义对象,自定义对象指数据和函数(又叫方法)的集合。数据指变量名和变量的值构成的组合。如图1所示:

图1

下面介绍五种创建对象的方法,其中通过对象字面量和使用构造函数创建对象最常用。

对象字面量

这是最常用的创建对象的方法,通过新建一个键值对的集合(对象字面量)创建对象,如下:

var song = {
    name:"Liekkas",
      time:180,
      "song language":English,
      singer: {
        singerName:"Sofia Jannok",
            singerAge:30
    }
};

键值对中的键指的是属性的名字,若其中含有空格,名字需要用双引号包含在内。值指的是属性的值,可以是基本类型:如字符串,数字,布尔型,也可以是一个对象。键值对之间用逗号隔开,最后一个键值对后面没有逗号,所有的键值对在一个大括号中。

通过关键字new创建对象

通过new关键字创建对象也是一个常用的方法。如下:

var Store = new Object();    // 创建对象的一个实例
Store.name = "lofo Market";
Store.location = "NO.13 Five Avenue";
Store.salesVolume = 1000000;

通过上面的代码,我们就能创建一个名为Store的对象。

通过工厂方法创建对象

工厂方法就是通过函数创建对象,函数封装了创建对象的过程。

这是一种通过函数创建对象的方法,函数封装了对象的创建过程,创建新对象时只需要调用该函数即可。这种方法适合于一次创建多个对象。

// 对象的创建函数
function createStoreObject(name,location,salesVolume) {
    var store = new Object();
    store.name = name;
    store.locaion = location;
    store.salesVolume = salesVolume;
    store.display = function() {
          console.log(this.name);
    };
    return store;
}
// 利用该函数创建一个对象
var store1 = createStoreObject("panda express","No.1,People Street",200000);

这样就创建了一个名为store1的对象,注意这个对象除了属性之外还有一个方法display。要创建更多的类似store1的对象,直接调用该函数即可。

使用构造函数创建对象

上面虽然也是通过函数创建对象,但不是构造函数,只是普通函数。构造函数名必须以大写字母开头,函数体内没有返回语句。

// 构造函数
function Store(name,location,salesVolume) {
    this.name = name;
    this.locaion = location;
    this.salesVolume = salesVolume;
}
// 创建对象的实例
var myStore = new Store("KeyExp","No.1,L.Street",540000);

上面的代码首先是Store对象的构造函数,然后用该构造函数创建了Store对象的一个实例myStore

使用原型(prototype)创建对象

当我们创建一个函数时,函数就会自动拥有一个prototype属性,这个属性的值是一个对象,这个对象被称为该函数的原型对象。也可以叫做原型。

当用new关键字加函数的模式创建一个对象时,这个对象就会有一个默认的不可见的属性[[Prototype]],该属性的值就是上面提到的原型对象。如图2所示:

图2

JavaScript 中每个对象都有一个属性[[Prototype]],指向它的原型对象,该原型对象又具有一个自己的[[Prototype]],层层向上直到一个对象的原型为null。根据定义,null 没有原型,并作为这个原型链中的最后一个环节。如图3所示:

图3

这种方法是对使用构造函数创建对象的改进,使用构造函数创建一个对象时,会把构造函数中的方法(上面的构造函数只有属性的键值对,没有方法)都创建一遍,浪费内存,使用原型不存在这个问题。

function Store() {};
Store.prototype.name = "SF Express";
Store.prototype.locaion = "Hong Kong";
Store.prototype.salesVolume = 1200000000;
// 创建对象
var myStore = new Store();
// 创建一个新的对象
var hisStore = new Store();
hisStore.name = "STO Express";    // 覆盖了原来的name属性

这种方法的好处是,创建一个新的对象时,可以更改部分属性的值。

编程要求

本关的编程任务是补全右侧代码片段中 Begin 至 End 中间的代码,具体要求如下:

  • 使用对象字面量方法创建名为student的对象,有两个属性namegender,他们的值分别是mainJs()函数的参数a和参数b

  • 使用已给的构造函数Car(plate,owner)创建一个对象myCar,它的两个属性的值分别是参数c和参数d

  • 使用原型创建一个对象myJob,它的构造函数是Job(company,salary),它的两个属性的值已经被设置,你需要用参数e覆盖属性company的值;

function Car(plate,owner) {
    this.plate = plate;
    this.owner = owner;
}

function Job() {};
Job.prototype.company = "myCompany";
Job.prototype.salary = 12000;

function mainJs(a,b,c,d,e) {
	//请在此处编写代码
    /*********bigin*********/
    var student = {
        name: a,
        gender: b,
    };
    var myCar = new Car(c, d);
    var myJob = new Job();
    myJob.company = e;
    /*********end*********/
    return student.name+student.gender+myCar.plate+myCar.owner+myJob.company;
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/764061.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Spring Boot配置文件properties/yml/yaml

一、Spring Boot配置文件简介 (1)名字必须为application,否则无法识别。后缀有三种文件类型: properties/yml/yaml,但是yml和yaml使用方法相同 (2) Spring Boot 项⽬默认的配置文件为 properties &#xff…

kafka线上问题:rebalance

我是小米,一个喜欢分享技术的29岁程序员。如果你喜欢我的文章,欢迎关注我的微信公众号“软件求生”,获取更多技术干货! 大家好,我是小米。今天,我们来聊聊一个在大数据处理领域常见但又令人头疼的问题——Kafka消费组内的重平衡(rebalance)。这可是阿里巴巴面试中的经…

惠海 H6912 升压恒流芯片IC 支持2.6-40V升12V24V36V48V60V100V 10A 摄影灯 太阳能灯 UV灯 杀菌灯

1.产品描述 H6912是一款外围电路简洁的宽调光比升压调光LED恒流驱动器,可适用于2.6-40V输入 电压范围的LED恒流照明领域。H6912可以实现高精度的恒流效果,输出电流恒流精度≤士3%,电压工作范围为2.6-40V.可以轻松满足锂电池及中低压的应用需…

第十四届蓝桥杯省赛C++B组D题【飞机降落】题解(AC)

解题思路 这道题目要求我们判断给定的飞机是否都能在它们的油料耗尽之前降落。为了寻找是否存在合法的降落序列,我们可以使用深度优先搜索(DFS)的方法,尝试所有可能的降落顺序。 首先,我们需要理解题目中的条件。每架…

R语言学习笔记1-介绍与安装

R语言学习笔记1-介绍与安装 简介应用领域R语言优势安装步骤(linux版本)在R脚本中绘制简单的条形图示例 简介 R语言是一种非常强大和流行的据分析和统计建模工具。它是一种开源的编程语言和环境,专门设计用于数据处理、统计分析和可视化。 应…

PHP贵州非遗推广小程序-计算机毕业设计源码14362

摘 要 本文设计并实现了一个基于贵州非遗推广的小程序,旨在通过小程序平台推广和展示贵州省非物质文化遗产。该小程序提供了非遗项目介绍、相关活动展示、购买非遗产品等功能。 首先,我们收集了贵州省各个非遗项目的资料和相关信息,并将其整理…

vue3中使用弹幕组件vue-danmaku

1、最开始使用的是vue3-marquee,后面发现一直有一个bug无法解决,就是鼠标hover到第一个弹幕上字体就会变粗,已经提了issue给作者,但是目前还未答复,所以就换了方案。 地址如下: https://github.com/megasa…

同时安装JDK8和JDK17+环境变量默认无法修改

一、问题描述 当在windows系统中,同时安装JDK8和JDK17,环境变量默认就为jdk17,且从jdk17切换为jdk8后不生效,使用"java -version"命令查看后还是17版本。 解决方法 首先,产生的原因是,在安装…

【高性能服务器】多进程并发模型

🔥博客主页: 我要成为C领域大神🎥系列专栏:【C核心编程】 【计算机网络】 【Linux编程】 【操作系统】 ❤️感谢大家点赞👍收藏⭐评论✍️ 本博客致力于知识分享,与更多的人进行学习交流 对于常见的C/S模型…

MySQL 9.0创新版发布!功能又进化了!

作者:IT邦德 中国DBA联盟(ACDU)成员,10余年DBA工作经验, Oracle、PostgreSQL ACE CSDN博客专家及B站知名UP主,全网粉丝10万 擅长主流Oracle、MySQL、PG、高斯及Greenplum备份恢复, 安装迁移,性能优化、故障…

【ARM系列】1of N SPI

1 of N模式 SPI 概述配置流程 概述 GIC-600AE支持1 of N模式SPI。在此模式下可以将SPI target到多个core,并且GIC-600AE可以选择哪些内核接收SPI。 GIC-600AE只向处于powered up 并且使能中断组的core发送SPI。 GIC-600AE会优先考虑那些被认为是active的核&#xf…

如何利用Stable Diffusion在AI绘画领域赚钱,(附详细教程)小白兼职必看!

前言 AIGC 现已成为内容生产的引擎,正为内容创作领域带来前所未有的变革。它不仅能够在文本、图像、视频、音频等单一模态上生成内容,更能实现跨模态的生成,打通了多模态间的壁垒。 对于“普通人”来说,理解并有效的学会利用 AI…

方法重载与重写的区别

1.方法重载和重写都是实现多态的方式,区别在于重载是编译时多态,重写是运行时多态。 2.重载是在同一个类中,两个方法的方法名相同,参数列表不同(参数类型、顺序、个数),与方法返回值无关&#x…

电路里电源不仅仅是电源

电源往往被认为是直流控制电路中重要的考虑因素之一——但我们也不能忽视其他关键因素:电源滤波器、转换器和备用电源模块。 输入电源是任何电气控制系统的基本配置。没有电源,就没有传感器、控制器、负载设备,什么都没有。因此,…

windows下搭建python+jupyter notebook

一.下载python 下面网址下载python3 https://www.python.org/ 二. 安装jupyter notebook 三. 修改配置 四. 检测是否正常运行

夸克网盘拉新暑期大涨价!官方授权渠道流程揭秘

夸克网盘拉新暑期活动来袭,价格大涨!从7月1日开始持续两个月,在这两个月里夸克网盘拉新的移动端用户,一个从原来的5元涨到了10元。这对做夸克网盘拉新的朋友来说,真的是福利的。趁着暑期时间多,如果有想做夸…

【工具推荐】Clink

文章目录 Clink介绍Clink安装删除版权信息 Clink介绍 Clink 是一个工具,它将 GNU Readline 库的强大命令行编辑功能与 Windows 原生的 cmd.exe 命令提示符结合在一起。Readline 是 Bash shell 中众所周知的库,Bash 是许多 Linux 发行版的标准 shell。通…

【高性能服务器】多线程并发模型

🔥博客主页: 我要成为C领域大神🎥系列专栏:【C核心编程】 【计算机网络】 【Linux编程】 【操作系统】 ❤️感谢大家点赞👍收藏⭐评论✍️ 本博客致力于知识分享,与更多的人进行学习交流 ​​ 对于常见的C/…

C语言使用先序遍历创建二叉树

#include<stdio.h> #include<stdlib.h>typedef struct node {int data;struct node * left;struct node * right; } Node;Node * createNode(int val); Node * createTree(); void freeTree(Node * node);void preOrder(Node * node);// 先序创建二叉树 int main()…

猫头虎博主全栈前沿AI技术领域矩阵社群

猫头虎博主全栈前沿AI技术领域矩阵社群 &#x1f44b;大家好&#xff0c;我是猫头虎&#xff01;今天我要向大家介绍一个非常重要的社群矩阵——专为全栈前沿AI技术领域的朋友们打造的各种技术交流和资源互助的社群。这些社群不仅能帮助大家快速提升技术水平&#xff0c;还能拓…