web前端_腾讯校招一面
自我介绍
项目相关(根据简历提问)
首页白屏卡屏过久,详细说一下你的解决方式
- 和后端(Java)同学商量之后,决定分页加载数据
- 路由懒加载
- 数据冻结
object.freeze
详细说一下Axios
封装的原因、封装方式及结果
- 原因:在封装之前,网络请求分散在每个组件内部,耦合过高,开发的时候经常要进行重复操作(例如
token
获取),日后难以维护 - 封装方式:新建一个
Axios
对象,设置请求基路径、最大请求时延,在请求前,统一获取token,请求后,对请求错误统一处理,将所有的网络请求都放在api
文件夹下,设置统一出口 - 结果:网络请求时不用再进行错误处理,大幅减少代码量,开发速度加快,日后维护也更加方便
CSS
三列布局(多种方式)
基础设置
<!-- DOM结构 -->
<body><div class="parent"><div class="one"></div><div class="two"></div><div class="three"></div></div>
</body><!-- 基础设置(颜色是为了看到效果) -->
<style>* {padding: 0;margin: 0;box-sizing: border-box;}.parent {width: 100vw;height: 100vh;}.one {background-color: tomato;}.three {background-color: yellowgreen;}.two {background-color: yellow;}.one,.two,.three {height: 100%;}
</style>
方式一:flex
<style>.parent {display: flex;}.one,.three {width: 100px;}.two {flex: 1;background-color: yellow;}
</style>
方式二:calc
<style>.parent {font-size: 0; /* 这里必须把父元素的font-size设为0,不然会解析换行,产生间隙 */}.one,.two,.three {display: inline-block;}.one,.three {width: 100px;}.two {width: calc(100% - 200px);}
</style>
方式三:绝对定位
<style>.parent {position: relative;}.one,.two,.three {position: absolute;}.one,.three {width: 100px;}.one {left: 0;}.three {right: 0;}.two {left: 100px;right: 100px;}
</style>
方式四:float
<style>/* 浮动布局有点特殊,需要将中间自适应块放到后面 */.parent {min-width: 300px;}.one,.two {width: 100px;}.one {float: left;}.two {float: right;}.three {background-color: turquoise;margin: 0 100px;}
</style>
等分布局,边列靠近两边
- 不定列数,解法类上
JS
原型链
- https://zhuanlan.zhihu.com/p/23090041?refer=study-fe
- https://blog.csdn.net/weixin_44887192/article/details/109115181
typeof
与instanceof
原理
typeof
对于原始类型,除了null
都可以显示正确的类型
typeof
对于引用类型,除了函数都会显示object
instanceof
可以判断一个引用是否属于某构造函数,还可以在继承关系中用来判断一个实例是否属于它的父类型
instanceof
的判断逻辑是: 从当前引用的proto
一层一层顺着原型链往上找,能否找到对应的prototype
,找到了就返回true
JS
继承方式
《JavaScript高级程序设计第4版》8.3节
- 原型链
- 盗用构造函数
- 组合继承
- 原型式继承
- 寄生式继承
- 寄生式组合继承
排序算法有几种
我只说了这几种
- 冒泡排序
- 选择排序
- 插入排序
- 希尔排序
- 归并排序
- 快速排序
- 堆排序
手写Array.sort()
(冒泡排序、快速排序)
数组长度小于10,用的排序方式好像有点争议,我这里用的冒泡
function bubbleSort(sortType) {let data = this;for (let i = 0, l = data.length; i < l; i++) {for (let j = i; j < l - 1; j++) {if (sortType(data[j], data[j + 1])) {let temp = data[j];data[j] = data[j + 1];data[j] = temp;}}}
}function quickSort(sortType, data = this) {if (data.length <= 1) return data;let flagIndex = Math.floor(data.length / 2);let flag = data.slice(flagIndex, 1);let left = [];let right = [];for (let i = 0, l = data.length; i < l; i += 1) {if (sortType(data[i], flag)) {if (data[i] < flag) left.push(data[i]);else right.push(data[i]);} else {if (data[i] < flag) right.push(data[i]);else left.push(data[i]);}}return [...quick(sortType, left), ...flag, ...quick(sortType, right)];
}Array.sort = function (sortType = (a, b) => a - b) {let data = this;if (data.length <= 10) {bubbleSort.call(this, sortType);} else {quickSort.call(this, sortType);}
};
web前端_腾讯校招一面相关推荐
- 开发web前端_移动前端开发和web前端开发的区别?
如果说非要有区别的话应该就是开发的软件和方式不同,因为他们本来就不属于一端的东西,具体来看看下面: web前端开发 用最简单粗暴的方式来讲,就是用html + css + javascript来构建一 ...
- 从零学web前端_从零到前端英雄(第2部分)
从零学web前端 This article is part two of the "From Zero to Front-end Hero" series. In part one ...
- 从零学web前端_从零到前端英雄(第1部分)
从零学web前端 I remember when I first started learning front-end development. I encountered so many artic ...
- Web前端_项目实践01_萌娃摄影网页(纯HTML+CSS静态页面)
众所周知,学前端只看不写等于"我没学过",但是我们初学者常常因为找不到合适的网页素材而苦恼.有的太复杂,很多知识没学过:有的太粗糙,没有做的兴趣.正巧,我这儿有份儿合适的,纯HTM ...
- Web前端_邮箱的正则表达式
最正宗的邮箱正则表达式 ^[A-Za-z\d]+([-_.][A-Za-z\d]+)*@([A-Za-z\d]+[-.])+[A-Za-z\d]{2,5}$ js中代码: <script typ ...
- Web前端_项目实践02_ins北欧风多肉植本店主网页(纯HTML+CSS静态页面)
众所周知,学前端只看不写等于"我没学过",正巧,我这儿有份儿合适的练手素材,纯HTML+CSS实现,够简单,页面比某些书本上的陈旧素材好看,有兴趣的话,一起来尝试吧. 先上完整效果 ...
- Web前端_配合swiper滑动插件实现同比例双指缩放图片
参考过的一篇文章:https://blog.csdn.net/gl0ry/article/details/56055414 html实例代码: 缩放的图片需要放在class 为list 的div里面 ...
- Web前端_如何清除微信内置浏览器的缓存
Android 清除微信内置浏览器缓存: 先点击这个链接 升级下浏览器的内核: debugmm.qq.com/?forcex5=true 在点击这个链接 : http://debugtbs.qq.co ...
- 前端传中文文件名_前端工程师需要掌握哪些知识,web前端开发规范总结
Web前端作为开发团队中不可或缺的一部分,需要按照相关规定进行合理编写(一部分不良习惯可能给自己和他人造成不必要的麻烦).不同公司不同团队具有不同的规范和文档.下面是根据不同企业和团队的要求进行全面详 ...
- 正则至少一个数字_好程序员web前端培训分享JavaScript学习笔记之正则
好程序员web前端培训分享JavaScript学习笔记之正则,正则表达式,又名 "规则表达式" 由我们自己来书写 "规则",专门用来检测 字符串 是否符合 &q ...
最新文章
- WinForm容器内控件批量效验是否允许为空?设置是否只读?设置是否可用等方法分享...
- 5s的app显示无法连接服务器,苹果5s无法连接app store解决方法汇总
- 结构体重定义冲突_有意减脂、调整饮食,体重却增加了?
- 解决Cesium无法加载出地球的问题
- scatter() 散点图样式
- 来自Yang Terry的关于SAP CRM One Order事件回调机制的分享
- 拿到大厂Offer了!
- js导出变量 vue_vue.js前端实现excel表格导出和获取headers里的信息
- web版本 开源压测工具_Web压测工具之Webbench和http_load
- 常用图像数据集大全(分类,跟踪,分割,检测等)
- java面试基础_java面试之基础(总结)
- 数据库工程师中级考试——下午场知识点讲解
- NNDL 作业7:第五章课后题(1×1 卷积核 | CNN BP)
- 微信企业邮箱添加至Windows邮箱客户端
- IDEA Maven下载依赖时报错: ERROR - #org.jetbrains.idea.maven - Cannot reconnect.
- win10睡眠锁定计算机,Win10专业版电脑睡眠和休眠的区别是什么?
- Transformer课程 第7课Gavin大咖 BERT文本分类-BERT Fine-Tuning
- 12-mac中制作u盘启动盘的方法
- 栈内存 堆内存 (数据类型间的存储区别)
- 设计师计算机配置,超全面!写给设计师的电脑配置攻略之PS篇