首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何写出优雅 JS 代码?使用 SOLID 原则

也就是说,对扩展是开放,而对修改是封闭。这个原则是诸多面向对象编程原则中最抽象、最难理解一个。 通过增加代码来扩展功能,而不是修改已经存在代码。...若客户模块和服务模块遵循同一个接口来设计,则客户模块可以不关心服务模块类型,服务模块可以方便扩展服务(代码)。 OCP支持替换服务,而不用修改客户模块。 说大白话就是:你不是要变化吗?...客户模块不应关心服务模块是如何工作;同样接口模块之间,可以在不知道服务模块代码情况下,进行替换。即接口或父类出现地方,实现接口类或子类可以代入。...依赖注入是该原则一种实现方式。 依赖倒置原则(Dependency Inversion Principle,DIP)规定:代码应当取决于抽象概念,而不是具体实现。...代码部署后可能存在BUG没法实时知道,事后为了解决这些BUG,花了大量时间进行log 调试,这边顺便给大家推荐一个好用BUG监控工具 Fundebug。

2K20

让你 JS 代码变得更加优雅且可维护

这种写法写出来代码晦涩难懂,难以维护,隐藏 BUG 多,除非你准备给接手的人埋坑,或者准备辞职,不然千万别这么写(容易被打断腿,?‍? ) 那么怎么写才更优雅? 语义化 首先便是语义化。...枚举 对于上面判断 userRole 代码,其实我们可以用更优雅方式去实现,那就是 枚举 。...更在状态 除了上面的方式之外,我们还可以利用“ 状态 ”概念来写代码。在看代码之前,我们先了解下什么是 “有限状态机”。...不同状态展示 UI 也不同,所以我们以不同状态划分好模块之后,代码写起来就会清晰很多,我们以 Vue 代码为例: // contants.js export const ORDER_STATUS...,以提高程序代码模块化程度。

90110
您找到你想要的搜索结果了吗?
是的
没有找到

如何写出优雅 JS 代码,变量和函数正确写法

在开发中,变量名,函数名一般要做到清晰明了,尽量做到看名字就能让人知道你意图,所以变量和函数命名是挺重要,今天来看看如果较优雅方式给变量和函数命名。...让你变量名可被读取,像 buddy.js 和 ESLint 这样工具可以帮助识别未命名常量。 // 不好写法 // 86400000 用途是什么?...删除重复代码 尽量避免重复代码,重复代码是不好,它意味着如果我们需要更改某些逻辑,要改很多地方。...通常,有重复代码,是因为有两个或多个稍有不同事物,它们有很多共同点,但是它们之间差异迫使我们编写两个或多个独立函数来完成许多相同事情。...让我们考虑一个示例:如果想扩展 JS 原生Array方法以具有可以显示两个数组之间差异diff方法,该怎么办?

3.7K30

10个简单技巧让你 vue.js 代码优雅

前言 作为深度代码洁癖,我们都希望能写出简单高效代码,让我们代码看起来更加优雅,让我们抛弃繁杂代码,一起开启简单旅程~~ 01、slots 新语法向 3.0 看齐 使用带有“#”新命名插槽缩写语法... 05、响应式数据(2.6.0新增) 我们习惯于用Vuex去解决状态共享问题,但是在小项目中使用就会有增大代码体积和将代码复杂化烦恼,所以在后来版本中Vue新增...button v-if="status === 4" class="btn4" :class="status === 4" @click="">已领取 但是如果我们利用渲染函数可以将上面的代码抽取成优雅使用组件...child :status="status"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.<em>js</em>...,componentList:['ColorIn','LineIn','Header','Footer']使用下面的<em>代码</em>即可将<em>代码</em>依次循环 <component v-for="(item,index)

76920

3 个简单技巧让你 vue.js 代码优雅

故借此专栏提几点关于Vue代码可读性建议,觉得有用点个赞,觉得建议不合理发表评论批评一下,有更好建议欢迎发表评论补充一下。...一、善用组件让代码更有条理性 千万不要把一个页面的实现代码都梭哈在一个.vue文件中,除非这个页面非常简单,不然这个.vue文件中代码会又长又臭。...将UI组件提取出来后,可以把UI交互代码和业务交互代码剥离开来。切记不能UI组件中写业务代码,这样UI组件将无法复用。...$confirm = ConfirmInit; //main.js import 'components/confirm/index.js';//全局注册二次确认弹窗confirm组件 1.2、按模块提取业务组件...,随着需求变化导致业务场景叠加,组件代码中会添加各种判断逻辑,久而久之变得又长又臭,显然这种做法是不可去。

79620

10个简单技巧让你 vue.js 代码优雅

前言 作为深度代码洁癖,我们都希望能写出简单高效代码,让我们代码看起来更加优雅,让我们抛弃繁杂代码,一起开启简单旅程~~ 01、slots 新语法向 3.0 看齐 使用带有“#”新命名插槽缩写语法... 05、响应式数据(2.6.0新增) 我们习惯于用Vuex去解决状态共享问题,但是在小项目中使用就会有增大代码体积和将代码复杂化烦恼,所以在后来版本中Vue新增...button v-if="status === 4" class="btn4" :class="status === 4" @click="">已领取 但是如果我们利用渲染函数可以将上面的代码抽取成优雅使用组件...child :status="status"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.<em>js</em>...,componentList:['ColorIn','LineIn','Header','Footer']使用下面的<em>代码</em>即可将<em>代码</em>依次循环 <component v-for="(item,index)

95411

如何优雅写好Pythonic代码

Python 与其它语言(比如Java或者C++)相比有比较大区别,其中最大特点就是非常简洁。如果按照其它语言思路来写Python代码,则会使得代码繁琐复杂,并且容易出现Bug。...有的同学可能不明白这个词意义,小编理解就是用Python写法写代码,而非是其它语言通用写法,写出Python特点,写出Python风格。...下面,就通过几个示例来看一下不同思维Python代码差异。 1、变量值交换 这个问题最常见,大家从最开始写Java及C++等语言代码都会遇到这个问题。...然而,由于像字符串这种不可变对象在内存中生成后无法修改,合并后字符串会重新开辟出一块内存空间来存储。因此每合并一次就会单独开辟一块内存空间,这样会占用大量内存空间,严重影响代码效率。...而Python中通过for...else...会使得代码很简洁,注意else中代码块仅仅是在for循环中没有执行break语句时候执行: cities = ['BeiJing', 'TianJin

1K20

编写优雅代码最佳实践

Robert Martin曾说过"在代码阅读中说脏话频率是衡量代码质量额唯一标准"。同时,代码写法应当使别人理解它所需时间最小化,也就是说我们写代码是给人看而不是给机器看。...那么,如何编写优雅代码呢?可以从思想层面和具体技巧层面来优化代码,思想层面指的是遵循面向对象设计原则,本期介绍是具体技巧。 1. 代码总是越短越好吗? assert((!...bucket.isOccupied()); } 减少代码行数是一个好目标,但是让阅读代码事件最小化是个更好目标。 2....因此,我们可以用一个更加自我说明名字,例如: void releaseRegistryHandle(registryKey key); 13.为代码瑕疵写注释 // TODO:采用更快算法或者当代码没有完成时...ok);其次处理掉简单情况,这有利于让if和else处理代码在同一个屏幕内可见。 19. 通过提早返回减少嵌套 使用提前返回机制,可以把函数嵌套层级变浅。

1.6K200

编写优雅代码最佳实践

Robert Martin曾说过"在代码阅读中说脏话频率是衡量代码质量额唯一标准"。同时,代码写法应当使别人理解它所需时间最小化,也就是说我们写代码是给人看而不是给机器看。...那么,如何编写优雅代码呢?可以从思想层面和具体技巧层面来优化代码,思想层面指的是遵循面向对象设计原则,本期介绍是具体技巧。 1. 代码总是越短越好吗? assert((!...bucket.isOccupied()); } 减少代码行数是一个好目标,但是让阅读代码事件最小化是个更好目标。 2....因此,我们可以用一个更加自我说明名字,例如: void releaseRegistryHandle(registryKey key); 13.为代码瑕疵写注释 // TODO:采用更快算法或者当代码没有完成时...ok);其次处理掉简单情况,这有利于让if和else处理代码在同一个屏幕内可见。 19. 通过提早返回减少嵌套 使用提前返回机制,可以把函数嵌套层级变浅。

40720

如何优雅统计代码耗时

今天,基基,跟大家分享一下,如何在代码中,统计接口耗时,最优雅,性能最高,接下来我将介绍4种统计方式。 如果你有更好方式,欢迎文末留言区,交流。...一、前言 代码耗时统计在日常开发中算是一个十分常见需求,特别是在需要找出代码性能瓶颈时。 可能也是受限于 Java 语言特性,总觉得代码写起来不够优雅,大量耗时统计代码,干扰了业务逻辑。...特别是开发功能时候,有个感受就是刚刚开发完代码很清爽优雅,结果加了一大堆辅助代码后,整个代码就变得臃肿了,自己看着都挺难受。...因此总想着能不能把这块写优雅一点,今天本文就尝试探讨下“代码耗时统计”这一块。 在开始正文前,先说下前提,“代码耗时统计”并不是某个方法耗时,而是任意代码段之间耗时。...,利于理解;缺点就是对代码侵入性较大,看着很傻瓜,不优雅

1K10

如何写出优雅代码

所谓优雅,相对应是坑。只有见过足够多坑,才会形成自己编码理念。工程开发,除了要满足业务需求和性能需求之外,还需要保证可维护。...要随时面对人员流动对系统带来风险,所以我对优雅代码理解更偏向于易维护。...重构重构应该存在于每一次开发过程中,完成功能需求,性能需求之后,还需要思考改动后代码是否优雅,结构是否清晰。很多时候虽然只加了一行代码,但全局维度需要重新调整结构。...最后想说,所谓优雅,相对应是坑。只有见过足够多坑,才会形成自己编码理念。总结自己遇到坑,找到避免坑方法,就能保证持续进步。...我认为仅仅编写出可运行代码是远远不够,还要时刻注意代码整洁度,留下一些漂亮代码,希望写代码都能保留并运行 102 年!

45230

借助 AngularJS 写优雅代码

接触 AngularJS 还真有点碰巧,在用 JQuery 写数据绑定时候,我被数据对象和 DOM 之间同步整烦了,要写一大堆方法绑定和取值/设值代码逻辑,丑得要死。...就这个问题,第 1 条对象变更需要及时刷新到 DOM 上,有好多办法,underscore.js、mustache 之类,模板+数据绑定嘛,当然,需要手动调用来更新;但是反过来第 2 条,DOM...值得一提是,AngularJS 引入 directive 确实方便扩展了标签集,可以写出 DSL 样子代码,非常非常灵活,比如: Error occurs....,生写 html 片段模板代码字符串,用起来确实让我不够舒服。...就我而言,我倾向于把同一模块代码放置在一起,增加可理解性,而不在乎它组成是 DOM 声明还是 JavaScript 解释。

2.7K20

如何优雅在GitHub贡献代码

基于GitHub仓库进行代码贡献操作步骤。 Fork代码 访问原始仓库,点击fork,将原始仓库代码fork到自己GitHub账号下,成为副本仓库。...整个过程在未开始合并之前,你代码更新应该只会出现在dev分支上。 注意:在使用 git rebase 相关命令时,需要谨慎应用在已经提交更新或远程仓库上。...推送(push)到副本仓库 现在,已经完成代码修改、上游同步更新并且完成了合并。接下来应该将代码 push 到副本仓库。...git push origin dev # 将本地dev分支代码push到origindev分支 # 如果该分支不存在则会创建 这个 push 只会更新副本仓库,并不会影响到原始仓库。...新功能修改,继续重复上面的创建本地分支、修改代码、执行add和commit操作、更新合并upstream(可放在创建分支之前和代码修改过程中提交变动)、将本地新建分支推送至副本仓库、基于部分仓库创建

73610

如何优雅写 Controller 层代码

目录 前言 Controller 层参数接收 统一状态码 统一校验 统一响应 统一异常 前言 本篇主要要介绍就是 controller 层处理,一个完整后端请求由 4 部分组成: 接口地址(也就是...请求方式(一般就是 get、set,当然还有 put、delete) 请求数据(request,有 head 跟 body) 响应数据(response) 本篇将解决以下 3 个问题: 当接收到请求时,如何优雅校验参数...org.springframework.validation.BindException: org.springframework.validation.BeanPropertyBindingResult: errors 我们看到代码抛出了...,比如库存不能小于 0 子类,这种异常并非程序异常,而是业务操作引发异常,我们也需要进行规范编排业务异常状态码,并且写一个专门处理异常类,最后通过刚刚学习过异常拦截统一进行处理,以及打日志。...,暂且放着,写上TODO return new ResultVo(e.getCode(), e.getMsg(), e.getMessage()); } } ④最后使用,我们代码只需要这么写

70820

优雅替换掉代码ifelse

场景 平时我们在写代码时,需要针对不同情况处理不同业务逻辑,用得最多就是if和else。...但是如果情况太多,就会出现一大堆“if else”,这就是为什么很多遗留系统中,一个函数可能出现上千行代码。...代码实现 上面的业务场景简单来说就是:针对不同短信渠道来调用对应短信平台接口实现短信发送。...代码实现如下(注意下面所有的代码都不能直接运行,只是关键逻辑部分示例代码): 烂代码示例 我们有一个短信发送类:SmsSendService,里面有一个send方法发送短信 SmsSendService.java...这样我们每次都需要修改原有代码(对更改没有封闭),不断添加”if else"。

1.1K50

如何优雅编写代码(持续更新......)

《编写可读代码艺术》 《代码整洁之道》 1、如何写出优雅代码 命名规范 代码命名均不能以下划线或美元符号开始,也不能以下划线或美元符号结束。...代码命名严禁使用拼音与英文混合方式,更不允许直接使用中文方式,尽量使用完整英文名,不要嫌弃名字长。...接口类中方法和属性不要加任何修饰符号(public也不要加),保持代码简洁性,并加上有效Javadoc注释。...对于暂时被注释掉,后续可能恢复使用代码片断,在注释代码上方,统一规定使用三个斜杠(///)来说明注释掉代码理由。 OOP编程规范 所有的覆写方法,必须加@Override注解。...3)被声明成private只会被自己代码所调用方法,如果能够确定调用方法代码传入参数已经做过检查或者肯定不会有问题,此时可以不校验参数。

75241

基础|如何优雅编写JavaScript代码

没错 正如上图 作为一名优秀码农 应具备 码得出代码, 看得懂自己码代码, 让别人看得懂你码代码, 这三个基本素养。...提高自身编码能力和编写易于阅读和维护代码,是广大码农们提高开发效率和职业身涯中必做事情。 那么究竟如何编写出可维护优雅代码呢?...避免使用 JS 糟粕和鸡肋 这些年来,随着 HTML5 和 Node.js 发展,JavaScript 在各个领域遍地开花,已经从“世界上最被误解语言”变成了“世界上最流行语言”。...因此 lint 非常有必要,特别是对于大型项目,他可以保证代码符合一定风格,有起码可读性,团队里其他人可以尽快掌握他人代码。...我们需要时常和同行们进行代码评审,不断优化自己代码,不要惧怕改善代码质量所需付出努力。长此以往,你不会觉得看不懂自己半年前写代码,还将获得同行赞许,你程序之路会走更远!

53430

编写高效且优雅 Python 代码

本文作为进阶系列文章,从基础语法到函数、迭代器、类,还有之后系列线程 / 进程、第三方库、网络编程等内容,共同学习如何写出更加 Pythonic 代码 部分提炼自书籍:《Effective Python...块 循环正常结束之后会调用else内代码 循环里通过break跳出循环,则不会执行else 要遍历序列为空时,立即执行else for i in range(2): print(i) else...else会在finally之前运行 最终一定会执行finally,可以在其中进行清理工作 函数 使用装饰器 装饰器用于在不改变原函数代码情况下修改已存在函数。...:在代码块执行前,先进行准备工作;在代码块执行完成后,做收尾处理工作。...所以说使用上下文管理器好处就是,通过调用我们预先设置好回调,自动帮我们处理代码块开始执行和执行完毕时工作。

1.1K30
领券