JavaScript 和 ES6
在这个过程你会发现,有很多 JS 知识点你并不能更好的理解为什么这么设计,以及这样设计的好处是什么,这就逼着让你去学习这单个知识点的来龙去脉,去哪学?第一,书籍,我知道你不喜欢看,我最近通过刷大厂面试题整理了一份前端核心知识笔记,比较书籍更精简,一句废话都没有,这份笔记也让我通过跳槽从8k涨成20k。
如果你觉得对你有帮助,可以戳这里获取:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
二、模板语法
2.1、mustache语法
mustache 翻译为中文,是胡子/胡须。由于 {{ msg }} 两边都有对称的大括号,就像人的胡须一样,所以就叫做 mustache 语法。
特点:不仅可以直接写成变量,也可以添加简单的表达式。
//写法多样,使用便捷
{{ msg }}
{{ fir+' '+sed }}
{{ fir }} {{sed}}
{{ number + 1 }}
{{ message.split('').reverse().join('') }}
2.2、v-once
上边的数据绑定中,页面展示 msg 的值,如果我们在浏览器调试中,修改 msg 的值,页面立马会更新,始终保持最新的值为页面内容。
调试模式,输入如下内容观察:
app.msg=“你不爱我了” //回车
vue 支持动态渲染文本,在修改属性的同时,实时渲染文本。为了提高渲染效率,只需第一次渲染出文本之后,后期属性再修改不会影响文本内容。
此时就需要使用 v-once 解决问题。
//使用语法
{{msg}}
特点:该指令后面不需要任何表达式,表示元素或组件只渲染一次,不会随数据的改变而改变文本。
2.3、v-html
在某些特殊情况下,页面需要动态地插入一段 html 代码,比如编辑器,动态传入的就是一段html 代码,使用时我们需要原样输出,如:
data(){
return{
url:‘百度首页’
}
}
直接这么写并不能满足我们的要求,我们需要展示成带有超链接的百度首页,此时 v-html 登场。
// v-html 使用语法
给元素添加 v-html 指令后,元素就展示成一个带有超链接的百度首页文字。
v-html 特点:可以解析字段内的标签,把内容当作 html 标签来处理。
2.4、v-text
// 使用语法
特点:与 mustache 语法类似,用于展示文本的。使用没有 mustache 灵活,所以使用较少。
注意点:新内容 标签中又新增内容时,会把原来 msg 中的内容覆盖掉。
2.5、v-pre
v-pre 与 html 中的 pre 标签有些类似,html 中的 pre 会原样输入空格、换行、缩进和文本内容。v-pre 也是原样输出内容,不会解析。
// 使用语法
页面直接输出 {{ msg }}
最后
除了简历做到位,面试题也必不可少,整理了些题目,前面有117道汇总的面试到的题目,后面包括了HTML、CSS、JS、ES6、vue、微信小程序、项目类问题、笔试编程类题等专题。