web-面试
文章平均质量分 57
前端面试内容
SpringSir
道阻且长,行则将至。
展开
-
TypeScript中any、unknown、void、never类型讲解
TypeScript中any、unknown、void、never类型讲解1. any2. unknown3. void4. never1. anyany: 表示任意类型都可以,开发中应尽量避免使用let app:any = document.getElementById('box')2. unknownunknown: 一般来说,这个类型并不是开发者手写的,是网络传来的,需要配和断言使用(在使用的时候需要明确这个变量的类型,可以多次指定类型)type A = {name:string}t原创 2022-01-24 17:10:55 · 931 阅读 · 0 评论 -
数组中出现次数最多的数和出现的次数
数组中出现次数最多的数和出现的次数let arr = [44, 44, 44, 11, 22, 33, 22, 11, 22, 33, 44]// 找出每个元素出现的次数let newObj = arr.reduce((accumulatorObj, value) => { accumulatorObj[value] ? accumulatorObj[value] = ++accumulatorObj[value] : accumulatorObj[value] = 1 retu原创 2022-01-20 15:58:24 · 593 阅读 · 0 评论 -
vue2.0动态代理详讲
2.配置示例 devServer: { proxy: { // 只要请求的路径中有 /pdf 就会走这个代理 '/pdf': { // 请求的路径会变成以下路径 target: 'http://61.186.254.137:20001', // 是否开启跨域(如果接口跨域,需要进行这个参数配置) chang原创 2021-12-16 14:27:23 · 1119 阅读 · 0 评论 -
回流(reflow) 与 重绘(repaint)
回流 与 重绘目录浏览器的渲染机制注意回流 与 重绘回流重绘浏览器的渲染机制浏览器采用两个引擎来处理页面的工作, 不同的浏览器使用的渲染引擎不一样渲染引擎: Chrom和Safari使用"WebKit", Firefor使用"Geoko"js引擎浏览器会把html解析成 DOM树, 把css解析成 CSSOM(CSS对象模型);接着会把 DOM树 和 CSSOM, 结合产生 render tree(渲染树);渲染树完成后, 浏览器会根据渲染树布局, 布局结束后会输出一个原创 2021-09-18 23:59:18 · 172 阅读 · 0 评论 -
http缓存
http缓存目录为什么要有http缓存?http缓存之强制缓存http缓存之 协商缓存(对比缓存)协商缓存中的资源标识为什么要有http缓存?当输入网址到加载出页面, 电脑会经过"CPU计算、网络请求、页面渲染"等一系列步骤;“网络请求"是其中最不确定、最耗时的一个环节, 针对这个环节, 我们可以通过"减少网络请求的体积和数量”, 来更快加载出页面, 这是"缓存"存在的原因;通过"缓存"可以实现"减少网络请求的体积和数量";http缓存之强制缓存当第一次访问某个网站, 该网原创 2021-09-17 21:23:00 · 164 阅读 · 0 评论 -
Vue Router两种模式
hash 模式 (默认)工作原理: 监听网页的hash值变化 —> onhashchange事件, 获取location.hash使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载。会给用户好像跳转了网页一样的感觉, 但是实际上没有跳转主要用在单页面应用(SPA)// 模拟原理// 监听页面hash值变化window.onhashchange = function(){ // 获取当前url的哈希值 const _hash = loca原创 2021-09-15 11:04:23 · 140 阅读 · 0 评论 -
Vue2.x和Vue3.x-路由钩子详讲及对比
Vue2.x和Vue3.x-路由钩子详讲及对比vue2.x前置概念:路由钩子分类路由和组件的概念(方便理解钩子函数)全局路由钩子路由配置守卫钩子组件内的守卫钩子路由钩子执行顺序vue3.x对比变化图区别补充:vue2.x前置概念:路由钩子分类一共分3类, 7个钩子路由和组件的概念(方便理解钩子函数)路由和组件是2个概念, 可以粗犷的认为:路由是浏览器网址组件是显示在网页上的不同内容全局路由钩子router.beforeEach(to, from, next){ } 前原创 2021-09-14 20:40:48 · 992 阅读 · 0 评论 -
watch侦听器的使用-Vue2和Vue3
watch:侦听数据变化 (某个值的change事件)vue2.x data(){ return{ num:10 } }, watch:{ num:{ /* * newValue:当前值 * oldValue:修改上一刻的值 */ handler(newValue,oldValue){ // doSomething .原创 2021-09-13 18:36:54 · 142 阅读 · 0 评论 -
vue刷新页面的两种方法(provide / inject的应用)
方法1:直接调用函数将整个页面重载, 以下两种都可以window.location.reload()this.$router.go(0)方法2:采用provide / inject(静刷新)在高阶函数中声明一个reload刷新函数<template> <div id="app" v-if="show"></div></template><script>export default { // 控制显示/隐藏, 实现原创 2021-09-13 17:57:53 · 631 阅读 · 0 评论 -
面试-event loop(事件循环、事件轮询)机制-微任务与宏任务
前置知识JS是单线程的语言;微任务: promise.then()方法宏任务: 定时器, 网络请求, 渲染页面注意: new Promise()的时候, 是同步代码画图释义原创 2021-09-12 18:27:31 · 195 阅读 · 0 评论 -
跨域原因, 多种解决方案
跨域原因是由于浏览器的同源策略限制;跨域指: 当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域JSONP这种方式并不适用于开发, 可以说是被完全淘汰, 但是由于实现复杂, 面试官对于这种方案的深究非常追崇.核心思想: 网页通过添加一个<script>标签的src属性,向服务器请求 JSON 数据,服务器收到请求后,将数据放在一个指定名字的回调函数的参数位置传回来。缺点:需要后端配合才能完成只能发送get请求实现:注意后端返原创 2021-09-11 18:37:51 · 121 阅读 · 0 评论 -
前端-笔试-面试-题目
for in和for of和Object.keys()区别for in, 除了遍历自身的可枚举属性, 还会遍历原型链上所有可枚举的属性, 性能差一些; 开发不推荐使用;支持遍历数组,类数组对象(DOM NodeList),字符串,Map 对象,Set 对象;不支持遍历普通对象;Object.keys() 遍历对象自身可枚举属性, Symbol 属性不会遍历到, 以数组形式返回箭头函数和普通函数区别定位position有几种?盒模型有几种, 区别是什么, 怎么切换?设置元素浮动后, 该元素原创 2021-09-10 19:41:09 · 235 阅读 · 0 评论 -
Vue中$refs和$el的使用
Vue中$refs和$el的使用ref: 给元素或者子组件注册引用信息1. ref加在普通元素上2. ref加在子组件上3. 利用v-for和ref组合获取一组dom节点4. ref使用注意点$el: 获取Vue组件实例挂载的DOM元素原文转载ref: 给元素或者子组件注册引用信息ref有三种用法:1. ref加在普通元素上获取用this.$ref.xxx可以获取到dom元素。<div ref="system">测试</div>// 获取mounted() {转载 2021-09-10 09:29:22 · 1629 阅读 · 0 评论 -
面试-vue自定义组件及2种调用方式
引入:由于项目需求, 部分相同的代码我们会封装成组件, 在需要使用的地方导入,并以标签的形式书写在中,但是在"vant"组件库中, "Dialog 弹出框"组件有2中使用方式通常我们自定义组件, 一般也是通过方式二的形式使用, 今天介绍方式一如何使用编码实现以插件的形式使用组件// 将要显示的组件导入import mymodel from '../components/mymodel.vue'export default { install: function (Vue) {原创 2021-09-09 19:58:56 · 770 阅读 · 0 评论 -
面试-MVC和MVVM区别-Vue为什么没有完全遵守MVVM?
面试-MVC和MVVM区别-Vue为什么没有完全遵守MVVM?MVC和MVVM区别前述MVC概述优缺点MVVM概述MVVM实现者 --- VueVue为什么没有完全遵守MVVM?MVC和MVVM区别前述首先, 这两种都只是一种思想, 一种设计模式很多编程语言根据这种思想设计出了很多框架, 例如Java中的SpringMVC, 前端中的Vue、React、Angular等MVC概述数据要渲染到视图上 定义一个模板引擎 得到数据 再将数据渲染到模板引擎中视图操作控制器原创 2021-09-09 19:27:44 · 606 阅读 · 0 评论 -
面试-回调函数、promise、async--await区别
回调函数容易引起代码的层层嵌套—>“回调地域”,promise就是解决回调地域、优化编码的, 但是并没有从根本上解决代码嵌套问题,async-await 函数则是在这个基础上做的进一步优化,是es6的新特性, 一个语法糖, 它会返回promise中then方法的执行结果,失败的结果用try-catch代码块这个你知道的...原创 2021-09-08 20:35:39 · 178 阅读 · 0 评论 -
undefined与null的区别
null表示"没有对象",即该处不应该有值。典型用法是:作为函数的参数,表示该函数的参数不是对象;作为对象原型链的终点。undefined表示"缺少值",就是此处应该有一个值,但是还没有定义。典型用法是:变量被声明了,但没有赋值时,就等于undefined;调用函数时,应该提供的参数没有提供,该参数等于undefined;对象没有赋值的属性,该属性的值为undefined;函数没有返回值时,默认返回undefined。...原创 2021-09-08 18:17:22 · 439 阅读 · 0 评论 -
js中slice、split、splice、的比较
js中slice、split、splice、的比较首先对单词释义slice注意split注意splice首先对单词释义slice: 强调的是用刀片将某个物体切割成某种特定的形状,因此常常用于食物、工业行业相关的切割。split: 强调的是使用力量将一个物体切成两块或多块。强调的是原本一体的东西被分割成了多块。splice: 连接的意思* 及物动词绞接; 捻接(两段绳子); 胶接; 粘接(胶片、磁带等);* 名词:胶接处,粘接处,铰接处slice语法: arr.slice(原创 2021-09-07 20:12:22 · 221 阅读 · 0 评论 -
vue路由传参-Vue2.x和3.x一样
两种vue路由传参-目录动态路由匹配介绍第一种 query第二种 params动态路由匹配介绍作用 : 跳转路由时给组件传参; + 类似于以前跳转页面window.location.href 传参注意:路由地址使用 path, 路由地址前面的 / 可省略, 因为写的是路径;路由地址使用 name, 路由名字前面的 / 必须省略, 因为写的是路由名称;写法上注意, 跳转传值的时候单词是router, 取值的时候单词是route, 一个有r, 一个没有第一种 query路径传原创 2021-08-14 17:35:23 · 102 阅读 · 0 评论 -
HTTP协议及请求、响应报文
HTTP协议及请求、响应报文目录注意点http协议http请求报文http响应报文注意点注: 以下图片内容基于Chrome浏览器的 Network面板 抓包获取, 但是抓取的数据并不完全符合规范;有条件的同学可以自行购买“HttpWatch”抓包工具的服务.http协议http协议: 规定了客户端和服务器之间, 数据交互时, 数据的格式规范.http组成:http请求: 客户端发送给服务端的数据http响应: 服务端返回给客户端的数据http请求报文由3部分组成:原创 2021-08-12 17:31:36 · 154 阅读 · 0 评论 -
面试 - 地址栏输入url回车后, 发生了什么?
面试 - 地址栏输入url回车后, 发生了什么?目录答案大致如下:用户输入URL地址浏览器解析URL解析出域名浏览器将域名转换成服务器ip地址(浏览器先查找本地DNS缓存列表 没有的话 再向浏览器默认的DNS服务器发送查询请求 同时缓存)浏览器将端口号从URL中解析出来浏览器建立一条与目标Web服务器的TCP连接(三次握手另见文章 -> 面试-三次握手和四次挥手)浏览器向服务器发送一条HTTP请求报文服务器向浏览器返回一条HTTP响应报文断开连接(四次挥手另见文章 -> 面原创 2021-08-11 19:22:34 · 101 阅读 · 0 评论 -
面试-三次握手和四次挥手
面试-三次握手-四次挥手目录TCP/IP报文格式三次握手四次挥手为什么握手一定要三次?为什么挥手一定要四次?TCP/IP报文格式只针对本节需要讲解的内容, 对报文格式内容进行简单提取:序列号(Sequence Number) + 该字段用来标识TCP源端设备向目的端设备发送的字节流,它表示在这个报文段中的第几个数据字节。序列号是一个32位的数。确认号(Acknowledge Number) + TCP使用32位的确认号字段标识期望收到的下一个段的第一个字节,并声明此前的所有数据已经正确无误原创 2021-08-11 19:08:37 · 122 阅读 · 0 评论 -
JS三座大山-同步异步-作用域、闭包-原型、原型链
JS三座大山同步异步前端中只有两个操作是异步的:定时器异步执行;ajax异步请求编译器解析+执行代码原理:编译器从上往下逐一解析代码判断代码是同步还是异步同步:立即执行异步:不执行。放入事件队列池等所有同步执行完毕开始执行异步同步异步区别api : 异步有回调,同步没有回调性能 : 异步性能好(不阻塞线程) 同步会阻塞线程顺序 : 同步有序执行,异步无序执行另:回调函数:如果一个函数的参数是一个函数,那么这个参数函数叫做回调函数作用域、闭包原创 2021-08-07 21:50:24 · 217 阅读 · 0 评论 -
JS之预解析和变量提升
什么是预解析?概念:JS代码在在代码从上往下执行前,浏览器会先把所有变量声明解析一遍, 这个阶段叫预解析。详讲寻找作用域中的var 和function声明(匿名函数没有function声明,所以不会提升),然后对其进行事先声明, 并把赋值操作留在原地,再从上到下执行代码。这就是一个预解析的过程。变量和函数预解析的区别 在预解析时,会把所有用 var 声明的变量, 和 function 声明的函数,提升到所在的作用域最顶端var声明的变量, 在预解析的时, 只是提原创 2021-08-07 21:29:44 · 286 阅读 · 0 评论 -
面试 - 地址栏输入url回车后, 发生了什么?
原文来自于https://blog.csdn.net/weixin_44743841/article/details/106212731 目录 1、在浏览器中输入一个URL 2、浏览器查找域名的IP地址 3、浏览器向web服务器发送HTTP请求 4、服务器的永久重定向响应 5、浏览器跟踪重定向地址 6、服务器处理请求 7、服务器返回一个HTTP响应 8、浏览器显示HTML 9、浏览器发送请求获取嵌原创 2021-08-07 08:47:33 · 197 阅读 · 0 评论 -
面试-浏览器、Node环境下的导入导出
浏览器环境下的导入导出// TODONode环境下的导入导出原创 2021-07-29 12:06:49 · 135 阅读 · 0 评论