Vue3总结
1.Vue3简介
2020年9月18日，Vue.js发布3.0版本，代号：One Piece（海贼王）
耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者
github上的tags地址：https://github.com/vuejs/vue-next/releases/tag/v3.0.0
2.Vue3带来了什么1.性能的提升
打包大小减少41%
初次渲染快55%, 更新渲染快133%
内存减少54%
……
2.源码的升级
使用Proxy代替defineProperty实现响应式
重写虚拟DOM的实现和Tree-Shaking
……
3.拥抱TypeScript
Vue3可以更好的支持TypeScript
4.新的特性
Composition API（组合API）
setup配置
ref与reactive
watch与watchEffect
provide与inject
……
新的内置组件
Fragment
Teleport
Suspense
其他改变
新的生命周期钩子
data 选项应始终被声明为一个函 ...
Vue2总结一、Vue核心官网：https://cn.vuejs.org/
1. Vue简介1.1 介绍和描述Vue是一套用来动态构建用户界面的渐进式JavaScript框架
1.2 vue特点
遵循MVVM模式
编码简介，体积小，运行效率高，适合移动/pc端开发
本身只关注UI，可以引入其他第三方库开发项目
采用组件化模式，提高代码复用率、且让代码更好维护
1.3 SPA页面单页面应用程序，也就是整个应用只有一个html文件
优点
即时性
不需要加载整个页面就可以修改内容
页面之间的切换不会出现白屏的现象
服务器压力小
缺点
1234- 首次加载耗时比较多(因为首次需要一次性加载完所有的资源)- 不利于 SEO- CSS 命名冲突- 前进后退功能复杂度较高
2. Vue初识2.1 模板语法1. 插值语法123456789描述：在标签之间使用后 {{}} 进行插值，页面渲染后，{{}} 内的语法会替换为 data 中的数据。应用：- 直接渲染：<h1>{{m ...
canvas总结一、canvas简介1. 概念canvas是HTML5提出来的，支持IE9以上的浏览器。
是一块画布，可以通过 JS 在上面进行各种图示图表、图像、动画的绘制。
2. 应用场景
验证码
Echarts
网页游戏
图片、视频处理
图片裁剪
二、canvas使用1. 创建画布1.1 创建画布在 html 中创建指定大小的画布，默认 300 * 150px
注：宽高必须设置在标签属性上，如果写在css中，name是对原来的图像尺寸进行缩放
12// 您当前的浏览器不支持 (不支持该语法的就是显示文字，支持的就不会显示出来)<canvas id="myCanvas" width="400" height="300"></canvas>
1.2 获取并渲染1234<script> const canvas = document.getElementById('myCanvas'); const ctx = canvas.getContext(&# ...
一、 前后端交互流程1.前端发起请求 – 我应该知道 我要给什么 我想得到什么2.服务器拦截请求 通过路由分发任务3.分发给控制器 控制解析这个请求,拿到前端发送的参数4.把操作数据库的东西发给给 数据持久的方法5.拿到数据库操作后的结果 结果可能会有几种1.数据操作成功 2.数据操作失败 3.拿到数据6.根据业务逻辑将数据库的结果返回前端7.拿到后返响应给前端的数据 根据业务逻辑 渲染页面
二、 服务器文件夹项目根目录 静态资源目录 public 路由 router 控制器 controller 数据持久化 modules 服务器配置 config 服务器主文件 app.js
三、 配置服务器
初始化服务器
npx express-generator --view=ejs 项目名
自定义配置服务器
安装nrm包 这个包是用来修改 npm源的npm install 代表的意思是通过npm 安装包 npm install nrm -g 这里的-g代表全局安装 nrm test 测试所有的镜像源的网络延迟 nrm ...
CSS入门一、CSS简介1、什么是CSSCSS：Cascading Style Sheet 层叠样式表
是一组样式设置的规则，用于控制页面的外观样式
二、基本用法1、css语法
12345678<head> <style> 选择器{ 属性名：属性值; 属性名：属性值; } </style></head>
选择器：要修饰的对象
属性名：要修饰对象的哪一个属性
属性值：样式的取值
12345678<head> <style> p { font-size:20px; color:pink; } </style></head>
2、css的应用2.1 内部样式12345678910<style> div { color: pink; } </style><body> <div> ...
JS基础一、初识js1. 书写位置
内嵌式的js
外部引入
行内样式
1234567891011121314<head> <style></style> <!-- 2.内嵌式的js --> <script> // alert('沙漠骆驼'); </script> <!-- 3. 外部js script 双标签 --> <script src="my.js"></script></head><body> <!-- 1. 行内式的js 直接写到元素的内部 --> <!-- <input type="button" value="唐伯虎" onclick="alert('秋香姐')"> --></body>
2. 注释123456& ...
一、 跨域问题概述：浏览器基于安全因素的考虑，是不允许进行跨域请求的，如果发生跨域请求，就会发生一下类似的错误。
跨域原因：
协议：http
域名：baidu.com
端口号: 3000
解决：解决方案有很多种，比如前端开发时进行反向代理，使用JSONP，后端设置CORS、配置 nginx 反向代理等等
1. CORS概述：跨域资源共享是一种机制，当一个资源访问到另一个资源时，资源就会发起一个跨域的http请求需要浏览器和服务器同时支持：
node.js处理
12345678app.use('*', function(req, res, next) { res.header('Access-Control-Allow-Origin', '*'); // 表示允许哪些网站访问，上线后应该直接指定ip而不应该 * res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE'); ...
[TOC]
HTML
1. html5有什么优化
2. 如何理解HTML语义化
3. meta标签
CSS
0. css3有什么优化
1. CSS选择器及优先级
2. position 属性的值有哪些及其区别
3. box-sizing属性
4. CSS 盒子模型
5. BFC（块级格式上下文）和IFC(行级格式化上下)
6. 水平垂直居中
自适应两栏布局
三栏布局
7. 用CSS实现三角符号
8. 常见的布局类型（查）
9. 浮动（查）
10. 常见的行内元素和块级元素
11. px,em,rem,vw,vh,rpx等单位的特性
12. 什么是DOM事件流？什么是事件委托(查)
13. 事件冒泡和事件捕捉有什么区别（查）
14. link和@import
15. 响应式布局
16. 元素不可见
JS
0. Object常用的API
1. 基本数据类型
2. 数据类型检测
数据类型转换：
4. 作用域和作用域链
5. 什么是闭包
6. this的指向
7. new 实现
9. == 和===的区别
10. NaN === ...
