八股文的总结以及个人理解(随时更新)
1 .如何实现元素水平和垂直居中(经典中的常问)
-
Margin – left 50% , tranform : transtaleX(-50%) 水平居中/垂直居中
-
Flex布局 , 父元素设置display : flex | 设置justify-content align-items
-
定位 position 父元素 position : relative 子元素 position : absolute
-
表格居中 display : table display : table-cell 和 vertical-align
-
HTML5语义化标签 明确含义描述网页的结构和内容,比如
…
增加网页的可读性和可维护性,
提高搜索引擎排序
. 什么是浮动,如何清除他的影响
浮动是css一种布局方式,它可以让元素脱离正常文档流,会造成父元素的高度塌陷
清除浮动的三种方法 :
父元素设置Clearfix
Overflow为父元素创建一个新的格式化上下文(BFC)
. 如何实现响应式布局?
使用相对单位(百分比,em,rem)设置元素的尺寸和间距
使用css框架(bootstrap)或css预处理器(sass,less)简化响应式布局
使用弹性网格(flexbox) 或 网格布局 (gird layout) 来创建灵活的布局
.cookie .sessionStorage和localStorage 的区别
Cookie 是存储客户端浏览期的小型数据文件,存储用户有关信息
SessionStorage 是会话级存储,关闭浏览器就会清除
LocalStorage 是持久化存储 本地存储大小是5mb,cookie是4kb左右
javescript的数据类型 (一共有七种)
Javescript 的数据类型包括原始类型(number,string,boolean,null,undefined,symbol,和引用类型object)
原始类型不可变 引用类型可变 存储在堆中
7 .闭包(重要*)
闭包是访问词法作用域以外的变量的能力(就是局部变量访问全局)
在函数的内部定义函数并返回创建闭包,
常见的使用方式 : 防抖,节流
使用场景 : 模块化开发,创建私有变量,异步操作的回调函数
l 注意 : 需要清除引用 ,避免内存泄漏
8 .原型链(重要*)
l 原型链是javescript实现对象继承的机制,每个对象都有一个原型对象,通过原型链将属性和方法继承到对象上
l 实现方式 : 将一个对象的原型设置为另一个对象,子对象可以访问父对象的属性和方法,同时也可以重写和扩展父对象的属性和方法
9 ,事件委托
l 事件委托是将事件处理程序附加到他们的父元素上,而不是直接附加到每个子元素,好处是减少事件处理程序的数量,提高性能,自由操作添加或删除子元素
10 ,ES6的新特性
- 块级作用域（Block Scoping）：ES6中引入了let和const关键字，可以在块级作用域中声明变量，解决了使用var声明变量导致的变量提升和作用域混乱的问题。
- 函数（Arrow Functions）：箭头函数提供了一种更简洁的函数定义语法，并且自动绑定了上下文的this值。
- 模板字面量（Template Literals）：模板字面量提供了更灵活的字符串拼接方式，并支持嵌入变量和表达式。
- 解构赋值（Destructuring Assignment）：解构赋值允许从数组或对象中提取值并赋给变量，简化了数据的提取操作。
- 模块化（Modules）：ES6引入了模块化的语法，使得可以将代码分割为多个模块，并使用export和import关键字进行模块的导出和导入。
- 默认参数（Default Parameters）：在函数参数中可以为参数设置默认值，简化了函数调用时的参数处理。
- 扩展运算符（Spread Operator）：使用三个点（...）将可迭代对象（如数组、字符串）展开，可以将其元素展开为独立的值。
- 类（Classes）：ES6 引入了类的概念，使得使用面向对象编程更加简洁和直观。
- Promise：Promise 是一种处理异步操作的机制，可以更好地处理回调地狱问题，并提供更清晰的异步编程流程。
11 ,Vue3组件通信
l props
l $emit
l expose / ref
l v-model
l provide / inject
l Vuex
Vue2组件通信
l props
l $emit / v-on
l .sync
l v-model
l ref
l provide / inject
l EventBus
l Vuex
l Slot
Vue2和vue3的区别
12 ,Vue3的优点
l 速度更快 重写了虚拟dom实现,模板编译优化,更高效的组件初始化
l 体积更小 webpack 的tree-shaking功能,打包需要的模块
l 更容易维护 componentsAPI 更灵活的逻辑组合和复用
l 更接近原生 可以自定义渲染API
13 ,HTTP缓存机制
l HTTP缓存是浏览器第一次发送请求时存储数据的一种机制,方便后续快速获取数据,提高响应效率和访问速度
l 缓存分为强缓存和协商缓存
l 强缓存 通过Expires 和 cache-control(表示相对客户端的有效时间)指定数据有效期,
l 协商缓存使用if-Modified-Since或if-None-Match来检查数据更新,没有更新就从缓存拿数据
- HTTP和HTPPS的区别
l HTTP是无连接,无状态的协议,
l 而HTTPS是使用SSL/TSL实现客户端验证和加密传输的安全协议,
l SSL/TSL是通过对称加密和公钥加密结合的方式实现加密传输和保证安全
l 两者连接方式不同,默认使用的端口号也不同 HTTP使用80端口号,HTTPS使用443端口号
l HTTPS需要安装数字证书,保证客户端和服务器之间通信是安全的
15.一次完整的HTTP过程是怎样的
l 对网址进行DNS域名解析 ,拿到ip地址
l 根据ip地址,发起三次握手
l 建立TCP连接发起HTTP请求
l 服务器响应请求,浏览器解析htmlda吗
l 浏览器渲染到网页
l 服务器关闭TCP连接
有大量摘抄自其他博主内容,主打一个整理
