面试总结
1、介绍一下你项目中的重难点
2、父子组件传递参数
3、state和props区别
4、props能否被改变,虚拟dom diff算法
5、redux、react生命周期
6、原型原型链,继承的几种方式,前后端联调
7、null和undifined 的区别 ,unll和undifined有没有toString()方法
undifined:变量被声明了,但是没有赋值,为undifined。对象没有赋值的属性,为undifined。函数没有返回值的时候默认返回undifined
null:表示为原型链的终点
8、antd design api form 添加回显
9、flex布局 口述三栏布局
10、position的几个定位区别
position:realitive 不脱离文档流
position:absolute 脱离文档流
position:fixed 脱离文档流
position:static 默认
position:sticky 粘性定位,不脱离文档流
11、盒模型
标准盒模型:margin border contain ,padding
怪异盒模型:ie盒模型的content包含border和padding
2021 01.26
1、自我介绍
2、说一下你做的这几个项目中你认为比较好的项目吧
我介绍的是我做的后台管理系统(增删改查,权限,二级菜单)
3、react-router-dom优点
我主要说的是switch,Route,exact ,BrowserRouter,hashRouter
4、虚拟dom diff算法 (重点)
5、react合成事件
6、深浅拷贝
深拷贝实现的方法:递归,json对象,json.string,或者json.stringfy
如果是引用数据类型,栈中一般都是来放名字,堆中一般都是来放值的,栈中会提供一个地址指向堆中的值,浅拷贝拷贝的就是这个地址,所以他们还是公用一块内存的,而深拷贝是重新申请了一个堆内存来存放新的值,所以深拷贝和原来不共享一块内存
7、闭包
在一个函数的外部可以访问到该函数内部的局部变量
优点:可以减少全局变量的声明,能够读取函数内部的变量 ,不会在调用结束后,被垃圾回收机制回收
缺点:会造成内存泄漏,极大的占用内存。解决方法:在函数退出前,给引用的变量赋值为null或者清除掉,将不使用的局部变量删除掉
8、垃圾回收机制
标记清楚(在进入函数前进行标记,出函数的时候进行清楚),或者引用计数清楚
9、es6生命变量 const let var 区别
const 是声明一个常量的,var 可以重复定义一个变量,如果不初始化会输出undefined,不会报错,而const不行, let是块级作用域,函数内部使用let定义后,对函数外部无影响
10、symbol(声明一个值,这个值是唯一的不会被改变)
2021 01.27 早上
1、父元素宽高固定、子元素实现居中
position:absolute
left:50%,
top:50%。
margin:-left,-top
或者可以换成transform:translatex,translateY
用flex布局的话,可以用display:flex
flex-direction:column
justify-content:center
Alain-item:center
用gird也可以实现居中:
display: grid; // 设置grid布局方式
justify-items: center; // 主轴居中
align-items: center; // 交叉轴居中
2、选择器权重
!import 最高权重
内联样式选择器为1000
id :100、class:10、标签选择器、
3、transform各个属性
包括旋转:rotate( )、扭曲:skew、translatex、translateY移动、缩放:scale、transform-orign(x,y)旋转基点
4、js基本数据类型
object,string,number,undifined,布尔,null,新增了一个symbol
5、es6新增特性
1、class 继承
2、let 不能够重复声明,独立的块状级作用域,没有声明提升
3、const 声明一个常量,可以修改引用类型(对象)里面的属性,不能修改基本类型
4、模板字符串,里面可以写动态的数据
6、const 基本类型不能修改,对象可以通过修改属性进行修改,
基本类型:布尔,number,string,null,undefined,obj,symbol(声明一个无法改变的值,独一无二的值)
7、= =和===区别
===就是对比值和类型,而 ==只对比值,不对比类型
8、隐式转换和显示转换
undefined与null相等,但不恒等(===)
一个是number一个是string时,会尝试将string转换为number
隐式转换将boolean转换为number,0或1
隐式转换将Object转换成number或string,取决于另外一个对比量的类型
对于0、空字符串的判断,建议使用 “===” 。
“”会对不同类型值进行类型转换再判断,“=”则不会。它会先判断两边的值类型,类型不匹配时直接为false。
1.undefined与null相等,但不恒等(===)
一个是number一个是string时,会尝试将string转换为number
“”会对不同类型值进行类型转换再判断,“=”则不会。它会先判断两边的值类型,类型不匹配时直接为false。
9、项目介绍
11 、平常项目做过拖拽吗,怎么实现的
12、路由跳转的时候有没有遇见过闪烁问题,是怎么解决的
可以在数据初始化的时候,进行判断,如果数据为空,就可以让其显示一段文字“数据为空”。
13、高度塌陷解决方式
给父元素添加一个高度
给父元素添加 overflow:hidden
或者给子元素添加一个空盒子:clear:both,overflow:hidden
14、优雅降级和渐进增强
渐进增强:
针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验
优雅降级:
一开始就构建完整的功能,然后再针对低版本浏览器进行兼容
15、bfc的几种触发方式
1、float的值不为none
2、overflow的值不为visible
3、display的值为table-cell、tabble-caption和inline-block之一
4、position的值不为static或则releative中的任何一个
16、css3实现一个三角形、css3动画(很多人问)
首先,需要把元素的宽度、高度设为0。然后设置边框样式。
width: 0;
height: 0;
border-top: 40px solid transparent;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 40px solid #ff0000;
17、手写、promise
Promise是ES6新增的内置对象,用于解决异步相关的问题。Promise有三种状态,分别是(1)等待中(pending)(2)完成了(resolved)(3)拒绝了(rejected)它还有两个重要的方法,如果请求成功那么执行then方法,如果失败那么执行catch方法。
function promiseAsync(){
let promise = new Promise((resolve, reject) => {
if(success){
// 成功时执行
resolve(fn1)
}else{
// 失败时执行
reject(fn2)
}
})
return promise
}
promiseAsync().then(fn1).catch(fn2)