Vue js with语句原理及用法解析
更新时间：2020年09月03日 11:20:28 作者：vickylinj
这篇文章主要介绍了Vue js with语句原理及用法解析,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
vue源码中编译部分有下面一段代码，里面用到了with：
export function generate (
ast: ASTElement | void,
options: CompilerOptions
): CodegenResult {
const state = new CodegenState(options)
const code = ast ? genElement(ast, state) : '_c("div")'
return {
render: `with(this){return $[code]}`,
staticRenderFns: state.staticRenderFns
}
}
下面详细解释一下with的用法：
js中我们常用的一种类型是对象：
let obj = {
a:"aa",
b:"bb",
c:"cc"
}
而提到对象，我们要获取它中的属性值，可以使用如下方法：
// 一： let a = obj.a //二： let b = ojb["b"]
取出对象中的每一个属性值，我们都需要obj....，这样无形中会输入很多次obj，那么我们如何简单的获取到它的属性值呢。
1、常规的方法：
var a = obj.a;
var b = obj.b;
var c = obj.c;
2、使用with后的方法：
with(obj){
var a = a;
var b = b;
var c = c;
}
这里with括号中的值就是我们的公共对象，下面就是每个对象中的值
var qs1 = location.search.substring(1);
var hostname1 = location.hostname;
var url1 = location.href;
// 上面几行代码都包含了location对象，可使用with语句简写为以下形式
with(location){
var qs2 = search.substring(1);
var hostname2 = hostname;
var url2 = href;
}
只要无疑会大大提高我们的效率。
但是凡事都有利弊，我们也不得不提提with的缺点：
由于大量使用with语句会导致性能下降，同时也会给调试代码造成困难，因此在开发大型应用程序时，不建议使用with语句
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要为大家介绍了fullcalendar日程管理插件月份切换回调处理的方案示例，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-03-03
在Vue前端项目中,可通过axios库发送请求至后端获取Excel下载链接,文中通过代码介绍的非常详细,对大家的学习或者工作具有一定的参考借鉴价值,需要的朋友可以参考下2024-10-10
这篇文章主要介绍了vue内置组件transition简单原理图文详解(小结),小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-07-07
这篇文章主要介绍了VueRouter路由模式的用法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-06-06
这篇文章主要介绍了vue3中如何实现定义全局变量，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-07-07
下面小编就为大家分享一篇C#实现将一个字符转换为整数，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2017-12-12
在vue中使用echarts(折线图的demo,markline用法)
这篇文章主要介绍了在vue中使用echarts(折线图的demo,markline用法)，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-07-07
这篇文章主要介绍了原理深度解析Vue的响应式更新比React快，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-04-04
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
这篇文章主要介绍了vue3.0 CLI - 1 - npm 安装与初始化的入门教程,本文通过实例代码相结合的形式，给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下2018-09-09
这篇文章主要介绍了Vue3中多个弹窗同时出现的解决思路,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-02-02
最新评论