SAP Fiori开发中的JavaScript基础知识5 - 对象(Object)

1 背景

在本篇博客中,我将介绍JavaScript中对象(Object)的概念和用法。

2 对象

首先我们要明明确一点,在JavaScript中对象(Object)和类(Class)是不同的,它们是两个不同的概念。

对象 (Object) 是JavaScript的数据类型之一,它是一种复合数据类型,它是键/值对的集合,它们可以是基本类型的值,也可以是其他对象或函数,这些键/值对被称为对象的属性(Property)。

JavaScript中并没有真正的类。

JavaScript是一种基于原型的编程语言,它并没有像Java或ABAP中那样传统的类(Class)。在JavaScript中,只是使用函数和原型链来实现类似类的行为。在JavaScript中,类是可以看做是一种特殊的函数,是创建对象的模板。

类(Class) 是ES6(ECMAScript 2015)引入的关键字,允许我们使用类似于传统面向对象语言的语法来创建对象。这看起来像是JavaScript引入了真正的类,但实际上,这只是基于原型的继承的语法糖。

在后续的博客中,我将进一步解释class关键字。

2.1 对象的创建

在JavaScript中,对象可以通过两种方式创建:声明式定义 和 构造式定义。

声明式定义:这是最常见的创建对象的方式。

let obj = {key1: 'value1',key2: 'value2',key3: function() {// ...},key4: ['content1', 'content2']
};

构造式定义:这种方式使用new关键字和Object()构造函数。

let obj = new Object();
obj.key1 = 'value1';
obj.key2 = 'value2';
obj.key3 = function() {// ...
};
obj.key4 = ['content1', 'content2'];

2.2 对象的使用

一旦创建了对象,我们就可以通过 .[ ] 来访问、修改或添加对象的属性。

// 访问属性
console.log(obj.key1); // 输出:value1
console.log(obj['key2']); // 输出:value2// 修改属性
obj.key1 = 'new value';
console.log(obj.key1); // 输出:new value// 添加新属性
obj.key5 = 'value5';
console.log(obj.key5); // 输出:value5

可以使用.hasOwnPropery(“property”)来检查是否有某个属性。

console.log(obj.hasOwnProperty("key1")); // 输出:true

此外,我们还可以使用delete关键字来删除对象的属性。

delete obj.key1;
console.log(obj.key1); // 输出:undefined

我们可以使用Object.keys()Object.getOwnPropertyNames() 来获取对象属性名的方法。

它们的区别在于Object.keys() 只返回可枚举的属性,而 Object.getOwnPropertyNames() 返回对象的所有自身属性,包括不可枚举的属性。


console.log(Object.keys(obj)); 
console.log( Object.getOwnPropertyNames(obj)); 

2.3 对象声明和使用的一些示例代码

下面给出了基于命名规范的一些代码示例:


//对象的声明
let oPerson = {sName: "Michael Jordan",iAge: 35,oBody: {iLegs: 2,iArms: 2,iHead: 1},fnGetAge: function () { return this.iAge },fnPrintData: function () { console.log("My name is " + this.sName + ". I'm " + this.iAge + ". I have " + this.oBody.iArms + " arms."); }}//对象的使用
console.log("----------------");
console.log(oPerson.sName);
console.log(oPerson["oBody"]);
console.log(oPerson.fnGetAge());
oPerson.fnPrintData();
console.log(oPerson);//对象属性的处理
console.log("----------------");
for (prop in oPerson) {if (oPerson.hasOwnProperty(prop)) {console.log(prop + ": " + oPerson[prop]);}
}console.log("----------------");
delete oPerson.sName;
console.log(oPerson.sName); // 输出:undefinedconsole.log("----------------");
console.log(oPerson.hasOwnProperty("sName")); // 输出false, 因为此属性已经被删除
console.log(oPerson.hasOwnProperty("iAge"));
console.log(oPerson.hasOwnProperty("oBody"));console.log("----------------");
console.log(Object.keys(oPerson)); 
console.log(Object.getOwnPropertyNames(oPerson));

3. 小结

本文介绍了JavaScript中对象(Object)的概念和用法,并给出了相应的示例代码。在理解上,要注意区分对象与传统类的区别。希望本篇博客对您有帮助!

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

《论文阅读》PAGE:一个用于会话情绪原因蕴含基于位置感知的图模型 ICASSP 2023

《论文阅读》PAGE:一个用于会话情绪原因蕴含基于位置感知的图模型 ICASSP 2023 前言 简介任务定义模型构架Utterances Encoding with EmotionPosition-aware GraphCausal Classifier实验结果 前言 亲身阅读感受分享,细节画图解释,再也不用担…

极简wordpress网站模板

Pithy设计师wordpress网站模板 精练简洁的wordpress模板,设计师或设计工作室展示型网站模板。 https://www.jianzhanpress.com/?p6329

Clickhouse中的基本数据类型操作和引擎

一、表操作 数据类型: 注意事项: 1、建表写数据类型的时候,严格区分大小写Int32,不能写成int32 2、建表的时候,必须要指定表引擎 1.整数类型 2. 字符串类型 String:可以任意长度的。它可以包含任意的字节集,包含空字…

Avalonia笔记4-Rider如何添加xaml支持

在Linux Rider中,File Type中是有XAML文件的,但是新增xaml文件并不能正确的添加到项目中,而且就算是新增文件,直接命名为“XXX.xaml”,也是没有智能提示的。 在引用Style文件的时候,需要新建一个axaml的文…

【uniapp】Vue3移动端滚动加载 分页组件的封装

今天用uniapp开发时想用vue3的组合式函数封装一个分页组件,如果是vue2自然就是用mixin了,因为组合式函数更灵活简洁,而且现在也写习惯了,还是决定封装一个vue3版的。 思路: 因为uniapp特有的对一些小程序生命周期的支…

2024,听世界用中文讲故事

汉语为桥,联结一段中国缘分;故事为骨,分享一段精彩人生;文化为翼,共筑一个和美地球村。近日,由教育部中外语言交流合作中心主办、中文联盟承办的第二届“汉语桥”全球外国人汉语大会故事会启动。与世界深情…

k8s调优--来自gpt

Kubernetes(K8s)性能调优是一个涉及多个方面的过程,旨在提高集群的效率和响应速度。这包括对节点、Pod、服务、网络和存储等多个层面进行调优。下面我将概述一些常见的Kubernetes性能调优方法: 节点级别的调优: 1.资源分配&…

网站可扩展架构设计

从公众号转载,关注微信公众号掌握更多技术动态 --------------------------------------------------------------- 一、可扩展性架构简介 1.可扩展性是什么 可扩展性指系统为了应对将来需求变化而提供的一种扩展能力,当有新的需求出现时,系…

【数据结构】链表习题之反转链表和删除链表中等于给定值 val 的所有节点

👑个人主页:啊Q闻 🎇收录专栏:《数据结构》 🎉道阻且长,行则将至 前言 今天的博客是关于链表的题目,力扣上的题目之反转链表和删除链表中等于给定值 val 的所有节点 一.反转…

基于SpringBoot的“篮球竞赛预约平台”的设计与实现(源码+数据库+文档+PPT)

基于SpringBoot的“篮球竞赛预约平台”的设计与实现(源码数据库文档PPT) 开发语言:Java 数据库:MySQL 技术:SpringBoot 工具:IDEA/Ecilpse、Navicat、Maven 系统展示 系统总体结构图 平台首页界面图 用户注册界面…

使用Qt生成图片

Qt之生成png/jpg/bmp格式图片_qt生成图片-CSDN博客 (1)使用QPainter 示例关键代码: QImage image(QSize(this->width(),this->height()),QImage::Format_ARGB32);image.fill("white");QPainter *painter new QPainter(&image);painter->…

QT程序打包

将exe文件单独拿出来放入一个单独的文件夹 保存qt安装路径下有如下这个文件 windeployqt.exe 在TCPFile.exe文件夹中使用以下cmd命令运行 即可打包 windeployqt 文件名.exe 成功打包!

软件质量指标

软件质量指标 1、功能性质量指标 功能的正确性功能的准确性功能的完整性 2、可用性质量指标 可操作性通用性一致性 3、可靠性质量指标 系统自我恢复能力健壮性系统分布性 4、性能的质量指标 有效性安全管理/完整性易存取性 5、可维护性的质量指标 模块化增强能力/灵活…

功能强大的国外商业PHP在线教育系统LMS源码/直播课程系统

功能强大的国外商业PHP在线教育系统LMS/在线教育市场源码/直播课程系统 Proacademy是在线教育一体化的解决方案,用于创建类似于Udemy、Skillshare、Coursera这种在线教育市场。 这个平台提供在线课程,现场课程,测验等等,并有一个…

评价指标1. 均方误差(Mean Squared Error,MSE):

1. 均方误差(Mean Squared Error,MSE): MSE是预测值与真实值之间差异的平方和的平均值,计算公式为: ���1�∑�1�(�&#…

被迫走上前端之路第三课之vue的v-on事件监听

在vue的事件处理中,使用v-on来监听DOM事件,并在事件触发时执行对应的 JavaScript。 DOM事件:DOM(document object model)事件是指在HTML文档中发生的特定交互瞬间,如点击、鼠标移动、键盘按键等。 语法 &l…

第十篇【传奇开心果系列】Python自动化办公库技术点案例示例:深度解读Python自动化操作Excel

传奇开心果博文系列 系列博文目录Python自动化办公库技术点案例示例系列博文目录 前言一、重要作用解说二、Python操作Excel的常用库介绍三、数据处理和分析示例代码四、自动化报表生成示例代码五、数据导入和导出示例代码六、数据可视化示例代码八、数据校验和清洗示例代码九、…

go面向对象

继承 封装 多态 定义结构体 //定义老师的结构体 type Teacher struct {Name stringAge intSchool string }func main() {var t1 Teacherfmt.Println(t1)t1.Name "tom"t1.Age 20t1.School "school"fmt.Println(t1) } 结构体实例的创建 package ma…

Day33:学习尚上优选项目

学习计划:完成尚硅谷的尚上优选项目 学习进度:尚上优选项目 知识点: 一、项目概述 项目介绍业务流程功能架构技术架构核心技术项目模块其他资源 二、前后端分离开发概述 什么是前后端分离开发开发流程介绍 三、搭建后端环境 搭建项目结…

uniApp使用XR-Frame创建3D场景(4)金属度和粗糙度

上一篇讲解了如何在uniApp中创建xr-frame子组件并创建简单的3D场景。 这一篇我们讲解xr-frame中关于mesh网格材质的金属度和粗糙度的设置。 1.先看源码 <xr-scene render-system"alpha:true" bind:ready"handleReady"> <xr-node visible"{…