本文详细介绍了Vue.js的重要概念，包括MVVM模式、CMD命令操作、CDN使用、ES6的键值对与模板字符串，以及Vue实例的生命周期钩子。阐述了MVVM模式的优势与缺点，讲解了如何在命令行中操作CMD，以及CDN在前端开发中的作用。此外，文章还深入探讨了ES6中的let和const，模板字符串的使用，以及Vue的生命周期，包括各个钩子函数的作用。最后，文章详细讨论了Vue中的数组侦听、事件对象属性以及事件修饰符的应用，帮助读者掌握Vue开发中的核心知识点。
MVVM
MVVM 即模型-视图-视图模型。
模型 指的是后端传递的数据； 视图 指的是所看到的页面。
视图模型 是mvvm模式的核心，它是连接view和model的桥梁。
它有两个方向：
一是将 模型 转化成 视图 ，即将后端传递的数据转化成所看到的页面。 实现的方式是：数据绑定。
二是将 视图 转化成 模型 ，即将所看到的页面转化成后端的数据。 实现的方式是：DOM 事件监听。 这两个方向都实现的，我们称之为数据的双向绑定。
优势
1.低耦合。在后端接口提供前可完成Controller和View的开发工作。视图可以独立于Model变化 和修改。
2.可复用。可以把一些视图逻辑放到一个ViewModel里面，让很多View重用这段视图逻辑。
3.独立开发。开发人员可以专注于业务逻辑和数据的开发（ViewModel），设计人员可以专注于页面设计。
4.可测试。由于ViewModel把逻辑分离出来，测试可以针对ViewModel来写。
缺点
1. Bug 很难被调试 : 因为使⽤双向绑定的模式，当你看到界⾯异常了，有可能是你 View 的代码有 Bug ，也可能是 Model 的代码有问题。数据绑定使得⼀个位置的Bug 被快速传递到别的位置，要定位原始出问题的地⽅就变得不那么容易 了。另外，数据绑定的声明是指令式地写在View 的模版当中的，这些内容是没办法去打断点 debug 的。
2. ⼀个⼤的模块中 model 也会很⼤，虽然使⽤⽅便了也很容易保证了数据的⼀致性，当时⻓期持有，不释放内存就造 成了花费更多的内存。
3. 对于⼤型的图形应⽤程序，视图状态较多， ViewModel 的构建和维护的成本都会⽐较⾼。
CMD命令操作
cmd是什么
Windows 命令提示符（即 cmd）是 Windows 系统的一种命令行操作工具，用户可以通过输入命令来完成各种各样的系统或程序操作。
如何打开cmd命令窗口
方法一：开始菜单 -> Windows 系统 -> 命令提示符。
方法二：按下快捷键 Win + R 打开运行，输入 cmd 回车。
方法三：点击任务栏搜索按钮，搜索 cmd 并打开。
方法四：在资源管理器的地址栏输入 cmd 并回车，cmd 打开后会自动定位到当前目录。
方法五：右键点击开始菜单的 Win 图标 -> 命令提示符。
每条命令输入后，回车运行。命令正确则执行完毕后回到
>状态；命令错误返回错误信息。常用命令
盘符名称+冒号——盘符切换
dir——查看当前路径下的文件列表
cd目录——进入单级目录 （tab补足目录名称）
cd..——回退到上一级目录
cd 目录一\目录二\...——进入多级目录
cd\——回退到盘符目录
cls——清屏
exit——退出命令提示符窗口
calc——启动计算机
cleanmgr——启动磁盘清理
notepad——启动记事本
magnify——启动放大镜
mspaint——启动画图板
osk——启动屏幕键盘
CDN
什么是CDN
CDN的全称Content Delivery Network，是指内容分发网络。通过构建分布式的内容分发发网络，用户可以就近获取所需内容，这样可以提高用户访问的响应速度和命中率。有些服务提供商会免费提供常用框架的 JavaScript 文件的 CDN 服务(可以直接使用)，但是在商业化应用的过程中，需要要注意版权问题。
特点
本地Cache加速：提高了企业站点(尤其含有大量图片和静态页面站点)的访问速度，并大大提高以上性质站点的稳定性。
镜像服务：消除了不同运营商之间互联的瓶颈造成的影响，实现了跨运营商的网络加速，保证不同网络中的用户都能得到良好的访问质量。
远程加速：远程访问用户根据DNS负载均衡技术智能自动选择Cache服务器，选择最快的Cache服务器，加快远程访问的速度。
带宽优化：自动生成服务器的远程Mirror (镜像) cache服务器，远程用户访问时从cache服务器上读取数据，减少远程访问的带宽、分担网络流量、减轻原站点WEB服务器负载等功能。
集群抗攻击：广泛分布的CDN节点加上节点之间的智能冗余机制，可以有效地预防黑客入侵以及降低各种D.D.o.S攻击对网站的影响，同时保证较好的服务质量。
ES6-键值对
什么是键值对
键值对('key = value') 顾名思义,每一个键会对应一个值。
例：
a:身份证号和你本人是绑定的关系。每一个身份证号(键)都会对应一个人(值)。
b:我们在登录微信或者游戏时,需要输入手机号验证身份。系统会向该手机号发送一条验证短信。
这里的手机号码(键),对应的接收用户就是值。
每个键对应响应的值,当按下响应的键时,就会输出响应的结果。
键:就是存的值的编号。
值:就是要存放的数据。
let和const
（1）let声明变量，可变
const定义常量（实际指的是变量和的内存地址），不可变，只能在其声明或定义的代码块内有效
let：ES6新增，用于声明变量，有块级作用域。
var：ES5中用于声明变量的关键字，存在各种问题。
（2）let命令存在块级作用域分别用var和let声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。
模板字符串
模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。
字符串新写法 加强版的引导
console.log(`积极 \n 向上`);
内容中可以直接出现换行符console log(`积极 向上`);
(3)定义变量let name = `萧萧下`;
let skill = `一决高下`;
（4）字符串中嵌入变量document.write(`${name}的主要技能是${skill}`)
字符串声明与方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
//声明字符串
let str1 = '啦啦啦啦啦';
let str2 = "lllllllll";
let str3 = `kkkkkkkkk`;
//判断一个字符串在不在某个字符串里面
let index1 = str1.indexOf('啦啦');
console.log(index1);
//截取字符串
let str4 &
最低0.47元/天 解锁文章
273
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
