一、MVVM模式
(1).Model:数据层，包含数据实体和对数据实体的操作
(2).View:界面层，对应于Activity，XML,View，负责数据显示以及用户交互。
(3).ViewModel：关联层，将Model和View进行绑定，Model或者View更改时，实时刷新对方。
它是一种基于前端开发的架构模式，其核心是提供对View 和 ViewModel 的双向数据绑定，这使得ViewModel 的状态改变可以自动传递给 View，即所谓的数据双向绑定。
二、CMD命令
什么是cmd
CMD命令是一种命令提示符，CMD是command的缩写，即命令提示符（CMD），位于C:\Windows\System32的目录下
命令 功能
calc 垃圾整理
devmgmt.msc 设备管理器
dvdplay DVD播放器
explorer 打开资源管理器
notepad 打开记事本
magnify 放大镜实用程序
mspaint 画板
mstsc 远程桌面连接
narrator 屏幕“讲述人”
osk 打开屏幕键盘
regedit.exe 注册表
write 写字板
control 控制面板
desk.cpl 屏幕分辨率
shutdown -s -t 600 表示600秒后自动关机
shutdown -a 可取消定时关机
shutdown -r -t 600 表示600秒后自动重启
main.cpl 鼠标属性
mmsys.cpl 声音
Firewall.cpl Windows防火墙
snippingtool 截图工具，支持无规则截图
timedate.cpl 日期和时间
三,CDN
CDN 意为内容分发网络，它是在现有网络基础之上的智能虚拟网络，分布在各地的边缘服务器。其基本思路是避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定。
CDN
CDN 就是把原服务器上的数据复制到其他服务器上。用户访问时，可以在复制了数据内容的服务器进行。其目的是使用户可以更快更好的获取所需内容，解决网络拥挤的状况，提高用户访问网站的响应速度。CDN 加速优点是成本低，速度快，适合访问量比较大的网站。
CDN 具有以下主要功能
1.节省骨干网带宽，减少带宽需求量；
2.提供服务器端加速，解决由于用户访问量大造成的服务器过载问题；
3.服务商能使用 Web Cache 技术在本地缓存用户访问过的 Web 页面和对象，实现相同对象的访问无须占用主干的出口带宽，并提高用户访问因特网页面的相应时间的需求；
4.能克服网站分布不均的问题，并且能降低网站自身建设和维护成本；
5.降低“通信风暴”的影响，提高网络访问的稳定性。
CDN 的特点
1.本地 Cache 加速：提高了企业站点（尤其含有大量图片和静态页面站点）的访问速度，并大大提高以上性质站点的稳定性。
2.镜像服务：消除了不同运营商之间互联的瓶颈造成的影响，实现了跨运营商的网络加速，保证不同网络中的用户都能得到良好的访问质量。
3.远程加速：远程访问用户根据 DNS 负载均衡技术智能自动选择 Cache 服务器，选择最快的 Cache 服务器，加快远程访问的速度。
4.带宽优化：自动生成服务器的远程 Mirror（镜像）cache 服务器，远程用户访问时从 cache 服务器上读取数据，减少远程访问的带宽、分担网络流量、减轻原站点 WEB 服务器负载等功能。
5.集群抗攻击：广泛分布的 CDN 节点加上节点之间的智能冗余机制，可以有效地预防黑客入侵以及降低各种 D.D.o.S 攻击对网站的影响，同时保证较好的服务质量 。
四、字符串模板
优点：可以跨行，直接产生多行文本
语法：把字符串写在``里面，${变量、表达式、函数}：获取值
var obj ={
name: '张三',
age: 20
}
// 传统打印
console.log("我的名字叫" + obj.name + ",今年" + obj.age + "岁");
// ES6
console.log(`我的名字叫${obj.name},今年${obj.age}岁`);
- 如果模板字符串的变量没有声明，将报错
- 由于模板字符串的大括号内部，就是执行 JavaScript 代码，因此如果大括号内部是一个字符串，将会原样输出
- 模板字符可以嵌套，但是没有必要
五、数组的增删改查
let array = ['只','因','你','太','美'];
console.log(array);
console.log(array[4]);
console.log(array.length);
//1.新增数组
//添加到末尾
array.push('寄');
array.unshift('美')
console.log(array);//['美', '只', '因', '你', '太', '美', '寄']
//2.删除数组
//删除最后一个数组
array.pop();
console.log(array);//['美', '只', '因', '你', '太', '美']
//删除第一个元素
array.shift();
console.log(array);//['只', '因', '你', '太', '美']
//3.数组改动
array[0]='鸡';
console.log(array);//['鸡', '因', '你', '太', '美']
array[4]='beautifull';
console.log(array);//['鸡', '因', '你', '太', 'beautifull']
//4.删除指定的数组
array.splice(2.2)
console.log(array);// ['鸡', '因']
for (let i = 0; i < array.length; i++) {
const element = array[i];
}六、V-IF和V-SHOW
v-show与v-if的共同点
在 vue 中 v-show 与 v-if 的作用效果是相同的(不含v-else)，都能控制元素在页面是否显示 。
- 当表达式都为 false 时，都不会占据页面位置
- 当表达式结果为 true 时，都会占据页面的位置
v-show与v-if的区别
- 控制手段不同
- 编译过程不同
- 编译条件不同
v-show与v-if的使用场景
v-if 与 v-show 都能控制dom元素在页面的显示
v-if 相比 v-show 开销更大的（直接操作dom节点增加与删除）
如果需要非常频繁地切换，则使用 v-show 较好
如果在运行时条件很少改变，则使用 v-if 较好
七、v-for中的key的作用
1、 key的作用主要是为了高效的更新虛拟DOM，其原理是vue在patch（补丁）过程中通过key可以精准判断两个节点是否是同一个，从而避免频繁更新不同元素，使得整个patch过程更加高效，减少DOM操作量，提高性能。
2、 另外，若不设置key还可能在列表更新时引发一些隐蔽的bug。如某行数据不该更新的却更新了。
3、vue中在使用相同标签名元素的过渡切换时，也会使用到key属性，其目的也是为了让vue可以区分它们，否则vue只会替换其内部属性而不会触发过渡效果。
八、v-if和v-for一同使用的注意事项
v-if 作用 及 语法
v-if 指令用于条件性地渲染所在元素块内容。这块内容只会在指令的表达式返回 true 值的时候被渲染。v-if 指令 可以和 v-else-if、v-else 指令配合使用，使用逻辑和 JavaScript 中的 if...else if... else 一致， 一层一层向下判断，判断条件是否符合，符合则渲染，不符合则继续判断，直到 else 无需判断直接渲染
<!-- 案例一 -->
<div v-if="isShow_1">
当isShow_1 = true 时，展示
</div>
<div v-else-if="isShow_1 && isShow_2">
当isShow_1 = true 且 isShow_2 = true 时，展示
</div>
...
<div v-else>
以上条件渲染均不成立时，展示
</div>
<!-- 案例二 -->
<div v-if="isShow_1">
当isShow_1 = true 时，展示
</div>
<div v-if="isShow_1 && isShow_2">
当isShow_1 = true 且 isShow_2 = true 时，展示
</div>
...
<div v-else>
以上条件渲染均不成立时，展示
</div>
案例一 和 案例二 会形成两种不同的结果。 案例一，至多展示一个元素容器；案例二，至多展示两个元素容器。而且对代码逻辑执行，isShow_1 必定执行，案例一中，isShow_2 不一定，而案例二中 isShow_2 则一定执行里面的渲染条件。需要区分使用方法，灵活使用，往往能带来很好的效果！
v-for 作用 及 语法
v-for 指令 可以接收一个 数组 / 整数 / 对象 来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组或者对象，而 item 则是被迭代的数组元素的别名。具体语法详见下面的案例代码中。
在 v-for 的时候，建议设置key值，并且保证每个key值是独一无二的，这便于 diff 算法进行优化，提高 v-for 指令渲染效率，降低因某些情况下，v-for循环内容过多而导致的性能降低。
九、在父子组件传递数据
一.属性
组件是Vue.js开发中的基本单元，组件之间不可避免的需要传递数据
从父组件向子组件传递数据是最主要的方式，可通过组件的props(属性)和slot(插槽)来实现
vue.js还允许使用更明确的方式定义属性，即通过一个对象而不是一个数组来定义一个组件的各种属性。
使用props选项来定义:
1.使用字符串数组来声明
export default {
props:['name','age']
}2.使用对象的方式来声明
export default {
props:{
key:value,
(key是prop的名称，值是该prop预期类型的构造函数)
name:Sting,
age:Number.
}
}[props单向数据流]
概念:父组件的数据改变了会自动流动到自组件，但是子不允许修改由props流过来的数据
所谓的单向数据流不允许子修改，是不允许改栈，但是可以改堆。
例如:父传了数组给子，在子里面可以通过调用push，pop，shift，unshift，splice等等方法来改 堆。 而且改完后父也会跟着改，因为他们指向的是同一个堆。但是在这里不允许改props上的栈上的数据，父可以改，而且改完后能流入到子。
十、单页应用SPA
优点
1.良好的交互体验
单页应用的内容的改变不需要重新加载整个页面，获取数据也是通过Ajax异步获取，没有页面之间的切换，就不会出现“白屏现象”,也不会出现假死并有“闪烁”现象，页面显示流畅，web应用更具响应性和更令人着迷。
2.良好的前后端工作分离模式
后端不再负责模板渲染、输出页面工作，后端API通用化，即同一套后端程序代码，不用修改就可以用于Web界面、手机、平板等多种客户端。
3.减轻服务器压力
单页应用相对服务器压力小，服务器只用出数据就可以，不用管展示逻辑和页面合成，吞吐能力会提高几倍。
缺点
- 如果不对路由进行处理，在加载首页的时候，就会将所有组件全部加载，并向服务器请求数据，这必将拖慢加载速度；
- 通过查看Network，发现整个网站加载试讲长达10几秒，加载时间最长的就是js、css文件和媒体文件及图片
2.不利于SEO
seo 本质是一个服务器向另一个服务器发起请求，解析请求内容。但一般来说搜索引擎是不会去执行请求到的js的。也就是说，搜索引擎的基础爬虫的原理就是抓取url，然后获取html源代码并解析。 如果一个单页应用，html在服务器端还没有渲染部分数据数据，在浏览器才渲染出数据，即搜索引擎请求到的html是模型页面而不是最终数据的渲染页面。 这样就很不利于内容被搜索引擎搜索到。
3.不适合开发大型项目
大型项目中可能会涉及大量的DOM操作、复杂的动画效果，也就不适合使用Vue、react框架进行开发。
1166
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
