- 博客(14)
- 收藏
- 关注
RSS订阅原创 vue2和vue3区别
一、双向数据绑定的原理发生了改变VUE2的双向数据绑定是利用ES5的一个API，object.defineproperty的数据劫持结合发布订阅的方式来实现的。VUE3中使用了es6的proxyAPI对数据处理。二、创建观察者vue2中，不管数据有多大，都会在一开始就为其创建观察者。当数据很大时，可能会在页面载入时造成明显的性能压力，3.0版本，创建观察者，而且3.0的观察者更高效。三、更精准的变更通知比例来说：2.0版本中，使用Vue.set来给对象新增一个属性时，这个对象的所有watcher
2020-10-28 11:53:59
429
原创 Vue高频面试题（一）
1、说说你对 SPA 单页面的理解，它的优缺点分别是什么？SPA（ single-page application ）仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成，SPA 不会因为用户的操作而进行页面的重新加载或跳转；取而代之的是利用路由机制实现 HTML 内容的变换，UI 与用户的交互，避免页面的重新加载。优点：用户体验好、快，内容的改变不需要重新加载整个页面，避免了不必要的跳转和重复渲染；基于上面一点，SPA 相对对服务器压力小；前后端职责
2020-10-28 11:53:25
558
原创 Vuex全面用法总结
什么是Vuex ？Vuex是专门管理vue.js应用程序中状态的一个插件，作用就是将应用中的所有状态放在一起进行集中式管理。管理的状态主要是vue组件中date里面的属性Vuex 的特点vuex的特点是把数据单独隔离，形成一棵树状图。单独隔离就意味着它有自己的生态系统。输入和输出，其中action作为数据的输入，state作为数据的输出。Vuex的使用...
2020-10-28 11:52:29
213
原创 web安全及防护(XSS、CSRF、sql注入)
一、XSS攻击原理Xss（cross-site scripting）攻击指的是攻击者往Web页面里插入恶意html标签或者javascript代码。比如：攻击者在论坛中放一个看似安全得链接，骗取用户点击后，窃取cookie中用户私密信息；或者攻击者在论坛中加入一个恶意的表单，当用户提交表单得时候，却把信息传送到攻击者得服务器中，而不是用户原本以为得信任站点。危害：盗取用户信息，比如：机器登陆账号、用户网银账号、各类管理员账号。控制企业数据，包括：读取、篡改、添加、删除企业敏感数据的能力。
2020-10-28 11:47:37
282
原创 双向数据绑定原理
1.双向数据绑定是通过数据劫持结合发布订阅者的模式和object.defineproprety()来劫持各个属性的setter、getter，如果数据有变动，就发布消息给订阅者触发监听。2.双向数据绑定的步骤：**第一步：**实现一个数据监听器observer，能够对数据对象的所有属性就行监听。如果有变动就拿到最新值并通知订阅者。**第二步：**实现一个指令解析器compile，对每个元素节点和指令进行扫描和解析，根据指令模板替换数据以及绑定相应的更新函数。**第三步：**实现一个watcher，作
2020-10-27 16:47:48
9449
原创 vue-router 两种模式
路由的两种模式一、更新视图但是不重新请求页面，是前端路由原理的核心之1，目前在浏览器环境中这一功能的实现主要有两种：（1）默认是hash模式，路由上方的路径是用#表示（2）history是利用URL中的路径2.如何设置路由模式const router=new VueRouter({ mode:'history', routes:[...]})3.mode区别1.mode：hash多了一个#2.mode：history4.hashHistoryhash(#)的作
2020-10-27 16:08:48
1056
原创 JS面试题（2）
一.Promise1.名词约定promise(首字母小写)对象指的是Promise实例对象Promise首字母大写且单数形式，表示Promise构造函数Promises首字母大写且复数形式，用于指代Promise规范2.为什么有Promises这个东西同步的方式异步的代码，用来解决回调地狱问题。此外，Promise对象提供统一的接口，使得控制异步操作更加容易。3.什么是PromisePromise，简单来说就是一个容易，里面保存着某个未来才会结束的事件的结果。从语法上，Promis
2020-10-22 19:41:30
282
原创 JS面试题（1）
一、JS数据类型有哪些以及值是如何存储的1.js数据类型有哪些javascript一共有八种数据类型：7种基本数据类型：Undefined、Null、Boolean、Number、String、Symbol(es6新增)、Biglnt（es10新增）。1种引用数据类型：Object(由一组无序的名值对组成)，里面包含function、Array、Date等。javascript不自持任何创建自定义类型的机制，而所有值最终都是上述的八种数据类型之一。2、如何存储1.基本数据类型：直接存储在栈（s
2020-10-21 19:30:46
169
原创 Html和Css面试题总结
一、盒模型1.盒模型由content、margin、padding、border四部分组成。2.分别为标准盒子模型：width+margin+padding+border和怪异盒模型：width+margin（width包含了padding和border）3.盒子转换：border-box和content-box二、BFC1.BFC就是块级格式化上下文，BFC是一块独立的区域，内部元素不受外界影响同时也不会影响到外部，是css的一种布局方式，可以用来解决边距重叠问题。2.父子关系的边距重叠：父
2020-10-20 10:53:35
267
原创 Vue项目上线前的优化及打包上线流程
项目优化策略生成打包报告第三方库启用CDNElment-ui组件按需加载路由懒加载图片懒加载图片压缩以及雪碧图首页定制内容1.生成打包报告打包时，为了直观的发现项目中的问题，可以在打包项目时生成报告，生成报告的方式有两种：1.通过命令行参数的形式生成报告通过vue-cli的命令选项可以生成打包报告–report选项可以生成report，html帮助分析内容vue-cli-service build --report2.通过可视化的UI面板直接查看报告（推荐使用）在可视化
2020-10-16 18:54:45
550
1
转载 Vue项目首页优化问题
1. vendor.js 优化(减少体积)由于Vue项目随着功能变多 依赖也会随之变多，减少vendor.js的主要方法就是将其 不打包依赖！！1.1 第一步、cdn引入各种包index.html中cdn的方式引入vue、vuex、axios、vant-ui、element-ui、等包，如下图：1.2 第二步、在使用vue等包的地方，注释掉import引入打开main.js文件 注释掉需要排除的依赖import ，并且注释掉 Vue.use//Vue.prototype.$axios
2020-10-16 18:50:52
156
原创 Vue项目优化
一.代码优化1.keep-alive包裹动态组件，缓存不活动的组件实例而不是销毁他们。不会出现在父组件中，也不会渲染在DOM元素里。include定义缓存白名单；keep-alice会缓存命中的组件。exclude定义缓存黑名单，被命中的组件不会被缓存。很多时候会配合路由meta属性使用。2.路由懒加载Vue是单页面的应用，会有很多的路由引入。这样就会使webpack打包后的文件很大，当首页加载时，加载的资源过多，会有问题可能会出现白屏，使用户的使用体验很差。如果我们能把不同的路由对应的组件
2020-10-16 18:40:27
100
原创 js数组扁平化处理
什么是数组扁平化数组扁平化就是将一个多维数组转换为一个一维数组。数组扁平化的实现方式1.对数组的每一项进行遍历2.判断该项是否是数组3.如果不是数组就直接放进新数组4.是数组就回到1，继续迭代5.当数组遍历完成，就返回这个新数组一.常规方式，递归处理Array.prototype.flatten = function () { var resultArr = []; var len = this.length; for (var i = 0; i < len; i +
2020-10-09 16:40:15
113
原创 Vue项目优化——图片优化
一.图片保存阶段ps或者sketch等图片，保存时或保存后，使用photoshop1.jpg图片选择“连续”
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人