当前位置： 移动技术网 > IT编程>开发语言>JavaScript > JS弱类型语言的优势——之模板字符串

JS弱类型语言的优势——之模板字符串

2020年04月02日  | 移动技术网IT编程  | 我要评论

　　es6中，开始支持模板字符串。

　　尽管java和c#这样的高级语言有非常多吸引人的地方，但是想js这样的弱类型语言，也有独到之处。

　　equtype：有四种类型，分别是：chl、chwp、cwp、cot，后端java接口提供了四个接口，四个接口对应四个函数调用，每一个函数名的规则是[equtype]control,
let equdetailservice = {*/
  chlcontrol: function(params) {
    return request.post(url.coldstation.equdetail.chlcontrol, params);
  },
  //冷冻泵启停接口
  chwpcontrol: function(params) {
    return request.post(url.coldstation.equdetail.chwpcontrol, params);
  },
  //冷却泵启停接口
  cwpcontrol: function(params) {
    return request.post(url.coldstation.equdetail.cwpcontrol, params);
  },
  //冷却塔启停接口
  cotcontrol: function(params) {
    return request.post(url.coldstation.equdetail.cotcontrol, params);
  }
};

　　前端同一个组件在四个不同的页面中使用，组件对应的equtype值不同，根据equtype值不同要调用后端不同的接口。

　  axios的js调用：

      equdetailservice[`${this.equtype}control`](serachobj).then(res => {
        if (res.code === 200) {
         //执行成功
        }
      });

　　后端一个详情页面的接口返回一个json对象，如下数据：

detailinfo:{g1_cot1_on/off: "0.0",
g1_cot1_vfd_on/off: "1.0",
g1_cot1_frq: "30.0",
g1_cot1_frq_set: "50.0",
g1_cot1_pwr: "5.0",
g1_cot1_pwr_deviceid: 95
g1_cot1_vfd_pwr: "5.0",
g1_cot1_vfd_pwr_deviceid: 95
g1_cot1_vfd_alm: "0.0",
g1_cot1_pwr_alm: "0.0",
g1_cot1_pwr_alm_deviceid: 95,
g1_cot1_rem/loc: "1.0",
g1_cot1_hrs: "5300.0",
g1_cot1_en/dis: "1.0",
g1_cot1_rank: "0.0",
g1_cot1_pwr_frq: "0.0",
g1_cot1_pwr_frq_deviceid: 95,
g1_cot1_frq_hand/auto: "0.0",
g1_cot2_on/off: "0.0",
g1_cot2_vfd_on/off: "1.0",
g1_cot2_frq: "30.0",
g1_cot2_frq_set: "50.0",
g1_cot2_pwr: "5.0",
g1_cot2_pwr_deviceid: 96,
g1_cot2_vfd_pwr: "5.0",
g1_cot2_vfd_pwr_deviceid: 96,
g1_cot2_vfd_alm: "0.0",
g1_cot2_pwr_alm: "0.0",
g1_cot2_pwr_alm_deviceid: 96,
g1_cot2_rem/loc: "1.0",
g1_cot2_hrs: "5437.0",
g1_cot2_en/dis: "1.0",
g1_cot2_rank: "0.0",
g1_cot2_pwr_frq: "--",
g1_cot2_pwr_frq_deviceid: 96,
g1_cot2_frq_hand/auto: "0.0",
g1_cot3_on/off: "0.0",
g1_cot3_vfd_on/off: "1.0",
g1_cot3_frq: "30.0",
g1_cot3_frq_set: "50.0",
g1_cot3_pwr: "5.0",
g1_cot3_pwr_deviceid: 97,
g1_cot3_vfd_pwr: "5.0",
g1_cot3_vfd_pwr_deviceid: 97,
g1_cot3_vfd_alm: "0.0",
g1_cot3_pwr_alm: "0.0",
g1_cot3_pwr_alm_deviceid: 97,
g1_cot3_rem/loc: "1.0",
g1_cot3_hrs: "5436.0",
g1_cot3_en/dis: "1.0",
g1_cot3_rank: "0.0",
g1_cot3_pwr_frq: "--",
g1_cot3_pwr_frq_deviceid: 97,
g1_cot3_frq_hand/auto: "1.0",
}

　　g1是组名，groupnumber会变化，

　　而前端又是一个组件，好几个页面用，只调用一个接口，接口返回的是个json对象，而不是一个数组，但是前端界面又要显示三个tab，进行数据绑定时，又可以用到模板字符，以取g1_cot1_frq_set这个字符为例，vue数据绑定：

{{detailinfo[`${groupnumber}_cot${index+1}_frq_set`]}}

　　直接可以把detailinfo中的数据拆分为3项。

　　java有的语法糖，js有，java没有的语法糖，js还是有，这就是它的强大之处。

　　总结：模板字符在有些时候可以避免if else和正则表达式校验，类似于后端语言的反射（如c#）。注：一些高级语言的反射非常耗性能。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网