- 博客(22)
- 收藏
- 关注
RSS订阅原创 前端知识点总结——Vue父子组件执行顺序 / dataset
Vue 父子组件执行顺序由外而内，再由内而外加载顺序：父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted当父组件执行完beforeMount挂载开始后，会依次执行子组件中的钩子，直到全部子组件mounted挂载到实例上，父组件才会进入mounted钩子触发顺序：父beforeUp
2021-09-23 22:30:03
457
原创 前端知识点总结——Vue组件的通信方式 / CSS伪类和伪元素 / CSS3新特性 / 跨域资源共享 CORS / cookie / 盒模型
Vue组件的通信方式父子组件：props / $emit父子组件：$parent/$children 与 $ref父子、兄弟、隔代组件：$emit / $ on通过设置一个空的App.vue作为一个模版的事件中心，用来触发事件和监听事件父子、隔代组件：provide/inject父子、兄弟、隔代组件：Vuex伪类和伪元素伪类作用于元素选择器上单冒号:常见伪类：:link、:visited、:hover、:active、:first-child和:nth-child伪元素作用
2021-09-08 21:32:13
368
原创 前端知识点整理——v-if 和 v-show / 事件冒泡和捕获 / Git的操作方式 / canvas有什么优势（canvas 和 svg） / 重排与重绘 / async和defer
v-if 和 v-showv-if是通过控制dom节点的存在与否来控制元素的显隐；v-show是通过设置dom元素的display样式，block为显示，none为隐藏v-if切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件；v-show只是简单的基于css切换v-if有更高的切换消耗；v-show有更高的初始渲染消耗v-if是惰性的，如果初始条件为假，则什么也不做。v-show是在任何条件下（首次条件是否为真）都被编译，然后被缓存，而且dom元素保留事件冒泡和
2021-09-05 22:32:49
791
原创 前端知识点总结——Vuex / 事件循环 / 宏任务和微任务 / Vue3和Vue2的区别以及双向绑定的区别 / Vue的特性 / js垃圾回收机制 / less、sass
Vuex作用：全局状态管理。在state中定义一个数据后，可以在所在项目中的任何一个组件里进行获取、修改，并且修改的结果可以得到全局的响应变更。Vuex的核心部分：State，Getter，Mutation，Actionstate：包含了store中存储的各个状态。const store = new Vuex.Store({ state: { todos: [ { id: 1, text: '...', done: true }, { id: 2, text:
2021-09-01 23:01:17
625
原创 前端知识点总结——HTTP结构的形式
HTTP结构的形式请求报文和响应报文的组成形式：请求行请求头空行消息主体请求行：格式为Method Request-URI HTTP-Version \r\n请求头：通用报头：既可以出现在请求报头，也可以出现在响应报头中Date：表示消息产生的日期和时间Connection：允许发送指定连接的选项，例如指定连接是连续的，或者指定“close”选项，通知服务器，在响应完成后，关闭连接Cache-Control：用于指定缓存指令，缓存指令是单向的（响应中出现的缓存指令在请求
2021-08-29 15:44:41
110
原创 前端知识点总结——强缓存和协商缓存 / Get和Post的区别 / 赋值、浅拷贝、深拷贝 / 手写实现Set类 / src和href
强缓存和协商缓存使用缓存的目的减少重复数据请求，避免通过网络再次加载资源，节省流量。降低服务器的压力，提升网站性能。加快客户端加载网页的速度， 提升用户体验。如果浏览器命中强缓存，则不需要给服务器发请求；而协商缓存最终由服务器来决定是否使用缓存，即客户端与服务器之间存在一次通信。强缓存Expires：是http1.0的规范，值是一个GMT 格式的时间点字符串，比如 Expires：Mon,18 Oct 2066 23:59:59 GMT。这个时间点代表资源失效的时间，如果当前的时间戳在这
2021-08-26 16:15:58
407
原创 前端知识点总结——数组的reduce函数 / 数组扁平化 / 插槽 / 水平、垂直、水平垂直居中 / 防抖和节流 / 行内元素和块元素
数组的reduce函数reduce方法没有独有的特点，它的功能for循环就可以实现，但是它的写法可能更加便捷。arr.reduce(callback,[initialValue])callback （执行数组中每个值的函数，包含四个参数） 1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue）） 2、currentValue （数组中当前被处理的元素） 3、index （当前元素在数组中的索引） 4、array （调
2021-08-23 16:53:25
315
原创 前端知识点总结——蔚来一面面经 / webpack打包的入口 / loader和plugin的区别 / 语义化代码 / Vue路由守卫
webpack打包的入口在vue-cli3中查看webpack的配置信息，输入vue inspect > output.jsentry 入口，告诉webpack要使用哪个模块作为构建项目的起点，默认为./src/main.js entry: { app: [ './src/main.js' ] }output 出口，告诉webpack在哪里输出它打包好的代码以及如何命名，默认为./dist output: { path: '/Users
2021-08-23 10:10:27
266
原创 前端知识点总结——http状态码 / Http和Https的区别 / 网络攻击
http状态码1xx（临时响应）：表示临时响应并需要请求者继续执行操作的状态码。100（继续）请求者应当继续提出请求，服务器此时已经收到部分请求，等待接受其余部分101（切换协议）请求者已要求服务器切换协议，服务器已确认并准备进行切换2xx（成功）：请求已经成功处理200（成功）服务器已经成果处理了请求3xx（重定向）：请求已经完成，需要进一步操作301（永久移动）：请求的网页已经永久移动到新位置。服务器返回此相应时，会自动将请求转到新的位置。302（临时移动）服务器目前从不
2021-08-09 19:25:36
318
原创 前端知识点总结——排序算法
排序算法插入排序时间复杂度空间复杂度O(n^2)O(1)直接插入排序（稳定）：将数组中所有元素依次与前面已经排好的元素相比较，如果选择的元素比已排序的元素小，则交换，直到所有元素都比较过//直接插入排序function insert_sort(arr) { let temp = arr[0] for(let i=1;i<arr.length;i++){ temp = arr[i] //保存当前值，与前面所有元素做比较 for(let
2021-08-05 17:09:11
84
原创 前端知识点总结——Webpack的作用和运行原理 / ES6的Map和Set / 设计模式 / meta标签的作用
Webpack的作用和运行原理Webpack的作用打包：模块打包：一个工程中会分为很多个小的模块，每个小的模块实现一个功能，模块之间相互引用。webpack从入口开始分析每一个包的关系合并成为一个文件。代码转换：es6转换为es5，less、sass转换为css构建一个开发时环境，监听本地源代码变化，自动重新构建和浏览器刷新图片压缩，较小的图片转码为base64在vue项目中使用webpack：由webpack中的vue-loader将vue编译为js文件 => 由babel将
2021-07-28 19:13:38
208
原创 前端知识点总结——Vue框架概述 / 双向绑定 / Vue生命周期 / Vue更新节点 / Vue子父组件通信 / Class类
Vue相关内容vue是一个渐进式框架，就是说vue有很多功能，你需要哪一部分，就可以使用哪一部分到你的项目中。vue的核心特性是数据双向绑定和组件化。除此之外，vue配套的工具库还有vuex和vue-router，前者做状态管理，后者做路由管理。经典图片渐进式框架：可以逐渐添加需要使用的功能，不需要使用的可以不添加。声明式渲染：数据发生变化时，视图可以自动更新，不用关心DOM的操作，专心于数据处理。例如：使用v-for时，我们只告诉Vue需要重复渲染多少次，并没有告诉Vue每一步该如何操作。这个
2021-07-26 17:28:47
322
原创 前端知识点总结——bind、call、apply的区别 / null和undefined的区别 / BFC / 跨域相关问题 / Promise
bind、call、apply的区别apply：apply(this,[])第一个参数是this的指向，第二个参数是函数接受的参数数组，必须是数组形式，该方法会立即执行。let nums = [1,2,3,4,5]let temp = 0temp = Math.max.call(null,nums[0],nums[1],nums[2],nums[3],nums[4])console.log(temp); // 5call：call(this,args,args,...,)第一个参数是this的
2021-07-19 20:37:52
230
原创 前端知识点总结——图片懒加载 / localStorage和sessionStorage、cookie区别 / 垂直居中
实现图片的懒加载实现原理是通过判断图片是否在浏览器窗口显示，显示时在进行加载 let length = document.getElementsByTagName('img').length //获取图片总数量 let imgs = document.getElementsByTagName('img') //获取图片列表 let now = 0 window.onscroll = lazylaod function lazylaod() { let height = document
2021-07-18 15:58:39
150
原创 2022 秋招前端 字节一面
Http1.0 和 1.1 的区别最直观的区别是http1.0不支持持久链接，链接无法复用。浏览器的每次请求都会和服务器重新建立tcp连接和慢启动（最开始的发送量会指数级增长，当到达了慢启动阈值的时候进行加法增大，直到出现网络拥塞后重新进行慢启动，通过动态减少发送量缓解网络拥塞问题），并且请求完之后服务器立即断开连接，不跟踪每个浏览器的历史请求。这样会花费大量的时间在建立连接上，当连接数增多时丢包的几率也会增加，更加延长了连接时长。其次http1.0在发送...
2021-07-16 17:18:20
165
原创 原型对象、原型链、prototype、__proto__的理解
PS：原型的概念还是很抽象，想要一次掌握还是很困难，需要不断复习，重复理解，加深印象。多看看不同人的讲解思路，每个人的思路都不同，可以从多维度的来理解！我也来分享一下我对原型的理解。首先要知道js中有哪几种数据类型、知道原型的作用是什么、原型是如何在对象中存在的、原型如何使用。JavaScript只有一种结构：对象js中万物皆是对象。出去五种基本类型以外的都是对象。五种基本数据类型包括：String / Number / Boolean / underfine / null剩下的Object /
2021-05-11 17:31:20
761
原创 Element UI + Vue 批量上传图片（只请求一次）
在使用elementui上传组件时，可以一次选择多个文件上传，设置:multiple="true"可以选择多个文件，但是文件请求的时候还是分开请求，多少个图片请求多少次。现在需求时一次请求上传所有选中的图片主要步骤：（1）通过elementui组件选取需要上传图片（2）封装上传函数代码：hmtl部分：<!-- 上传图片 --> <el-dialog title="选择上传图片" :visible.sync="dialogVisible_up_image" width=
2021-04-26 11:17:37
3735
原创 element UI表格下拉栏嵌入地图信息，并且实现手风琴效果
需求：点击某一行下拉显示该用户的位置信息，再次点击时收回，最多只展开一行数据解决步骤：使用element UI table表格的expand属性进行下拉扩展（此时只能点击箭头下拉，后面会增加点击一行任意位置下拉）<el-table-column type="expand"> <template slot-scope="props"> //进行参数传递的入口 <el-form inline class="demo-table-expand"> &l
2021-04-09 11:49:49
339
原创 H5页面（微信也可）中调用手机拨打电话功能
正常情况下直接调用如下代码：<a href="tel:13555555555">打电话</a>Vue中使用动态绑定<a :href="'tel:'+phone">打电话</a>如果要在组件内使用次功能，需要用a标签包裹组件才可生效<a :href="'tel:'+phone"><van-button type="primary">联系用户</van-button></a>上面的代码在绝大多数手机
2021-03-29 14:13:25
3535
原创 微信公众号开发报错40048(无效的url)
微信公众号开发报错40048(无效的url)1. JS接口安全域名配置错误（不要http://）aabcdef.efg.cn/mobile 这种格式2. 设置安全域名时，txt文件未在域名根目录下(我遇到时需要将校验文件放到前端工程里)3. appid错误（用了其他公众号的基本前三个就能解决大部分问题，如果还未解决需要查看获取的URL和实际的URL是否相同...
2021-03-25 15:23:16
1312
原创 微信公众号调用腾讯地图api
微信公众号项目测试号管理项目进行阶段中，需要进行调试，可以申请微信的测试号功能（测试号）申请之后会有appID以及appsecret配置js接口安全域名可以设置本地域名（可以使用ip地址，上线项目只能使用域名不能使用ip地址（不需要前面http部分：192.168.3.196:9020））扫码关注测试公众号在体验接口权限表中：网页服务->网页账号->网页授权获取用户基本信息点击修改image-20210318152103144.png)]首页获取用户信息第一步：用户
2021-03-22 15:32:54
1601
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人