首页 > 其他分享 >前端部分面经整理

前端部分面经整理

时间:2022-11-19 01:00:22浏览次数:66  
标签:面经 dom 前端 元素 vm 调用 https 整理 data

1.水平垂直居中,分别都说出两种

https://www.jianshu.com/p/fc95a49821e2

只水平:

①   text-align:center;

2.margin:0 auto;配合  width:fit-content;

④ flex:  display: flex;

    justify-content: center;

只垂直:display: flex;

    align-items: center;

 

2.block和inline的区别块级元素特点:

1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(很霸道,一个块级元素独占一行)

2、元素的高度、宽度、行高以及顶和底边距都可设置。

3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。

 

内联元素特点:

1、和其他元素都在一行上;

2、元素的高度、宽度及顶部和底部边距不可设置;

3、元素的宽度就是它包含的文字或图片的宽度,不可改变。

 

3.选择器的优先级:!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性

 

4.BFC讲一下:创建条件,作用

 

5.relative和absolute的区别

absolute:生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。 relative:生成相对定位的元素,相对于其正常位置进行定位。 两者最核心的区别在于:absolute不受父元素里的其他元素影响,而relative会受到父元素里的其他元素影响。

 

6.判断js数据类型哪些方法

https://www.cnblogs.com/onepixel/p/5126046.html

 

7.防抖节流:手撕

https://www.nowcoder.com/discuss/1048510 手撕合集

 

8.读代码输出题:关于this指向的,还有settimeout,async等同步任务、微任务执行顺序之类的

 

9.localstorage和sessionstorage的区别

sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;localstorage在所有同源窗口中都是共享的;cookie也是在所有同源窗口中都是共享的

 

10.同源策略以及跨域解决方案

见本博客文章:https://www.cnblogs.com/zzzlight/p/16541292.html

11.CORS跨域是在后端还是前端设置

 

12.项目中使用过什么跨域方法

 

13.CSRF攻击说一下,还有什么其他的攻击?

CSRF和XSS  是:对输入(和 URL 参数)进行过滤,对输出进行编码。也就是对提交的所有内容进行过滤,对 url 中的参数进行过滤,过滤掉会导致脚本执行的相关内容;然后对动态输出到页面的内容进行 html 编码,使脚本无法在浏览器中执行。虽然对输入过滤可以被绕过,但是也还是会拦截很大一部分的 XSS 攻击。

防御 CSRF 攻击主要有三种策略:验证 HTTP Referer 字段;在请求地址中添加token 并验证;在 HTTP 头中自定义属性并验证。

https://juejin.cn/post/7104877798753468447

 

14.TCP三次握手和四次挥手,为什么是三次握手而不是两次,为什么是四次挥手而不是三次

小林coding,计算机网络篇

 

15.为什么项目不用vue3做

自己根据情况发挥

 

16.webpack了解嘛?描述一下

 https://vue3js.cn/interview/webpack/webpack.html

 

17.vue的生命周期,以及ajax请求在哪个周期发送

第一点:能更快获取到服务端数据,减少页面 loading 时间;
第二点:放在 created 中有助于一致性,因为ssr 不支持 beforeMount 、mounted 钩子函数。

beforeCreate(创建前): 在数据观测和初始化事件还未开始,data、watcher、methods都还不存在,但是$route已存在,可以根据路由信息进行重定向等操作。

created(创建后):在实例创建之后被调用,该阶段可以访问data,使用watcher、events、methods,也就是说 数据观测(data observer) 和event/watcher 事件配置 已完成。但是此时dom还没有被挂载。该阶段允许执行http请求操作。

beforeMount (挂载前):将HTML解析生成AST节点,再根据AST节点动态生成渲染函数。相关render函数首次被调用(划重点)。

mounted (挂载后):在挂载完成之后被调用,执行render函数生成虚拟dom,创建真实dom替换虚拟dom,并挂载到实例。可以操作dom,比如事件监听

beforeUpdate:vm.data更新之后,虚拟dom重新渲染之前被调用。在这个钩子可以修改vm.data更新之后,虚拟dom重新渲染之前被调用。在这个钩子可以修改vm.data更新之后,虚拟dom重新渲染之前被调用。在这个钩子可以修改vm.data,并不会触发附加的冲渲染过程。

updated:虚拟dom重新渲染后调用,若再次修改$vm.data,会再次触发beforeUpdate、updated,进入死循环。

beforeDestroy:实例被销毁前调用,也就是说在这个阶段还是可以调用实例的。

destroyed:实例被销毁后调用,所有的事件监听器已被移除,子实例被销毁

 

标签:面经,dom,前端,元素,vm,调用,https,整理,data
From: https://www.cnblogs.com/zzzlight/p/16905333.html

相关文章

  • 前端面试手撕题整理
    转自https://www.nowcoder.com/discuss/post/398883449182978048担心以后炸了备份一下。基础高频1.手写instanceof//原理:验证当前类的原型prototype是否会出现在实......
  • 后端程序员必会的前端知识-03:Vue2
    三.Vue21.Vue基础1)环境准备安装脚手架npminstall-g@vue/cli-g参数表示全局安装,这样在任意目录都可以使用vue脚本创建项目创建项目vueui使用图形......
  • 【luffy】课程详情页接口,前端搭建,视频播放器,导航栏
    目录1.课程详情页接口2.课程列表前端2.1轻课2.2实战课2.3课程详情2.4视频播放器3.第三方存储视频托管4.搜索导航栏5.搜索前端页面1.课程详情页接口课程章节接......
  • 列表查询接口拼接数据太多,后端不想再加,而一个需求要往里面的二层数据添加一个字段时,再
    因为客户想在列表信息上添加京东价格这个字段,这个字段又在列表查询里面的二级表格里面。后端大哥就说还是重新写一个接口吧。所以我就需要1获取列表数据里面的订单号(arra......
  • luffy之课程详情页接口和搜索导航栏接口和前端
    一、课程章节接口   #课程详情接口只需要在查询所有课程下加上RetrieveModelMixin按照课程id查询即可-http://127.0.0.1:8000/api/v1/course/l......
  • 通过VO对象来接受前端的分页查询的条件
    问题:当进行带条件的分页查询的时候,前端传过来的条件可能有很多,比如id,name,age等等,该如何方便的接收参数呢?答:我们可以通过把参数封装一个到VO对象里面创建一个VO类@ApiMod......
  • 前端RSA加密解密
    1、以下仅适用于数据长度短,长的话会报错import{JSEncrypt}from'jsencrypt'//公钥constkey=`xxxx`//私钥constprivateKey=`xxxxsss`//加密export......
  • 前端
    js ......
  • 常用SQL语句整理
    常用SQL语句整理,示例如下:给表增加字段altertablexx_template_fieldadd`relative_field_key`varchar(255)NULLDEFAULTNULLCOMMENT'关联字段的key',add`relati......
  • 前端base64加密解密
    今天发现一个神奇的问题,用户反馈自己账号密码登不了,但是只有他一个人,然后自己区摸排,发现账号和密码输入的都一样就是登录不了,想到了base64的原因,因为我们的密码在进......