JS编程建议——68:推荐使用链式语法

简介: 68:推荐使用链式语法

建议68:推荐使用链式语法
使用过jQuery框架的读者,都会对jQuery简洁的语法、灵巧的用法赞叹不已,其中一个最大亮点就是jQuery的链式语法。在JavaScript中,很多方法没有返回值,一些设置或修改对象的某个状态却不返回任何值的方法就是典型的例子。如果让这些方法返回this,而不是undefined,那么就要启用级联功能,即所谓的链式语法。在一个级联中,单独一条语句可以连续调用同一个对象的很多方法。
getElement('box').

move(350, 150).
width(100).height(100).
color('red').
border('10px outset').
padding('4px').
appendText("使用链式语法")

在上面代码中,getElement函数获取id='box'的DOM元素,然后通过链式语法分别调用DOM元素的扩展方法来移动元素、修改尺寸和样式,以及添加行为。由于每一个扩展方法都返回参数对象,所以调用返回的结果可以为下一次调用所用。链式语法可以产生具备很强表现力的接口,以产生出试图一次做很多事情的接口的趋势。
在下面示例中,分别为String扩展了3个方法:trim、writeln和alert,其中writeln和alert方法返回值都为this,而trim方法返回值为修剪后的字符串。这样用户就可以利用链式语法在一行语句中快速调用这3个方法。
Function.prototype.method = function(name, func) {

if(!this.prototype[name]) {
    this.prototype[name] = func;
    return this;
}

};
String.method('trim', function() {

return this.replace(/^\s+|\s+$/g, '');

});
String.method('writeln', function() {

document.writeln(this);
return this;

});
String.method('alert', function() {

window.alert(this);
return this;

});
var str = " abc ";
str.trim().writeln().alert();

相关文章
|
3月前
|
JavaScript 前端开发 开发者
JavaScript中的箭头函数:简洁的语法与this绑定
JavaScript中的箭头函数:简洁的语法与this绑定
426 184
|
7月前
|
JavaScript 前端开发 Java
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
211 24
JavaScript:编程宇宙的多面闪耀之星-揭秘 JavaScript,编程界的全能霸主如何炼成?-优雅草卓伊凡
|
6月前
|
JSON 前端开发 Serverless
Mock.js 语法结构全解析
Mock.js 的语法规范介绍,从数据模板定义规范和数据占位符定义规范俩部分介绍, 让你更好的使用 Mock.js 来模拟数据并提高开发效率。
|
JavaScript 前端开发 编译器
解锁JavaScript模块化编程新纪元:从CommonJS的基石到ES Modules的飞跃,探索代码组织的艺术与科学
【8月更文挑战第27天】随着Web应用复杂度的提升,JavaScript模块化编程变得至关重要,它能有效降低代码耦合度并提高项目可维护性及扩展性。从CommonJS到ES Modules,模块化标准经历了显著的发展。CommonJS最初专为服务器端设计,通过`require()`同步加载模块。而ES Modules作为官方标准,支持异步加载,更适合浏览器环境,并且能够进行静态分析以优化性能。这两种标准各有特色,但ES Modules凭借其更广泛的跨平台兼容性和现代语法逐渐成为主流。这一演进不仅标志着JavaScript模块化的成熟,也反映了整个JavaScript生态系统的不断完善。
159 3
|
8月前
|
JavaScript Ubuntu Linux
如何在阿里云的linux上搭建Node.js编程环境?
本指南介绍如何在阿里云Linux服务器(Ubuntu/CentOS)上搭建Node.js环境,包含两种安装方式:包管理器快速安装和NVM多版本管理。同时覆盖全局npm工具配置、应用部署示例(如Express服务)、PM2持久化运行、阿里云安全组设置及外部访问验证等步骤,助你完成开发与生产环境的搭建。
|
存储 JavaScript 前端开发
JavaScript编程实现tab选项卡切换的效果+1
JavaScript编程实现tab选项卡切换的效果+1
|
9月前
|
JavaScript 前端开发 IDE
【编程向导】Js与Ts差异详解:选择与权衡
JavaScript 一直是 Web 开发的基石,以其灵活性和动态性著称,但其松散类型可能导致大型项目中出现难以调试的错误。TypeScript 作为 JavaScript 的超集,通过引入静态类型系统,提供了更高的类型安全性和更好的工具支持,尤其适合大型团队和复杂项目。本文详细对比了 JavaScript 和 TypeScript 的优缺点,并提供了实际代码示例,帮助开发者根据项目需求选择合适的工具。
1171 2
|
前端开发 JavaScript 持续交付
提高JavaScript编程效率
提高JavaScript编程效率
143 3
|
自然语言处理 JavaScript 前端开发
JavaScript闭包:解锁编程潜能,释放你的创造力
【10月更文挑战第25天】本文深入探讨了JavaScript中的闭包,包括其基本概念、创建方法和实践应用。闭包允许函数访问其定义时的作用域链,常用于数据封装、函数柯里化和模块化编程。文章还提供了闭包的最佳实践,帮助读者更好地理解和使用这一强大特性。
106 2
|
JavaScript 前端开发
JavaScript 函数语法
JavaScript 函数是使用 `function` 关键词定义的代码块,可在调用时执行特定任务。函数可以无参或带参,参数用于传递值并在函数内部使用。函数调用可在事件触发时进行,如用户点击按钮。JavaScript 对大小写敏感,函数名和关键词必须严格匹配。示例中展示了如何通过不同参数调用函数以生成不同的输出。

热门文章

最新文章