共计 3252 个字符，预计需要花费 9 分钟才能阅读完成。
这是 Jerry 2021 年的第 5 篇文章，也是汪子熙公众号总共第 276 篇原创文章。
系列目录
(0) SAP UI5 利用开发人员理解 UI5 框架代码的意义
(1) UI5 module 懒加载机制
(2) UI5 控件渲染机制
(3) HTML 原生事件 VS SAP UI5 Semantic 事件
(4) UI5 控件元数据的元数据实现(本文）
(5) UI5 控件的实例数据实现细节
(6) UI5 控件数据绑定的实现原理
(7) UI5 控件数据绑定的三种模式：One Way，Two Way 和 OneTime 实现原理比拟
(8) UI5 控件 ID 的生成逻辑
(9) UI5 控件的多语言 (国际化,Internationalization,i18n) 反对的实现原理
(10) XML 视图里的 button 控件
(11) button 控件和它背地的 DOM 元素
在本系列的第二篇文章：深刻学习 SAP UI5 框架代码系列之二：UI5 控件的渲染器 里，咱们理解了什么是 UI5 控件的渲染器(Renderer), 以及如何从 SAP UI5 控件的元数据里，取得其对应渲染器的名称：sap.ui.commons.ButtonRenderer
本文咱们将理解更多对于 SAP UI5 控件元数据的细节。
注：您会发现本文的 SAP UI5 框架调试截图，有些是红色背景，有些是深色背景。前者是 Jerry 2015 年书写本系列英文版时所截的图，后者为 2021 年 Jerry 将英文版改写成中文版，并从新公布在微信公众号平台上时截的图。
如何在运行时获取 SAP UI5 控件的元数据？
拿到控件实例后，调用其 getMetadata()办法即可。
运行 Jerry 文章 一个用于 SAP UI5 学习的脚手架利用，没有任何后盾 API 的依赖 里提到的 SAP UI5 脚手架利用，在下图第 19 行设置断点，拿到 button 控件实例 oButton1, 调用其 getMetadata 办法，返回值就是 button 控件的元数据，如下图左边所示。
元数据里字段很多，这里只介绍对 SAP UI5 利用开发人员来说最重要的一部分字段：
_aAllPublicMethods
当咱们在 Chrome 开发者工具的 console 面板里，输出 oButton1 之后，紧接着再敲一个 ”.”(英文输出状态下的句号)，就能看到该 button 实例可能调用的一系列私有办法。这些私有办法列表，保护在元数据里的数组_aAllPublicMethods.
这个数组的 length 为 110，这意味着 button 实例总共能够调用 110 个私有办法。然而咱们在 Button.js 里查看 button 的实现源代码，发现外面可能找到的办法数目远远小于 110.
这是因为 button 控件实例能调用的 110 个私有办法，很多都来自其原型链继承关系上游的节点里实现的私有办法。
回顾本系列第一篇文章 深刻学习 SAP UI5 框架代码系列之一：UI5 Module 的懒加载机制 提到的 SAP UI5 控件原型继承链：
Button->Control->Element->ManagedObject->EventProvider->BaseObject
想判断一个办法是 button 自身所实现，还是从其原型链继承过去的，能够将办法名称传入函数 oButton1.hasOwnProperty, 通过其返回的布尔值得悉后果。
比方 getText 是 button 原型链上的一个办法，因而上面的 JavaScript 语句返回：false.
_aAllPublicMethods 数组的填充逻辑：控件自身的私有办法和其原型链下级节点的私有办法的并集(下图高亮 JavaScript 代码里数组的 concat 操作)
_aPublicMethods
该数组内的元素是刚刚介绍过的_aAllPublicMethods 的一个子集，定义在 metadata 的_publicMethods 字段内。下图是 UI5 控件原型链上的节点，EventProvider 的 publicMethods:
_mAllAggregations
该对象保护了控件所有可用的 Aggregation.
在面向对象编程畛域，咱们罕用 association, aggregation(聚合)和 composition(组合)形容类与类，对象与对象之间的关联关系。
Aggregation 形容的是 has- a 的语义，在 UML 图里通过空心菱形箭头示意，比方 tooltip 能够脱离 button 控件独自存在；Composition 关系形容 part-of，即局部和整体的语义，用实心菱形箭头示意。
下图是一个例子：button 控件的 tooltip 以 Aggregation 的形式保护和存储在控件元数据当中，通过 getTooltip 和 setTooltip 进行读写访问。
对于 SAP UI5 Aggregation 的权威介绍，能够查看 SAP UI5 官网.
官网里给出的一个例子，TextList 的元数据里定义了一个指向 texts 的 aggregation, 关系为 1:N.
_mProperties
该对象蕴含了 button 控件所有可用的属性，以及针对这些属性的读写办法。留神 mProperties 存储的只是控件属性的元数据，而非属性运行时的值。SAP UI5 控件运行时属性值的存储，会在本系列下一篇文章 UI5 控件的实例数据实现细节 里介绍。
_oParent
指向该控件原型链父节点的元数据存储构造。顺着节点的 oParent 字段，咱们能够遍历残缺个原型链。
SAP UI5 button 控件的私有办法，从 Jerry 2015 年写作时的 110 个，削减到了 2021 年 1.85.0 版本里的 127 个：
咱们有两种形式能够手动计算出 127 这个数字。
办法 1：button 元数据的_aPublicMethods.length + _oParent._aAllPublicMethods.length
办法 2：button 本身，及其原型链上每个节点元数据的_aPublicMethods.length 求和：
Jerry 最近用 Angular 开发 SAP Spartacus 时，也会在 Angular Component 的 template 文件里应用控件。
这些控件的实现分为三类：
(1) 间接利用 HTML 原生标签，例如 div, span, label, input 这些：
(2) 由前缀为 cx- 的选择器代表的复合控件，这是咱们团队开发的可能被 SAP Spartacus 其余 UI 和二次开发人员重用的控件，cx 即 Customer Experience.
比方下列高亮代码的语义是，如果以后 Component 的 orderApproval 模型处于可用状态，且 loading 标记位为 true，则显示一个旋转的动画成果，即加载第四行的复合控件 cx-spinner, 否则加载 id 为 approvalFormTemplate 的页面模板。复合控件实质上依然是一个 Angular Component:
对于以上这两种控件实现，不存在相似 SAP UI5 那样的源代码级别的元数据数据结构。
(3) 第三方提供的控件库，比方 ng-select, 一个下拉菜单控件库：
在 node_modules 文件夹下的 ng-select.component.d.ts 文件里，即可找到相似 SAP UI5 控件的元数据定义：
本系列下一篇文章，会介绍 SAP UI5 控件实例在运行时的属性值存储和读取实现，感激浏览。
更多浏览
(0) SAP UI5 利用开发人员理解 UI5 框架代码的意义
(1) UI5 module 懒加载机制
(2) UI5 控件渲染机制
(3) HTML 原生事件 VS SAP UI5 Semantic 事件
(4) UI5 控件元数据的元数据实现(本文）
(5) UI5 控件的实例数据实现细节
(6) UI5 控件数据绑定的实现原理
(7) UI5 控件数据绑定的三种模式：One Way，Two Way 和 OneTime 实现原理比拟
(8) UI5 控件 ID 的生成逻辑
(9) UI5 控件的多语言 (国际化,Internationalization,i18n) 反对的实现原理
(10) XML 视图里的 button 控件
(11) button 控件和它背地的 DOM 元素
更多 Jerry 的原创文章，尽在：” 汪子熙 ”:
