JavaScript 保护变量不被随意修改的实现代码

下面给大家分享代码：

/*
* 1.如果在rendertitle，rendercontent里面，这样总数据谁都能修改，不安全
* 改进
* 1.规定一个专门修改数据的方法，如果想修改数据只能走这个方法
*
* action代表一个命令对象，就是一个普通的js对象，起码需要一个字段控制命令类型type,其他字段随意
*
* */
const change_font_sile='change_font_sile';
//设置一个闭包，把变量保护起来，通过返回值调用
function createstore() {
  let appstate={
    fontsize:'26px',
    title:{
      text:'标题',
      color:'red'
    },
    content:{
      text:'类容',
      color:'green'
    }
  }
  //保护变量被修改，深克隆
  let getstate=()=>json.parse(json.stringify(appstate));
  //改变变量的方法
  let dispatch=(action)=>{
    switch(action.type){
      case change_font_sile:
        appstate.fontsize=action.fontsize;
      default:
        return;
    }
  }
  //返回出去的修改和取值的接口
 return{
   getstate,
   dispatch
 }
}
let store=createstore();
//取值函数
function rendertitle() {
  let titleele = document.queryselector('#title');
  titleele.innerhtml = store.getstate().title.text;
  titleele.style.color = store.getstate().title.color;
  titleele.style.fontsize = store.getstate().fontsize;
}
function rendercontent() {
  let titleele=document.queryselector("#content");
  titleele.innerhtml=store.getstate().content.text;
  titleele.style.color=store.getstate().content.color;
  titleele.style.fontsize=store.getstate().fontsize;
}
function renderapp() {
  rendertitle();
  rendercontent()
}
//修改appstate里面初始值，单独一个修改文件
store.dispatch({type:change_font_sile,fontsize:'30px'})
renderapp();

总结

以上所述是小编给大家介绍的javascript 保护变量不被随意修改的实现代码，希望对大家有所帮助