- 博客(22)
- 收藏
- 关注
原创 get和post的区别
1、传参get传参是在url地址中,传参的大小是有限制的(因为浏览器对url长度是有限制的),post传参是在body体中,传参大小无上限2、安全性post比get更安全,因为get请求参数在url中,是暴露在外的,而post是在body体中,不能直接看见,因此相对安全3、缓存get可以缓存,可收藏为书签,会在浏览历史留下痕迹,post不可以缓存4、关于回退GET在浏览器回退时是无害的,而POST会再次提交请求5、请求响应速度由于协议规定,就导致get比post更快,
2022-05-10 17:38:07 1561
转载 前端面试常问cookie、session、localStrorage、sessionStrorage区别以及应用场景
一、cookie保存方式:cookie保存在浏览器端生命周期:如果不在浏览器中设置过期时间,cookie被保存在内存中,生命周期随浏览器的关闭而结束,这种cookie简称会话cookie。如果在浏览器中设置了cookie的过期时间,cookie被保存在硬盘中,关闭浏览器后,cookie数据仍然存在,直到过期时间结束才消失。作用:用来跟踪浏览器用户身份的会话方式版本:HTML4本地存储存储的大小:单个cookie保存的数据不能超过4kb应用场景:(1)判断用户是否登陆过网站,以便下次
2022-05-10 16:07:28 1409
转载 Cookie和Session的区别
1.存储位置不同cookie的数据信息存放在客户端浏览器上。session的数据信息存放在服务器上。2.存储容量不同单个cookie保存的数据<=4KB,⼀个站点最多保存20个Cookie。对于session来说并没有上限,但出于对服务器端的性能考虑,session内不要存放过多的东西,并且设置session删除机制。3.存储⽅式不同cookie中只能保管ASCII字符串,并需要通过编码⽅式存储为Unicode字符或者⼆进制数据。session中能够存储任何类型的数据,包括且不限于stri
2022-05-10 15:58:55 806 1
转载 父子组件生命周期执行顺序
我们已经非常熟悉单个的vue组件的生命周期执行顺序了,但是,如果有嵌套组件,父子组件的生命周期的执行顺序是什么?当父子组件在加载的时候,执行的先后顺序为父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted然后理解下这个顺序:1.当父组件执行完beforeMount挂载开始后,会依次执行
2022-05-09 17:00:13 353
原创 Ajax提交与form表单提交的区别
1、使用场景:安全性都一样,都是发送的http协议。安全性与提交文件的业务处理(格式检测,防注入)有关,与提交方式无关。一般登录用表单提交,点击提交触发submit事件,一般会 使页面发生跳转,页面的跳转等行为的控制往往在后端,后端控制页面的跳转及数据的传递;但是某些时候不希望页面跳转,或者说想要将控制权放在前端,通过js来操作页面的跳转或数据变化,一般这种异步操作,都会使用ajax。但是Ajax会有个隐藏的问题,即浏览器不保存密码,不符合用户习惯。理想的方式:建立隐藏的iframe,把form标签的
2022-05-06 17:05:57 1035
转载 JavaScript 中的循环遍历方法
1、Array forEach 循环let arr = [1,2,3];arr.forEach(function(i,index){ console.log(i,index)})// 1 0// 2 1// 3 2forEach循环,循环数组中每一个元素并采取操作, 没有返回值, 可以不用知道数组长度,他有三个参数,只有第一个是必需的,代表当前下标下的 value。另外请注意,forEach 循环在所有元素调用完毕之前是不能停止的,它没有 break 语句,如果你必须要停止,可以尝
2022-05-06 16:24:56 391
原创 数组去重方法
1.用foreach循环let arr1 = [1, 2, 1, 3, 1]; let arr2 = []; arr1.forEach(function (self, index, arr) { console.log(arr.indexOf(self),index) //0 0 //1 1 //0 2 //3 3 //0 4 arr.indexOf(self) === index ? arr2.push(self) : null;
2022-05-06 11:50:34 309
转载 浏览器兼容性问题及解决方案(二)
简述所谓的浏览器兼容性问题,是指因为不同的浏览器对同⼀段代码有不同的解析,造成页⾯显⽰效果不统⼀的情况。常见的浏览器内核(渲染引擎)四种内核: Trident、Gecko、Blink、Webkit 浏览器 内核IE浏览器 Trident 内核,也成为 IE 内核Chrome浏览器 Webkit 内核,现在是 Blink 内核Firefox浏览器 Gecko 内核,俗称 Firefox 内核Safari浏览器...
2022-05-06 10:41:19 452
转载 浏览器兼容性问题及解决方案(一)
一、css兼容1. 不同浏览器的标签默认的margin和padding不同解决方案:CSS里 *{margin:0;padding:0;} 但是性能不好 一般我们会引入reset.css样式重置;2.css3新属性,加浏览器前缀兼容早期浏览器-moz- /* 火狐浏览器 /-webkit- / Safari, 谷歌浏览器等使用Webkit引擎的浏览器 /-o- / Opera浏览器(早期) /-ms- / IE */3.块属性标签float后,又有横行的margin情况下,
2022-05-06 10:28:49 2121
原创 flex布局实现斜对角对齐
要实现的效果:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title&
2022-05-05 17:42:30 683
原创 HTTP相关
一、简述HTTPhttp就是超文本传输协议(英语:HyperText Transfer Protocol,缩写:HTTP),是一种用于分布式系统、协作式系统和超媒体信息系统的应用层协议,一般用在web服务器和浏览器之间的通信,是基于TCP/IP通信协议来传输数据的。二、从输入URL到页面展现经历了哪些过程1、浏览器对网址进行DNS域名解析,得到对应的IP地址,根据IP地址找到对应的服务器,发起TCP三次握手2、建立起TCP连接之后,浏览器向服务器发起HTTP请求3、服务器响应Http请求
2022-04-28 17:46:22 633
转载 三次握手与四次挥手
1.三次握手三次握手(Three-way Handshake)其实就是指建立一个TCP连接时,需要客户端和服务器总共发送3个包。进行三次握手的主要作用就是为了确认双方的接收能力和发送能力是否正常、指定自己的初始化序列号为后面的可靠性传送做准备。实质上其实就是连接服务器指定端口,建立TCP连接,并同步连接双方的序列号和确认号,交换TCP窗口大小信息。刚开始客户端处于 Closed 的状态,服务端处于 Listen 状态。进行三次握手: 第一次握手:客户端给服务端发一个 SYN 报文,并指明客户
2022-04-28 17:40:49 409
转载 数组的方法
1、 array . length : 设置或返回数数组中的元素的个数; 设置 length 属性的值来截断任何数组;2、 Array . isArray ()。 用于确定传递非值是否是一个 Aray . Array . isArray (0)=>...
2022-04-15 17:48:17 70
原创 路由导航守卫
vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。这里有很多方式植入路由导航中:全局的,单个路由独享的,或者组件级的。全局的:beforeEach,beforeResolve,afterEach单个路由独享的:beforeEnter组件级的:beforeRouterEnter,beforeRouterUpdate,beforeRouterLeave完整的导航解析流程:导航被触发。 在失活的组件里调用beforeRouteLeave守卫。 调用全局的bef...
2022-04-15 11:53:57 105
转载 SPA单页面应用
单页面应用也称为SPA(Single Page Application),它主要是网页的界面渲染在一个静态的页面上,当用户要从当前界面跳到另一个界面的时候,在这个过程中,不需要重新加载整个页面,所以页面之间的切换十分快速。多页面在进行页面切换时十分缓慢,在路由进行跳转的时候会加载所有的资源,而且页面重复代码多。对比之下,单页面原理是JavaScript动态修改内容而已,资源只需要局部的刷新,因此SPA具有极高的流畅度,有利于提升用户体验。本系统的页面过多决定了单页面应用更加合适。无论从用户体验还
2022-04-14 17:19:07 876
原创 关于Vuex
1、Vuex可以持久化存储吗?不可以(可能会这么问:组件中应用了state中的一个数据,并进行了修改,但是刷新页面,数据又回去了,这是为什么?因为vuex只是一个仓库,不可以持久化存储,要想持久化存储,只能用localStorage或者cookie)2、Vuex是单向数据流还是双向数据流?单向数据流,组件只能使用不能修改数据,会报错,只能在mutation中修改3、Vuex和localStorage的区别(1).实质区别vuex存的是状态,存储在内存;localStorage是浏览
2022-04-14 16:24:52 1041
原创 v-if 和v-show的区别以及使用场景
1、区别:v-if是通过dom节点是否存在来控制显示隐藏v-show是通过控制dom节点的样式display:none或者diaplay:block来控制显示隐藏初次加载 v-show比v-if更消耗性能,频繁切换v-if比v-show更消耗性能2、使用场景:如果频繁切换用v-show比较好,如果条件很少改变用v-if比较好...
2022-04-14 15:06:39 343
转载 谈谈keep-alive的理解
1、概念keep-alive是Vue的内置组件,当它包裹动态组件时,会缓存不活动的组件实例,而不是销毁。2、功能keep-alive是系统自带的一个组件,用来缓存组件,避免多次加载相同的组件,减少性能消耗,提高用户体验。3、使用场景列表页进入详情页,如果在列表页点击的都是相同的 ,详情页就不用请求多次了,直接缓存起来就行了,如果点击的不同,则需要重新请求数据。4、使用方式方式一:在App.vue中使用keep-alive标签,表示缓存所有页面 <div id="ap
2022-04-14 11:56:51 4022 1
原创 vue2.X生命周期
1、有哪些生命周期beforeCreate(创建前)created(创建后)beforeMount(载入前)mounted(载入后)beforeUpdate(更新前)updated(更新后)beforeDestroy(销毁前)destroyed(销毁后)2、一旦进入页面或者组件会执行哪些生命周期?顺序?beforeCreate(创建前)created(创建后)beforeMount(载入前)mounted(载入后)3、在哪个阶段有$el和data
2022-04-14 10:49:01 929
转载 vue-router的两种模式的区别
vue-router有两种模式,hash和history模式。hash模式,默认是hash模式hash的原理是onhashchange事件 使用URL的hash来模拟一个完整的URL,当URL改变的时候,页面不会加载,也就是单页面应用,当#后面的hash发生变化,不会导致浏览器向服务器发出请求,浏览器不发出请求就会刷新页面,并且会触发hashchange这个事件,通过监听hash值的变化来实现更新页面部分内容的操作对于hash模式会创建hashHistory对象,在访问不同的路由的时候会发生两件事
2022-04-13 11:33:45 2345
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人