字节前端面试题

CSS
怎么实现边框宽度是 0.5px？
答：首先使用 transform:scale(0.5); 将其缩小到一半，再使用如下代码放大到原来的大小，这时边框就变为 0.5px 了。

CSS

top:-50%;
right:-50%;
bottom:-50%;
left:-50%;
flex 详细介绍属性
答：flex 有以下三个 属性：

flex-grow
flex-shrink
flex-basis
CSS

/* 关键字值 */
flex: auto;
flex: initial;
flex: none;

/* 一个值, 无单位数字: flex-grow */
flex: 2;

/* 一个值, width/height: flex-basis */
flex: 10em;
flex: 30px;
flex: min-content;

/* 两个值: flex-grow | flex-basis */
flex: 1 30px;

/* 两个值: flex-grow | flex-shrink */
flex: 2 2;

/* 三个值: flex-grow | flex-shrink | flex-basis */
flex: 2 2 10%;

/*全局属性值 */
flex: inherit;
flex: initial;
flex: unset;
画半圆
答：

高度设置为宽度的一半
border-radius 设置左右圆角半径为高度值
CSSHTML

.semi-circle {
  width: 100px;
  height: 50px;
  background: #FF9900;
  border-radius: 50px 50px 0 0;
  margin: auto;
}
什么是 BFC 和 IFC
答：

BFC(Block Formatting Contexts)直译为"块级格式化上下文"，就是页面上的一个隔离的渲染区域，容器里面的子元素不会在布局上影响到外面的元素，反之也是如此。如何产生BFC？

float 的值不为 none
overflow 的值不为 visible
position 的值不为 relative和static
display 的值为 table-cell, table-caption, inline-block 中的任何一个
比如常见的多栏布局，结合块级别元素浮动，里面的元素则是在一个相对隔离的环境里运行。

IFC IFC(Inline Formatting Contexts)直译为"内联格式化上下文"，IFC 的 line box（线框）高度由其包含行内元素中最高的实际高度计算而来（不受到竖直方向的padding/margin影响)

IFC一般有什么用呢？

水平居中：当一个块要在环境中水平居中时，设置其为inline-block则会在外层产生IFC，通过text-align则可以使其水平居中。
垂直居中：创建一个IFC，用其中一个元素撑开父元素的高度，然后设置其vertical-align:middle，其他行内元素则可以在此父元素下垂直居中。
伪类与伪元素差别
伪类和伪元素都是用来表示文档树以外的"元素"。
伪类和伪元素分别用单冒号:和双冒号::来表示。
伪类和伪元素的区别，最关键的点在于如果没有伪元素(或伪类)，是否需要添加元素才能达到目的，如果是则是伪元素，反之则是伪类。
CSS 动画里的 GPU 加速开启（3d属性）与原理（GPU）
JavaScript
commonJS 和 es6 模块化的区别
new 一个对象发生了什么
es6 新特性
暂时性死区的定义
如何判断一个对象为空
如何判断 symbol 对象为空
什么是事件循环，事件代理
typeof 和 instanceof 的区别
装箱拆箱，隐式转换
事件循环，V8 与 Libuv 事件循环的差异
原型链，为什么要这么设计
ES5 继承，寄生组合式
ES6 继承，实例成员与静态成员处理
CommonJS 与 ES Module 差异
什么是柯里化和尾递归
Vue
vue 和 jquery 的区别
vue 生命周期
什么时候会使用 keep-alive 组件
实现一个 vue 组件，底部可以滑入滑出。
运行环境
事务的概念
防抖节流应用场景
介绍一下 xss 和 csrf攻击
HTTP
http1.0、http1.1、http2.0 的区别
介绍一下 http 缓存。
Etag 和 Last-modified 比较。
encodeURI 和 encodeURIComponent 的区别
http 协议报文结构
http 状态码
协商缓存为什么做了 http1.1 header 字段的优化

作者：腐烂的橘子
链接：https://leetcode-cn.com/circle/discuss/B56jUg/
来源：力扣（LeetCode）