《Ember.js实战》——2.5 Ember.js对象模型

简介: 这时你可能会认为,我们仍看不到这种方式优于匿名Ember.Object.create()实现的地方。但是,对于Ember.js应用中用到的所有数据类型和对象而言,显式定义类通常是个好主意。即使这么做需要更多的代码,但你清晰地展示了实例化一个对象的意图,并且可以明确分隔各个业务模型对象。

本节书摘来自异步社区《Ember.js实战》一书中的第2章,第2.5节,作者:【挪】Joachim Haagen Skeie(乔基姆•哈根•斯基)著,更多章节内容可以访问云栖社区“异步社区”公众号查看

2.5 Ember.js对象模型

Ember.js扩展了JavaScript默认对象类的定义,以构建一个更强大的对象模型。此外,Ember.js还支持基于混入类的方式,在模块与模块之间、应用与应用之间共享代码。

你可能想了解Ember.js是怎样知道某个属性发生改变的,以及它何时触发观察者函数和绑定对象。同时你可能还注意到,Ember.js总是要求使get()和set()方法来获取或修改Ember.Object子类对象的属性。当在一个属性上调用set()方法,Ember.js就会检查更新值与对象原有属性值是否不同,如果不同,Ember.js就会触发绑定对象、观察者函数或者计算属性函数。

尽管刚接触Ember.js时使用get()和set()方法看起来可能有点不习惯,但这却是确保Ember.js统一智能处理观察者、绑定、计算属性以及DOM操作的重要机制。实际上,使用get()和set()方法是Ember.js解决涉及多个DOM元素更新及绑定性能问题的重要基础。

创建自定义Ember.js对象通常有两种方式,要么通过extend()方法扩展其他Ember.js对象并添加自定义功能,要么用create()方法创建一个Ember.js对象实例。无论选择哪种方式,应用程序中创建的每个对象都以某种方式扩展自Ember.Object类,Ember.Object是基础类,其确保Ember.js能够提供本书涉及的所有功能。

想像一下,不通过扩展DS.Model来实现Notes.Note模型对象,绕开Ember Data,自己实现一个Notes.Note模型,如代码清单2-9所示。

代码清单2-9 创建Notes.Note对象

screenshot

不像使用Ember.Object.create()创建一个匿名Note实例,这里通过扩展Ember.Object类创建了一个显式的Notes.Note类。注意以下两点。

  • 现在还没有Notes.Note类的实例,因为extend()方法并不`返回一个实例。
  • Note类开始于大写的“N”,这个记号对于你,乃至Ember.js框架,都意味着Note是一个类定义,而非对象实例。

要创建Notes.Note类的新实例,请使用create()方法:

screenshot

这时你可能会认为,我们仍看不到这种方式优于匿名Ember.Object.create()实现的地方。但是,对于Ember.js应用中用到的所有数据类型和对象而言,显式定义类通常是个好主意。即使这么做需要更多的代码,但你清晰地展示了实例化一个对象的意图,并且可以明确分隔各个业务模型对象。最终代码可读性强、更易于维护,而且容易测试。

明确定义应用程序对象还使得在正确的地方添加观察者、绑定以及计算属性变得容易,并确保应用快速应变。考虑这样一个场景,原先后台应用为每个Note对象的value属性提供了纯文本实现方式,以将属性值编码成Markdown格式,但现在要编码成HTML格式了。如代码清单2-10所示,如果在应用程序中显式定义了Notes.Note,就很容易添加这个功能。

代码清单2-10 添加计算属性,将Markdown格式转换为HTML格式

screenshot

一旦成功实现了Notes.convertFromMarkdownToHtml函数,接下来就可以在应用视图模板中将原先使用value的方式更改为使用新增的计算属性htmlValue,这个改变显然易如反掌;简单更改视图Handlebars模板(见代码清单2-2)的代码如下:

screenshot

这样,记事本应用程序就改好了。接下来具体了解Ember.js MVC模式下各层之间如何同步数据。

相关文章
|
11月前
|
JavaScript 前端开发
如何在 JavaScript 中使用 __proto__ 实现对象的继承?
使用`__proto__`实现对象继承时需要注意原型链的完整性和属性方法的正确继承,避免出现意外的行为和错误。同时,在现代JavaScript中,也可以使用`class`和`extends`关键字来实现更简洁和直观的继承语法,但理解基于`__proto__`的继承方式对于深入理解JavaScript的面向对象编程和原型链机制仍然具有重要意义。
|
6月前
|
编解码 JavaScript 前端开发
【Java进阶】详解JavaScript的BOM(浏览器对象模型)
总的来说,BOM提供了一种方式来与浏览器进行交互。通过BOM,你可以操作窗口、获取URL、操作历史、访问HTML文档、获取浏览器信息和屏幕信息等。虽然BOM并没有正式的标准,但大多数现代浏览器都实现了相似的功能,因此,你可以放心地在你的JavaScript代码中使用BOM。
190 23
|
11月前
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
11月前
|
JSON 前端开发 JavaScript
JavaScript中对象的数据拷贝
本文介绍了JavaScript中对象数据拷贝的问题及解决方案。作者首先解释了对象赋值时地址共享导致的值同步变化现象,随后提供了五种解决方法:手动复制、`Object.assign`、扩展运算符、`JSON.stringify`与`JSON.parse`组合以及自定义深拷贝函数。每种方法都有其适用场景和局限性,文章最后鼓励读者关注作者以获取更多前端知识分享。
168 1
JavaScript中对象的数据拷贝
|
11月前
|
JavaScript 前端开发 图形学
JavaScript 中 Math 对象常用方法
【10月更文挑战第29天】JavaScript中的Math对象提供了丰富多样的数学方法,涵盖了基本数学运算、幂运算、开方、随机数生成、极值获取以及三角函数等多个方面,为各种数学相关的计算和处理提供了强大的支持,是JavaScript编程中不可或缺的一部分。
|
存储 JavaScript 前端开发
JavaScript 对象的概念
JavaScript 对象的概念
123 4
|
Web App开发 JavaScript 前端开发
深入理解Node.js事件循环和异步编程模型
【10月更文挑战第9天】在JavaScript和Node.js中,事件循环和异步编程是实现高性能并发处理的基石。本文通过浅显易懂的语言和实际代码示例,带你一探究竟,了解事件循环的工作原理及其对Node.js异步编程的影响。从基础概念到实际应用,我们将一步步解锁Node.js背后的魔法,让你的后端开发技能更上一层楼!
|
存储 JavaScript 前端开发
js中函数、方法、对象的区别
js中函数、方法、对象的区别
233 2
|
缓存 JavaScript 前端开发
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
JavaScript中数组、对象等循环遍历的常用方法介绍(二)
165 1
|
JavaScript 前端开发 Unix
Node.js 全局对象
10月更文挑战第5天
107 2

热门文章

最新文章