父子组件生命周期执行过程 vue 2.0 父-beforeCreate父-created父-beforeMount子-beforeCreate子-created子-beforeMount子-mounted父-mounted当父组件里销毁子组件时的执行过程父-beforeUpdate子-beforeDestroy子-destroyed父-updated
Vue的生命周期 生命周期函数想要执行什么,写在对应的声明周期的函数中即可,这个函数vue中自己执行,它会内部进行判断,每个阶段会给它默认的权限“生命过程”beforeCreate(){}组件创建出来就执行的函数,这里数据劫持和事件绑定等等都不会完成,在这里拿到data、methods里面的数据created(){}组件数据劫持和事件绑定等等完成,可以拿到data/method等里面数据,一般ajax请求的数据就会放在这这个函数中,在组件渲染元素之前执行,因此拿不到元素,会返回undefinedbeforeMo
Vue-命令 什么是指令?指令的本质就是自定义属性指令的格式:以v-开始(比如:v-cloak)v-cloak1.提供样式[v-cloak]{display:none};2. 在插值表达式所在的标签中添加v-cloak指令背后的原理:先通过样式隐藏内容,然后在内存中进行值的替换,替换好之后,再显示最终的结果...
前端性能优化汇总 性能优化大汇总/* * 1.利用缓存 * + 对于静态资源文件实现强缓存和协商缓存(扩展:文件有更新,如何保证及时刷新?) * + 对于不经常更新的接口数据采用本地存储做数据缓存(扩展:cookie / localStorage / vuex|redux 区别?) * 2.DNS优化 * + 分服务器部署,增加HTTP并发性(导致DNS解析变慢) * + DNS Prefetch * 3.TCP的三次握手和四次挥手
前端从URL地址看见页面经历了什么? 文章目录HTTP网络层优化从URL地址看见页面经历了什么?第一步 URL解析第二步:缓存检查第三步:DNS解析第四步:TCP三次握手第五步:数据传输第六步:TCP四次挥手为什么连接的时候是三次握手,关闭的时候却是四次挥手?第七步:页面渲染HTTP网络层优化代码编译层优化 webpack代码运行层优化 html/css + javascript + vue + react安全优化 xss + csrf数据埋点及性能监控……CRP(Critical [ˈkrɪtɪkl] Rende
JS盒子模型--scroll概述 scroll系列属性scroll翻译过来就是滚动,我们使用scroll系列的相关属性可以动态的得到该元素的大小以及滚动的距离下表所有值均带padding不带borderscroll系列的作用作用element.scrollTop返回被卷去的上侧距离,返回值不带单位element.scrollLeft返回被卷去的左侧距离,返回值不带单位element.scrollWidth返回自身实际宽度,不含边框,返回数值不带单位element.scrollHeigth
JS盒子模型--client概述 client概述client翻译过来就是客户端,我们使用client系列的相关属性来获取元素可视区的相关信息通过client系列的相关属性可以动态的得到该元素边框的大小、元素大小等client系列属性作用element.clientTop返回元素上边框的大小element.clientLeft返回他不属于左边框的大小element.clientWidth返回自身包括padding 、内容区的宽度、不含边框、返回数值不带单位element.clientHei
前端JS基础面试题总结(6) 1、JS是单线程还是多线程的语言单线程2、渲染页面的过程是同步还是异步执行同步3、列举三个常见的异步执行。两个定时器,ajax,promise.then()4、怎么阻止默认事件执行• e.preventDefault();//阻止默认事件• return false• e.returnValue=false;//IE5、怎么阻止事件冒泡。e.stopPropagation();e.cancelBubble=true;//兼容IE6、简述事件传播机制。在点击事件
前端JS基础面试题总结(5) 1、在正则表达式中,[^&]匹配的是除了&开头的字符2、设置怪异盒模型的css样式是box-sizing:border-box;3、*号用于匹配前面的字符出现零到多次4、/^1[3578]\d{9}$/正则的匹配规则什么字符以1开头,3578中的一个,九个数字(手机号规则)5、验证只能输入5-20个以字母开头、可带数字、“_”、“.”的字串,正则应该怎么写/^[a-zA-Z]{1}([a-zA-Z0-9]|[._]){4,19}$/6、获取页面的可视区域
前端JS基础面试题总结(4) 1、call、bind、apply的区别call改变this并执行函数;bind改变this,但不会执行函数,会把改变this后的函数体返回;apply与call的传参方式不同,需要把传给F函数的参数放到一个数组(或者类数组)中传递进去2、构造函数与普通函数执行的区别构造函数执行之前,首先创建一个对象(创建一个堆内存,暂时不存储任何东西),并且让函数中的执行主体(this)指向这个新的堆内存(this===创建的对象)。执行完以后把this这个堆内存返回。3、构造函数执行,如果有retu
前端JS基础面试题总结(3) 1.值类型和对象类型的数据有什么不同?值类型:存在栈内存中,是按值操作对象类型:存在堆内存中,是按地址操作2.let与var有什么区别。let、const:• 不存在变量提升。• 只能声明一次,不能重复声明• 变量声明出来存在VO(变量对象)或AO(活动对象)中,不会给window增加属性var:• 有变量提升• 在全局中声明的变量,会给window增加一个属性。3.简要描述一下变量提升机制。)当栈内存(作用域)形成,js代码执行之前,浏览器会把所有带有var/functi
前端JS基础面试题总结(2) 1、JS中设置定时器的两种方法:setTimeout 、 setInterval2、函数中内置接收参数的集合是:arguments3、把函数体中的某个值返回到外面用:return4、数组的基础知识和应用在数组的后面追加一项(至少两种办法): arr.push 、 arr[arr.length] =x删除数组的最后一项(至少两种办法): pop 、 arr.length–克隆一份和原来一样的数组(至少两种): arr.concat() 、
前端JS基础面试题总结(1) 01、JS的组成部分ES DOM BOM02、JS中的数据类型都有哪些?以及两大类之间的区别?03、检测数据类型的四种方式?(常见面试题)04、JS中创建变量的几种常用方式?05、常用浏览器的内核都有哪些?(常见面试题)...
发布订阅设计模式 设计模式一种编程思想,这类思想会解决一种问题例如:单例模式:简单来说是一个对象,平时使用时用闭包包起来工厂模式:在jQuery中使用$(’’)或者jQuery()包起来,当做普通函数执行,最后创造一个他的实例,使用init中转一下构造函数设计模式:new一个东西执行就是构造函数模式,解决了:可以创造一个类的多个实例,每一个实例之间既是独立的,每一个都有自己的单独属性,而且还能找到所属的公共属性。例如swiper插件,使用它就是要new,因为这个项目中可能有多个,每次使用swiper创造多个轮
基于http网络层的‘前端优化‘ 文章目录扫盲知识URL/URL/URN传输协议域名端口号HASY 哈希值URL编码缓存检查HTTP报文扫盲知识URL/URL/URNURI=URL+URNURI:统一资源标识符URL:统一资源定位符URN:统一资源名称传输协议http/https/ftp…客服端和服务器端用来传输信息的方式’像快递小哥’http:超文本传输协议[除了文本还可以运输音乐/等等之类的]https: ssl 比http更安全,因为要经过sll加密[支付类网站都需要使用https]ftp:文件上传下载协
form表单的基本使用 文章目录form的基本属性actiontargetmethodenctypeform的基本属性actionaction 规定发送表单时,向何处发送数据action属性值应该是后端提供的一个URL地址,这个URL地址专门负责接收表单提交过来的数据当form表单在未指定action属性的情况西下,action的默认值未当前页面的URL地址注意:当提交表单后,页面则会立即跳转action属性指定的UTRL地址targettarget在何处打开页面它有五个值,默认情况下值未_self,表
移动端开发基础必备知识 文章目录rem适配布局物理像素逻辑像素设备像素比rem适配布局1.首先知道em单位,em相对于父元素的字体大小而定义2.不同的是rem的基准是相对于html元素的字体大小比如,根元素()物理像素别名:设备像素,例如电脑设备显示分辨率 1920X1080,真实存在的像素逻辑像素设备像素比在pc端,设备像素比为1,也就是说设备像素(物理像素(CSS像素=>平时页面用的像素))===逻辑像素,在移动端,以上图iphone为例,DPR为2,物理像素宽2,高2,也就是说一个css
前后端交互基础(2)---接口 文章目录什么是接口?接口的概念?分析接口的请求过程接口测试工具什么是接口测试工具,它的好处是什么?接口文档什么是接口文档接口文档的组成部分什么是接口?接口的概念?使用AJAX请求数据的时候,被请求的URL地址,就叫做数据接口(简称:接口)。同时,每个接口必须有请求的方式;所谓请求方式就是GIT或者POST分析接口的请求过程1.通过GET方式请求接口的过程请求—处理—相应用户和数据载体进行交互,希望向服务器提交数据,数据载体拿到用户的数据通过AJAX发起POST请求向服务器发送,服务器拿到后