<<编写可维护的javascript>> 笔记9(将配置数据从代码中分离出来

xbynet 发布于2019-08-22 14:00 / 2309人阅读

摘要：代码无非是定义一些指令的集合让计算机来执行我们常常将数据传入计算机由指令对数据进行操作并最终产生一个结果当不得不修改数据时问题就来了任何时候你修改源代码都会有引入的风险且值修改一些数据的值也会带来一些不必要的风险因为数据时不应当影响指令的正

代码无非是定义一些指令的集合让计算机来执行. 我们常常将数据传入计算机, 由指令对数据进行操作, 并最终产生一个结果. 当不得不修改数据时问题就来了. 任何时候你修改源代码都会有引入bug的风险, 且值修改一些数据的值也会带来一些不必要的风险, 因为数据时不应当影响指令的正常运行的. 精心设计的应用应当将关键数据从主要的源码中抽离出来, 这样我们修改源码时才更加放心.

9.1 什么是配置数据
配置数据是应用中写死的值.

// 配置参数埋藏在代码中
function validate(value) {
    if(!value) {
        alert("非法的值");
        location.href = "/errors/invalid.php";
    }
}

function toggleSelected(element) {
    if(hasClass(element, "selected")) {
        removeClass(element, "selected");
    }else {
        addClass(element, "selected");
    }
}

这段代码中有三个配置数据片段. 第一个是字符串 "非法的值", 这个值是给用户提示的. 所以它可能会被频繁修改. 第二个是URL"/errors/incalid.php". 当架构变更时则可能频繁修改. 第三个是CSS的类名"selected". 有三处都用到了className, 这意味着要修改这个类名要修改三处代码. 很可能不小心丢掉了某处.

URL

需要展现给用户的字符串

重复的值

设置 (比如每页的配置项)

任何可能发生变更的值

配置数据时可发生变更的, 而且你不希望有人要改展示信息而去修改源码.

9.2 抽离配置数据
将配置参数从代码中抽离出来.

// 将配置参数抽离出来
var config = {
    MSE_VALUE: "非法的值",
    URL_INVALID: "/errors/invalid.php",
    CSS_SELECTED: "selected"
}
function validate(value) {
    if(!value) {
        alert(config.MSG_VALUE);
        location.href = config.URL_INVALID;
    }
}

function toggleSelected(element) {
    if(hasClass(element, config.CSS_SELECTED)) {
        removeClass(element, config.CSS_SELECTED);
    }else {
        addClass(element, config.CSS_SELECTED);
    }
}

这样修改它们就不会导致代码出错
9.3 保存配置数据
配置数据最好多带带在一个文件中. 这样代码清晰很多.
有很多方式, 不用js用别的语言要转化为js识别语言.

JSON

JSONP

纯JavaScript

有很多模块导入方法import等等

专线服务私有云 asp中&lt&gt的意思 python &lt&gt java &lt=&gt java&lt &gt

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/92739.html

<<编写可维护的javascript>> 笔记5(UI层的松耦合)

摘要：由于第四章太稀松平常了于是就直接跳到第五章了这里我就草草的说一下第四章的几个点吧在严格模式的应用下不推荐将用在全局作用域中相等推荐尽量使用和守则如果是在没有别的方法来完成当前任务这时可以使用原始包装类型不推荐创建类型时用等创建类型从这一章节由于第四章太稀松平常了, 于是就直接跳到第五章了.这里我就草草的说一下第四章的几个点吧在严格模式的应用下不推荐将use strict;用在全...

saucxs 2019-08-21 12:02 评论0 收藏0
<<编写可维护的javascript>> 笔记7(事件处理)

摘要：在所有应用中事件处理都是非常重要的所有的均通过事件绑定到上所以大多数前端工程师需要花费很多时间来编写和修改事件处理程序遗憾的是在诞生之初这部分内容并未受太多重视甚至当开发者们开始热衷于将传统的软件架构概念融入到里时事件绑定仍然没有收到多大重在所有JavaScript应用中事件处理都是非常重要的. 所有的JavaScript均通过事件绑定到UI上, 所以大多数前端工程师需要花费很多时间...

microelec 2019-08-21 17:10 评论0 收藏0
Html/Css/Jquery知识点集锦

摘要：首先，巧妙的使用这一标记，将游览器从所有情况中分离出来。接着，再次使用将和分离开来，这样已经独立识别。元素不能用作语义用途以外的其他目的。Html1、Html5有哪些新特性，移除了哪些元素?如何处理HTML5新标签的浏览器兼容问题?如何区别HTML和HTML5?HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。拖拽释放(Drag and drop) ...

shiweifu 2019-08-30 15:56 评论0 收藏0
<<编写可维护的javascript>> 笔记1(基本格式化)

摘要：程序是写给人读的只是偶尔让计算机执行一下当你刚刚组建一个团队时团队中的每个人都各自有一套编程习惯毕竟每个成员都有着不同的背景有些人可能来自某个皮包公司身兼数职在公司里面什么事都做还有些人会来自不同的团队对某种特定的做事风格情有独钟或恨之入骨程序是写给人读的,只是偶尔让计算机执行一下. Donald Knuth 当你刚刚组建一个团队时,团队中的每个人都各自有一套编程习惯.毕竟,...

wfc_666 2019-08-21 11:59 评论0 收藏0
<<编写可维护的javascript>> 笔记3(语句和表达式)

摘要：所有的块语句都应当使用花括号包括花括号的对齐方式第一种风格第二种风格块语句间隔第一种在语句名圆括号和左花括号之间没有空格间隔第二种在左圆括号之前和右圆括号之后各添加一个空格第三种在左圆括号后和右圆括号前各添加一个空格我个人喜欢在右括号之后添所有的块语句都应当使用花括号, 包括: if for while do...while... try...catch...finally 3....

OBKoro1 2019-08-21 12:02 评论0 收藏0