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

2023年4月27日 189次阅读 来源: Ray_

代码无非是定义一些指令的鸠合让计算机来实行. 我们常常将数据传入计算机, 由指令对数据举行操纵, 并终究发生一个效果. 当不能不修正数据时题目就来了. 任何时候你修正源代码都邑有引入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等等

    原文作者：Ray_
    原文地址: https://segmentfault.com/a/1190000012967639
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞